This

This是什么:
this是一个特别的关键字,是自动定义在所有函数和全局的作用域中。this是在运行时绑定的,而不是声明时绑定的。

为什么要有this
假设不存在this关键字,那么对于一个函数根据不同上下文背景下的复用就用传入参数

        var obj = Object.create(null);

        obj.name = 'Nico';

        function speak(context) {
            console.log(context.name + " speaks a word");
        }

        speak(obj);

this指向的几种情况:
1、一般情况下,this是指向当前执行时的对象

var person = {
    name: 'nico',
    getName: function() {
        console.log(this.name)
    }
}

var name = 'siip';

person.getName(); //nico

person对象调用getName方法,所以当前this指向的是person对象

2、如果没有明确对象时,this指向全局对象(在非严格模式下,在严格模式下,函数绑定undefined,也就是this指向undefined)

var name = 'siip';

function className() {
    console.log(this.name);
}

className();//siip

其实这里的className可相似于window.className,所以当前this指向window
3、setTimeout、setInterval、匿名函数this指向全局对象

var person = {
    name: 'nico',
    fns: function() {
        setTimeout(function() {
            console.log(this.name)
        }, 100);//siip

        setInterval(function() {
            console.log(this.name)
        }, 100);//siip

        (function() {
            console.log(this.name)
        })()//siip
    }
}
var name = 'siip';
person.fns();

这些方法都比较容易理解this的指向,因为匿名函数或者定时器函数都是挂载window上的函数,调用者是window对象,这些函数里声明的函数,也指向调用者,类似于:

        function foo() {
            function bar() {
                console.log(this)
            }
            bar();
        }

        foo();

4、apply、call能够改变this指向(无参数时或者传入null、undefined,指向window)

    var person = {
        name: 'nico',
        applyFns: function() {
            console.log(this.name)
        }
    }
    var name = 'siip';
    person.applyFns();//nico
    person.applyFns.apply();//siip

有时候,

5、new Function 构造函数中的this指向该构造函数new出来的对象。

因为new Function的过程大概:

  1. 创建一个新的空对象
  2. 空对象_proto_指向Function.prototype
  3. 空对象与当前函数调用的this绑定
  4. 返回新创建对象

所以new Function中的this指向return的对象。

小结

this的指向取决于函数执行时的块级上下文


NicolaChin
35 声望2 粉丝

互相交流和提高