JavaScript中的this

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中新增的会有专门的一个文章来讲解;

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20180607G06C1700?refer=cp_1026
  • 腾讯「云+社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。

扫码关注云+社区

领取腾讯云代金券