JavaScript中this关键字(上)

js中this这个关键字,被自动定义在所有函数的作用域中,先来看一段简单的代码:

图 1


在图1中所示,this关键字则指向了person这个对象,即this可以隐式的传递对象,如果不使用this,则需将this替换成person(如图2中所示)。

this是在运行时进行的绑定,而不是在编写时指定的,这是上一遍作用域中提及过的一点javascript中的作用域 - 简书。this的绑定和函数声明的位置没有任何关系,只是取决于函数的调用方式。函数在调用时会创建一个执行上下文,上下文中会包含函数在哪里调用,函数的调用方法等信息,this只是这个执行上下文的一个属性。

那怎么样去判断this指向的对象是什么呢?很简单,this只指向最近的一个调用者。那就先说说怎么样去绑定this。

绑定this有四种情况:默认绑定,隐式绑定,显示绑定,new关键字绑定

1.默认绑定:先看一段代码


图 3

如图3所示,this.b的值是2,为什么会把this.b解析成全局环境中的var b = 2 ?首先先了解一个概念:申明在全局作用域中的变量就是全局对象中的一个同名属性,两者本质上就是一个东西。其次,函数 a在调用时没有使用任何的修饰符(call,apply,new......),所以this默认是指向的window,所以this.b = 2;

注意:严格模式下无法使用此规则(顺便吐槽一句:简书上没法使用红色的字体吗?本来这里想划重点的)。

2.隐式绑定:还是先看代码吧


图 4

图4中可以看到,obj.a = a函数,在调用的时候使用了obj.a去调用a函数,所以this则指向了obj。隐式绑定中,主要是看函数调用时是否拥有一个上下文对象,隐式绑定会把函数调用中的上下文对象绑定到this上,即obj这个对象拥有了函数a,所以a函数中的this指向了obj,this.b = obj.b。注意:对象属性引用中只有最顶层或者最后一层会影响调用位置,上代码


图 5

由上图可见:函数a中的this.b还是obj中的属性b的值,而不是obj1中的b值。


后续:JavaScript中this关键字(下) - 简书

推荐阅读更多精彩内容