this

this 是什么?

this 是 JavaScript 中的一个关键字。它通常被运用于函数体内,依赖于函数调用的上下文条件,与函数被调用的方式有关。它指向谁,则完全是由函数被调用的调用点来决定的。

所以,this,是在运行时绑定的,而与编写时的绑定无关。随着函数使用场合的不同,this 的值也会发生变化。但是有一个总的原则:那就是this 总会指向,调用函数的那个对象

1、纯粹的函数调用

这是函数的最通常用法,属于全局性调用,因此 this 就代表全局对象 window。

function test(){
    this.x = 1;
    console.log(this.x);
}
test(); // 1

2、作为对象方法的调用

函数作为某个对象的方法调用,这时 this 就指这个上级对象。

function test(){
    console.log(this.x);
}
var o = {};
o.x = 1;
o.m = test;
o.m(); // 1

3、作为构造函数调用

所谓构造函数,就是通过这个函数生成一个新对象(object)。这时,this 就指这个新对象。

function test(){
    this.x = 1;
}
var o = new test();
console.log(o.x); // 1

4、apply调用

apply() 是函数对象的一个方法,它的作用是改变函数的调用对象,它的第一个参数就表示改变后的调用这个函数的对象。因此,this 指的就是这第一个参数。

var x = 0;
function test() {
    console.log(this.x);
}
var o = {};
o.x = 1;
o.m = test;
o.m.apply(); //0
apply() 的参数为空时,默认调用全局对象。因此,这时的运行结果为0,证明this指的是全局对象。

另一道面试题

最后,让我们来巩固一下 this 的概念和用法。来看一道面试题:

window.val = 1;
 
var obj = {
    val: 2,
    dbl: function () {
        this.val *= 2; 
        val *= 2;       
        console.log('val:', val);
        console.log('this.val:', this.val);
    }
};

 // 说出下面的输出结果
 obj.dbl();
 var func = obj.dbl;
 func();

答案是输出:2 、 4 、 8 、 8 。

解析:

  • 执行 obj.dbl(); 时, this.val 的 this 指向 obj,而下一行的 val 指向 window。所以,由 window.val 输出 2,obj.val 输出 4 。
  • 最后一行 func(); 的调用者是 window。 所以,现在的 this.val 的 this 指向 window。
  • 别忘了刚才的运算结果,window.val 已经是 2 了,所以现在 this.val *= 2; 的执行结果就是 4。
  • val *= 2; 的执行结果,就是 8 了。 所以,最终的结果就是输出 8 和 8 。
 
原文地址:https://www.cnblogs.com/guidan/p/10299104.html