原生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