JavaScript中的this
JavaScript的this总是指向一个对象,但这个对象并不是在声明时的环境确定的,而是在运行时基于函数的执行环境动态绑定的。
在一般情况下,this的情况由下面的情况决定:
作为对象的方法调用
作为普通函数调用
构造器调用
Function.prototype.call 或 Function.prototype.apply或Function.prototype.bind调用
介绍:
作为对象的方法调用
当函数作为对象的方法调用的时候,函数内部的this指向该对象。如:
作为普通函数调用: 当函数作为普通函数调用的时候,在非严格模式下,this指向全局对象,在浏览器中是对象,在node中是对象。在ES5严格模式下,this指向;
作为普通函数调用时,一般不会有太大的问题,出问题的”时机“一般是普通函数处于回调函数的时候,比如:
因为在调用setTimeout中的函数的时候,函数的运行环境并没有在obj内,还是在window内(此时this指向全局对象window),同时window对象中并没有a属性。所以返回的结果是;
在这里,调整的指向有几种方法:
方法1:使用that先保存的运行环境变量。
在这里,我们在方法中使用先保存的指向,当在setTimeout中需要使用时,直接使用保存运行环境的代替就可以。
方法2:使用ES6中箭头函数
在这里,es6的箭头函数之所以起作用,是因为箭头函数本身没有自己的运行时环境,在运行时,this的运行环境是其”父级“的环境。
方法3:使用apply或call方法
在这里,虽然修改了的指向,但同时,定时器也立即执行了。这里可以把或换成,就可以实现效果。关于,和后边会讲到。
作为构造函数调用
当函数作为一个构造函数被调用的时候往往会返回一个对象,通常会指向这个对象。但当作为构造函数的函数返回的是一个对象的时候,会指向显式返回的对象。
通过或或调用
和可以动态绑定函数调用时的指向,函数内的会指向或传入的参数对象。
关于和的区别和作用,以后ES5中新增的会有专门的一个文章来讲解;
领取专属 10元无门槛券
私享最新 技术干货