深入理解JS中this

  |  
 阅读次数

[转]深入理解javascript之this

(2018年2月28日 16:38:18)

javascript中的this含义非常丰富,它可以是全局对象,当前对象或者是任意对象,这都取决于函数的调用方式
函数有以下几种调用方式:作为对象方法调用作为函数调用作为构造函数调用applycall调用。

  • 对象方法调用
    作为对象方法调用的时候,this会被绑定到该对象
    例:略

  • 强调:
    this是在函数执行时去获取对应的值,而不是函数定义时。即使是对象方法调用,如果该方法的函数属性函数名的形式传入其他作用域,也会改变this的指向。我举一个例子:

  • 函数调用
    函数也可以直接被调用,这个时候this绑定到了全局对象

  • 构造函数调用
    在javascript中自己创建构造函数时可以利用this来指向新创建的对象上。这样就可以避免函数中的this指向全局了。

  • apply或call调用
    这两个方法可以切换函数执行的上下文环境,也就是改变this绑定的对象。apply和call比较类似,区别在于传入参数时一个要求是数组,一个要求是分开传入。所以我们以apply为例:

  • 箭头函数调用
    补充:ES6中 箭头函数this始终指向函数定义时的this, 而非执行时
    我们通过一个例子来理解:
    还需要注意一点的就是这个this不会改变指向对象,我们知道callapply可以改变this的指向,但是在箭头函数中无效的。

  • 箭头函数的特性
    箭头函数内部没有constructor方法,也没有prototype,所以不支持new操作。但是它对this的处理与一般的普通函数不一样。箭头函数的this始终指向函数定义时this,而非执行时。我们通过一个例子来理解:


阅读原文