震惊!this居然是这样的...

244 阅读2分钟

简单了解this

我们在JS代码中时常会见到一个小小的this,比如:

    var a=1;
    let f=()=>console.log(this.a)
    f()

那么上面的this到底是什么意思呢?首先我们知道全局的变量都会挂到window上(let声明的变量不会挂在window上,这一点我在上一篇ES6中关于let的部分提到过),与此同时上面的代码运行后会得到1,那么这里我们可以暂时看作window=this,那么是不是this一直相当于window呢?我们来分析一下。

this的特性

1,this的值随时可能会变,只有在调用时才能确定。

2,不能手动地修改this的值

3,this到底是什么?

this是一个对象,这个对象是指向当前代码中的所需的各类资源。

this在函数内部的四种情况

1,这个函数不是某一个对象的属性,就是一个普通的被调用的函数。

可以看到打印出的结果是window,因为f这个函数也属于全局变量的一种,所以挂在window上,这里的this就指向window。

2,这个函数是一个具体的对象的属性。

上面this所在的函数是obj对象的一个属性,当我们通过obj对象调用这个函数时,这里的this就指向了obj这个对象,从而打印出了obj对象。

3,如果在调用函数之前加一个new的话,会创建并返回一个新的对象,而这个函数内部的this就会指向这个新对象。

4,可以通过Function对象的apply和call方法来指定函数内部的this的值。

这里的apply和call方法可以看作是i对象和j对象借用了f函数,同时this的指向也变成了i和j。 apply的call方法的差异在于apply方法在传递参数时需以数组的形式。

原型链与this的综合应用

1,在数组找指定的元素,如果找到,就返回这个元素的下标。

2,删除数组中的指定的元素如果数组中有这个值,就删除。没有就不做操作。

结论

如果方法内部有this,如何确定这个this的值呢?

  • 谁调用了this,this就指向谁!

  • (1)有明确的对象

          例如:Obj.say();say 的当前对象是obj,所以say中的this 就指向obj。
    
  • (2)没有明确的对象

      如果这个函数没有明确说是哪个对象的,则它肯定是属于window对象的,所以this就会指向window。
    
  • 如果是call和apply的方式

      this指向第一个参数,例如:f.call(obj),f中的this指向obj。
    
  • 在调用方法时,才知道this的真正指向!