原生JS大揭秘—撩开this的面纱

this何意？在英文中this是一个人称代词，表示这个的,具体指哪个？不确定，只有在具体的语境中才可确定，在编程语言中this也有同样的类似特性。
在js中this是一个关键字，它不能被当做变量、属性，也不可以进行赋值操作。
this 随着函数使用场景的不同，而发生变化。
this 是当前执行上下文中的一部分。

this永远指向函数的调用者。

函数内this的取决于函数是如何被调用

• 当函数是独立调用时，this指向全局对象window（非严格模式），undefined（严格模式）
• 当函数是作为一个对象的方法被调用时，this指向该对象
• 构造函数中，this指向new的对象实例
• 在事件处理函数中，this指向触发事件的DOM对象

// 声明一个函数
function show(){
    console.log(this);
}

// 声明一个对象（变量）
var obj={
    _show:show
}

// 独立调用
show(); // window(非严格模式) undefined(严格模式)

// 作为某个对象的方法调用
show._show(); // obj

// 作为构造函数被调用，指向对象实例
var s = new show(); // this->s

// 作为事件处理函数调用
var aLink=document.getElementById("J-link");
// 事件处理函数中，this指向触发事件的DOM对象
aLink.onclick=show; // this->aLink

在JS中一切皆对象，函数也是对象，既然是对象就有属性和方法，在JS中所有的方法都是两个方法call(),apply()

我们可以使用这两个方法来显示更改函数中this的指向，

call、apply这两个函数的共同特点：改变并立即执行。

区别就是传参方式不同

• call是一个一个传入
• apply是传入一个数组，一次性传完。

在ES5中新增了bind(),该方法也是强制更改this指向。

但是bind和call、apply的区别是bind更改this后不会立即执行，它会返回一个新函数。

bind传参也是一个一个的传入

特别注意：
call/apply如果更改为原始值的null、undefined，则this->window
call/apply如果更改为原始值的Number、String、Boolean，则this->对应的包装对象

// 声明一个对象(变量)
var obj={
    name:"tom",
    age :20
};

// 声明一个函数
function show(a, b){
    console.log(this, a, b);
}

// 独立调用
show(1, 2); // this->window(非严格模式) this->undefined(严格模式)

// 强制更改this指向为obj，并立即执行该函数
show.call(obj, 1, 2); // this->obj
show.apply(obj, [1, 2]); // this->obj

// 强制更改this指向obj,不会立即执行，它返回一个新函数，需要去主动执行这个新函数
show.bind(obj, 1, 2)(); // this->obj