javascript中this的四种用法
this
在函数执行时,this 总是指向调用该函数的对象。要判断 this 的指向,其实就是判断 this 所在的函数属于谁。
在《javaScript语言精粹》这本书中,把 this 出现的场景分为四类,简单的说就是:
有对象就指向调用对象
没调用对象就指向全局对象
用new构造就指向新对象
通过 apply 或 call 或 bind 来改变 this 的所指。
1) 函数有所属对象时:指向所属对象
函数有所属对象时,通常通过 . 表达式调用,这时 this 自然指向所属对象。比如下面的例子:
1
2
3
4
5
6
7
8
9
10
11
12
|
var myObject = {value: 100}; myObject.getValue = function () { console.log( this .value); // 输出 100 // 输出 { value: 100, getValue: [Function] }, // 其实就是 myObject 对象本身 console.log( this ); return this .value; }; console.log(myObject.getValue()); // => 100 |
getValue() 属于对象 myObject,并由 myOjbect 进行 . 调用,因此 this 指向对象 myObject。
2) 函数没有所属对象:指向全局对象
1
2
3
4
5
6
7
8
9
10
11
12
13
|
var myObject = {value: 100}; myObject.getValue = function () { var foo = function () { console.log( this .value) // => undefined console.log( this ); // 输出全局对象 global }; foo(); return this .value; }; console.log(myObject.getValue()); // => 100 |
在上述代码块中,foo 函数虽然定义在 getValue 的函数体内,但实际上它既不属于 getValue 也不属于 myObject。foo 并没有被绑定在任何对象上,所以当调用时,它的 this 指针指向了全局对象 global。
据说这是个设计错误。
3) 构造器中的 this:指向新对象
js 中,我们通过 new 关键词来调用构造函数,此时 this 会绑定在该新对象上。
1
2
3
4
5
6
7
|
var SomeClass = function (){ this .value = 100; } var myCreate = new SomeClass(); console.log(myCreate.value); // 输出100 |
顺便说一句,在 js 中,构造函数、普通函数、对象方法、闭包,这四者没有明确界线。界线都在人的心中。
4) apply 和 call 调用以及 bind 绑定:指向绑定的对象
apply() 方法接受两个参数第一个是函数运行的作用域,另外一个是一个参数数组(arguments)。
call() 方法第一个参数的意义与 apply() 方法相同,只是其他的参数需要一个个列举出来。
简单来说,call 的方式更接近我们平时调用函数,而 apply 需要我们传递 Array 形式的数组给它。它们是可以互相转换的。
1
2
3
4
5
6
7
8
9
10
11
12
|
var myObject = {value: 100}; var foo = function (){ console.log( this ); }; foo(); // 全局变量 global foo.apply(myObject); // { value: 100 } foo.call(myObject); // { value: 100 } var newFoo = foo.bind(myObject); |
javascript中this的四种用法的更多相关文章
- 【转】javascript中this的四种用法
在函数执行时,this 总是指向调用该函数的对象.要判断 this 的指向,其实就是判断 this 所在的函数属于谁. 在<javaScript语言精粹>这本书中,把 this 出现的场景 ...
- C#中 this关键字 四种用法
/// <summary> /// 主程序入口 /// </summary> /// <param name="args"></param ...
- c++中for的四种用法
#include <algorithm> #include <vector> #include <iostream> using namespace std; in ...
- Javascript中函数的四种调用方式
一.Javascript中函数的几个基本知识点: 1.函数的名字只是一个指向函数的指针,所以即使在不同的执行环境,即不同对象调用这个函数,这个函数指向的仍然是同一个函数. 2.函数中有两个特殊的内部属 ...
- C#中this的 四种 用法
C#中的this用法,相信大家应该有用过,但你用过几种?以下是个人总结的this几种用法,欢迎大家拍砖,废话少说,直接列出用法及相关代码. this用法1:限定被相似的名称隐藏的成员 /// < ...
- javascript中函数的四种调用模式详解
介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...
- Javascript 中 call 的两种用法
用法一(常见用法): 表现形式为:一个对象.方法.call(另一个对象),意义是用另一个对象代替当前对象,执行当前对象的方法.先看示例: function Class1(){ this.name = ...
- js中this 的四种用法
this 在函数执行时,this 总是指向调用该函数的对象.要判断 this 的指向,其实就是判断 this 所在的函数属于谁. 在<javaScript语言精粹>这本书中,把 this ...
- VBA中Option的四种用法
1.Option Explicit.当使用Option Explicit时,必须在模块中的所有过程声明每一个变量,否则会出现语法错误并不能被编译.这样做的好处是,它能消除程序中因为错拼变量名而导致程序 ...
随机推荐
- JVM内存结构图表展示
1.理解的JVM内存结构 2.对于垃圾回收问题 垃圾的回收只在堆和永久区(方法区)中,因为对于线程而言,私有存储空间如栈.本地方法区.程序计数器等,会随着方法的加载完成而直接释放空间,因此不需要进行 ...
- dubbo的灰度发布
1,什么是灰度发布 当一个接口实现,出现不兼容升级时,可以用版本号过渡,版本号不同的服务相互间不引用. 可以按照以下的步骤进行版本迁移: 在低压力时间段,先升级一半提供者为新版本 再将所有消费者升级为 ...
- 阿里云ECS搭建邮件服务
安装mailx [root@db ~]# yum install -y mailx [root@db ~]# vim /etc/mail.rc 设置发件人信息 ..... set from=yunwe ...
- 学习spring第二天
Spring第二天笔记 1. 使用注解配置Spring入门 1.1. 说在前面 学习基于注解的IoC配置,大家脑海里首先得有一个认知,即注解配置和xml配置要实现的功能都是一样的,都是要降低程序间的耦 ...
- 尝试brpc来升级rpc服务,测试应用过程
照着官方文档来,不过在mac下还是有些小坑 对熟悉c++的人来说很小儿科,但对c++相对比较外行 (只知道基本语法和部分数据结构)的人,还是作不到开箱即用 首先编译```If you need to ...
- mysql统计指定数据库的各表的条数
mysql统计指定数据库的各表的条数 SELECT table_schema,table_name,table_rows,CREATE_TIME FROM TABLES WHERE TABLE_SCH ...
- Monkey通过安装包获取包名
在monkey命令中,包名常作为一个参数.但我们经常知道apk文件,却不知道包名. 如何获取包名呢? 方法一:AAPT 在SDK的build-tools目录下,aapt工具可以查看,创建,更新zip格 ...
- zabbix监控Linux服务器丢包率
http://www.ttlsa.com/zabbix/zabbix-simple-checks/ 这个文章看了,还没有实践 1.先创建监控项,键值如下 icmppingloss[<121.1 ...
- day20-双下new方法,单例模式
# 1. __new__:构造方法,它创造对象,程序员口头语:new一个对象.先执行__new__方法再执行___init__方法. class Goods: def __init__(self):# ...
- Estimating Gene Frequencies| method of maximum likelihood|point estimate
I.11 Estimating Gene Frequencies 在小样本上计算基因A的概率PA,举例如下: 通过加大样本会将通过观察值得到的数趋近于真实数据,所以该问题转化为了统计学上利用大量观察值 ...