摘要：是直接使用不帶任何修飾的函數(shù)引用進(jìn)行調(diào)用的，因此只能使用默認(rèn)綁定，無(wú)法應(yīng)用其他規(guī)則。這通常被稱為裝箱。綁定對(duì)于的初學(xué)者可能會(huì)把它和類的語(yǔ)言混淆首先我們重新定義一下中的構(gòu)造函數(shù)。在中，構(gòu)造函數(shù)只是一些使用操作符時(shí)被調(diào)用的函數(shù)。

前言： 名字取得可能有點(diǎn)大，this 關(guān)鍵字是 JavaScript 中最復(fù)雜的機(jī)制之一。筆者也困擾已久，但自從閱讀了《你不知道的Javascript》以后豁然開(kāi)朗，整理成文。如需更更詳細(xì)的解釋，請(qǐng)閱讀《你不知道的Javascript》第二部分第1章第2章。

最常用的函數(shù)調(diào)用類型：獨(dú)立函數(shù)調(diào)用?？梢园堰@條規(guī)則看作是無(wú)法應(yīng)用 其他規(guī)則時(shí)的默認(rèn)規(guī)則。

function foo() {      
    console.log( this.a ); 
} 
var a = 2; 
foo(); // 2

foo() 是直接使用不帶任何修飾的函數(shù)引用進(jìn)行調(diào)用的，因此只能使用 默認(rèn)綁定，無(wú)法應(yīng)用其他規(guī)則。
ps:不帶任何修飾的函數(shù)的描述如果有疑惑的話請(qǐng)不要糾結(jié)，繼續(xù)看下去就就會(huì)明白。

需要說(shuō)明的一點(diǎn)是：如果使用嚴(yán)格模式（strict mode），那么全局對(duì)象將無(wú)法使用默認(rèn)綁定，因此 this 會(huì)綁定 到 undefined：

  function foo() {  
         "use strict";     
        console.log( this.a ); 
    } 
    var a = 2; 
    foo(); // TypeError: this is undefined

另一條需要考慮的規(guī)則是調(diào)用位置是否有上下文對(duì)象，或者說(shuō)是否被某個(gè)對(duì)象擁有或者包 含，不過(guò)這種說(shuō)法可能會(huì)造成一些誤導(dǎo)。

function foo() {      
    console.log( this.a ); 
    } 
 
var obj = {      
    a: 2,     
    foo: foo  
    }; 
 
obj.foo(); // 2  此處foo里的this就是指的.前面的對(duì)象

ps:啰嗦兩句，為什么obj.foo()可以執(zhí)行,這是一種屬性的引用鏈的寫(xiě)法，因?yàn)閛bj 和foo 都掛在全局作用域上。如果還不明白再舉一個(gè)例子。

function foo() {      
     console.log( this.a ); 
     } 
 
var obj2 = {      
    a: 42,     
    foo: foo  
    }; 
 
var obj1 = {      
    a: 2,     
    obj2: obj2  
    }; 
 
obj1.obj2.foo(); // 42

對(duì)象屬性引用鏈中只有最頂層或者說(shuō)最后一層會(huì)影響調(diào)用位置.此處也就是obj2

這里說(shuō)一個(gè)比較容易出錯(cuò)的地方:

function foo() {      
    console.log( this.a ); 
    } 
var obj = {      
    a: 2,     
    foo: foo  
    }; 
    
var a = "oops, global"; // a 是全局對(duì)象的屬性 
 
 setTimeout( obj.foo, 100 ); // "oops, global

JavaScript 環(huán)境中內(nèi)置的 setTimeout() 函數(shù)實(shí)現(xiàn)和下面的偽代碼類似：

function setTimeout(fn,delay) {     // 等待 delay 毫秒
    fn(); // <-- 調(diào)用位置！ }

setTimeout的參數(shù)fn可以看做調(diào)用時(shí)候傳入的函數(shù)復(fù)制給fn,這個(gè)是掛在全局作用域上的(此處的說(shuō)法不嚴(yán)謹(jǐn)，很多時(shí)候框架的不同此處的this被綁定到哪兒很不確定).所以，回調(diào)函數(shù)丟失 this 綁定是非常常見(jiàn)的。es6 的=>很好的解決了這個(gè)問(wèn)題。

JavaScript 提供的絕大多數(shù)函數(shù)以及你自 己創(chuàng)建的所有函數(shù)都可以使用 call(..) 和 apply(..) 方法。它們會(huì)把這個(gè)對(duì)象綁定到 this，接著在調(diào)用函數(shù)時(shí)指定這個(gè) this。因?yàn)槟憧梢灾苯又付?this 的綁定對(duì)象，因此我 們稱之為顯式綁定。

function foo() {      
    console.log( this.a ); 
    } 
 
var obj = {      
    a:2 
    }; 
 
foo.call( obj ); // 2

通過(guò) foo.call(..)，我們可以在調(diào)用 foo 時(shí)強(qiáng)制把它的 this 綁定到 obj 上。
如果你傳入了一個(gè)原始值（字符串類型、布爾類型或者數(shù)字類型）來(lái)當(dāng)作 this 的綁定對(duì) 象，這個(gè)原始值會(huì)被轉(zhuǎn)換成它的對(duì)象形式（也就是 new String(..)、new Boolean(..) 或者 new Number(..)）。這通常被稱為“裝箱”。

ps:硬綁定只能執(zhí)行一次，之后再綁別的都是綁不上去的。

由于硬綁定是一種非常常用的模式，所以在 ES5 中提供了內(nèi)置的方法 Function.prototype. bind，它的用法如下：

function foo(something) {      
    console.log( this.a, something );      
    return this.a + something; 
    } 
 var obj = {      
    a:2 
    }; 
    
var bar = foo.bind( obj ); 
 
var b = bar( 3 ); // 2 3  

console.log( b ); // 5

bind(..) 會(huì)返回一個(gè)硬編碼的新函數(shù)，它會(huì)把參數(shù)設(shè)置為 this 的上下文并調(diào)用原始函數(shù)。

對(duì)于js的new 初學(xué)者可能會(huì)把它和JAVA類的語(yǔ)言混淆
首先我們重新定義一下 JavaScript 中的“構(gòu)造函數(shù)” 。在 JavaScript 中，構(gòu)造函數(shù)只是一些 使用 new 操作符時(shí)被調(diào)用的函數(shù)。它們并不會(huì)屬于某個(gè)類，也不會(huì)實(shí)例化一個(gè)類。實(shí)際上， 它們甚至都不能說(shuō)是一種特殊的函數(shù)類型，它們只是被 new 操作符調(diào)用的普通函數(shù)而已。

創(chuàng)建（或者說(shuō)構(gòu)造）一個(gè)全新的對(duì)象。

這個(gè)新對(duì)象會(huì)被執(zhí)行 [[ 原型 ]] 連接。

這個(gè)新對(duì)象會(huì)綁定到函數(shù)調(diào)用的 this。

如果函數(shù)沒(méi)有返回其他對(duì)象，那么 new 表達(dá)式中的函數(shù)調(diào)用會(huì)自動(dòng)返回這個(gè)新對(duì)象。

2涉及到原型鏈的知識(shí)，本篇可忽視。

function foo(a) {      
    this.a = a; 
    }  
 
var bar = new foo(2); 
console.log( bar.a ); // 2

使用 new 來(lái)調(diào)用 foo(..) 時(shí)，我們會(huì)構(gòu)造一個(gè)新對(duì)象并把它綁定到 foo(..) 調(diào)用中的 this 上。new 是最后一種可以影響函數(shù)調(diào)用時(shí) this 綁定行為的方法，我們稱之為 new 綁定。

ps:此處可能看得比較費(fèi)解，請(qǐng)閱讀《你不知道的js》第二部的關(guān)于類與原型鏈的章節(jié)，還是比較復(fù)雜的，在此就不展開(kāi)了。此處你可以理解為用函數(shù)new 了一個(gè)新對(duì)象，然后綁定到 函數(shù)的this上使用。

主要目的是預(yù)先設(shè)置函數(shù)的一些參數(shù)，這樣在使用 new 進(jìn)行初始化時(shí)就可以只傳入其余的參數(shù)。bind(..) 的功能之一就是可以把除了第一個(gè) 參數(shù)（第一個(gè)參數(shù)用于綁定 this）之外的其他參數(shù)都傳給下層的函數(shù)（這種技術(shù)稱為“部 分應(yīng)用”，是“柯里化”的一種）。舉例來(lái)說(shuō)：

function foo(p1,p2) {          
    this.val = p1 + p2; 
    } 
 
// 之所以使用 null 是因?yàn)樵诒纠形覀儾⒉魂P(guān)心硬綁定的 this 是什么 
// 反正使用 new 時(shí) this 會(huì)被修改 
var bar = foo.bind( null, "p1" ); 
 
var baz = new bar( "p2" );  
 
baz.val; // p1p2

我們可以根據(jù)優(yōu)先級(jí)來(lái)判斷函數(shù)在某個(gè)調(diào)用位置應(yīng)用的是哪條規(guī)則?？梢园凑障旅娴?順序來(lái)進(jìn)行判斷：
(數(shù)值越小優(yōu)先級(jí)越高)

1 函數(shù)是否在 new 中調(diào)用（new 綁定）？如果是的話 this 綁定的是新創(chuàng)建的對(duì)象。

var bar = new foo()

2 函數(shù)是否通過(guò) call、apply（顯式綁定）或者硬綁定調(diào)用？如果是的話，this 綁定的是 指定的對(duì)象。

var bar = foo.call(obj2)

3 函數(shù)是否在某個(gè)上下文對(duì)象中調(diào)用（隱式綁定）？如果是的話，this 綁定的是那個(gè)上 下文對(duì)象。

var bar = obj1.foo()

4 如果都不是的話，使用默認(rèn)綁定。如果在嚴(yán)格模式下，就綁定到 undefined，否則綁定到 全局對(duì)象。

var bar = foo()

在某些場(chǎng)景下 this 的綁定行為會(huì)出乎意料，你認(rèn)為應(yīng)當(dāng)應(yīng)用其他綁定規(guī)則時(shí)，實(shí)際上應(yīng)用 的可能是默認(rèn)綁定規(guī)則。

如果你把 null 或者 undefined 作為 this 的綁定對(duì)象傳入 call、apply 或者 bind，這些值 在調(diào)用時(shí)會(huì)被忽略，實(shí)際應(yīng)用的是默認(rèn)綁定規(guī)則.

另一個(gè)需要注意的是，你有可能（有意或者無(wú)意地）創(chuàng)建一個(gè)函數(shù)的“間接引用”，在這 種情況下，調(diào)用這個(gè)函數(shù)會(huì)應(yīng)用默認(rèn)綁定規(guī)則。

function foo() {      
    console.log( this.a ); 
    }
    var a = 2;  
    var o = { a: 3, foo: foo };  
    var p = { a: 4 }; 
 
o.foo(); // 3 
(p.foo = o.foo)(); // 2

賦值表達(dá)式 p.foo = o.foo 的返回值是目標(biāo)函數(shù)的引用，因此調(diào)用位置是 foo() 而不是 p.foo() 或者 o.foo()。

1

用硬綁定之后就無(wú)法使用隱式綁定或者顯式綁定來(lái)修改 this。
如果可以給默認(rèn)綁定指定一個(gè)全局對(duì)象和 undefined 以外的值，那就可以實(shí)現(xiàn)和硬綁定相 同的效果，同時(shí)保留隱式綁定或者顯式綁定修改 this 的能力。

if (!Function.prototype.softBind) {

 Function.prototype.softBind = function(obj) {         
 var fn = this;         // 捕獲所有 curried 參數(shù)         
 var curried = [].slice.call( arguments, 1 );          
 var bound = function() {             
 return fn.apply(                 
 (!this || this === (window || global)) ?obj : this                                     
     curried.concat.apply( curried, arguments )             
     );          
  };         
  bound.prototype = Object.create( fn.prototype );         
     return bound;      
     }; }

箭頭函數(shù)并不是使用 function 關(guān)鍵字定義的，而是使用被稱為“胖箭頭”的操作符 => 定 義的。箭頭函數(shù)不使用 this 的四種標(biāo)準(zhǔn)規(guī)則，而是根據(jù)外層（函數(shù)或者全局）作用域來(lái)決 定 this。
之前我們有說(shuō)過(guò)setTimeout的this綁定丟失的問(wèn)題es6和es6以前的解決辦法如下，可以比較著看
es6：

function foo() {      
setTimeout(() => {         // 這里的 this 在此法上繼承自 foo()         
console.log( this.a ); },100); } 
 
var obj = {      
        a:2 
        }; 
 
foo.call( obj ); // 2

es5

function foo() {     
        var self = this; // lexical capture of this      
        setTimeout( function(){ console.log( self.a );     }, 100 ); }  
 
var obj = {     
    a: 2 
    }; 
 
foo.call( obj ); // 2

ES6 中的箭頭函數(shù)并不會(huì)使用四條標(biāo)準(zhǔn)的綁定規(guī)則，而是根據(jù)當(dāng)前的詞法作用域來(lái)決定 this，具體來(lái)說(shuō)，箭頭函數(shù)會(huì)繼承外層函數(shù)調(diào)用的 this 綁定（無(wú)論 this 綁定到什么）。這 其實(shí)和 ES6 之前代碼中的 self = this 機(jī)制一樣。