JavaScript裡call，apply，bind方法不太容易理解，其實背後的思想並不算非常複雜，希望本文能幫你更好地瞭解這3個很像，而且看似很神祕的方法。

非要用一個關鍵字來點明它們的背後思想的精髓的話，關鍵字就是：this

因為通常程式設計師對C++比較熟，先借用C++，簡單說一下this。

類的成員函式裡，都可以用this來訪問當前類的成員，但問題是成員函式的引數並沒有this這個引數，比如：

Animal a;
a.eat(); 
a.eat("meat"); 

Animal的物件呼叫無參和單引數成員函式eat。在eat方法裡可以用this訪問其他成員。可問題是eat是個"無參"或“單形參”的方法，並沒有一個叫this的形參。

原因在於編譯器會對類的成員函式進行擴充套件。

a.eat();        //編譯器會重寫成：Animal::eat(&a);
a.eat("meat");  //編譯器會重寫成：Animal::eat(&a, "meat");

類的每個成員函式（除static成員函式。因為static是屬於類而非物件的，static和this天生語義不同）都有一個額外的，隱含的形參this。呼叫成員函式時，形參this初始化為呼叫函式的物件的地址。

扯遠了，拉回主題。。。先看JavaScript中的Function.prototype中的call方法：

就像C++一樣，函式或方法的接收者是繫結到this的，但有時需要使用自定義接收者來呼叫函式或方法。call方法就是用於改變this。

function Class1() { 
    this.name = "class1"; 
    this.showName = function() { alert(this.name); } 
} 
function Class2() { 
    this.name = "class2"; 
} 
var c1 = new Class1(); 
var c2 = new Class2(); 

如果你直接在Class2的物件上呼叫showName一定報錯：

c2.showName();    //Error

編譯器會重寫成：Class2::showName(&c2)，顯然Class2裡沒有showName方法將報錯，這一點不奇怪所有人都能理解。

但showName方法太誘人，無論如何都想用呢？有兩個辦法，一個自然是在Class2中自己定義一個showName方法，這沒什麼不好，但有時顯得比較麻煩，且重複程式碼維護起來也是個問題。另一種解決方法就是用call：

c1.showName.call(c2);	//class2

編譯器會重寫成：Class1::showName(&c2)，隱藏的形參this本來是預設指向Class1的物件的，現在call方法將this改變為指向Class2的物件。

這樣就將Class1中定義的showName方法實體應用到Class2的物件上，即用c2的上下文替換c1的上下文

理解了call之後，apply就迎刃而解，因為兩者本質是一樣的，區別在於外在表現：

object.call(this, arg1,arg2,arg3) == object.apply(this, arguments)

從第二個引數起，call方法引數將依次傳遞給借用的方法作引數，而apply直接將這些引數放到一個數組中再傳遞，最後借用方法的引數列表是一樣的。

因為上面這個例子的showName方法沒有引數，因此用call和apply是一樣的：

c1.showName.call(c2);	//class2
c1.showName.apply(c2);	//class2

最後是bind。call和apply是改變this，bind同樣不例外，但改變this後還將方法返回，因此bind準確的語義是：獲得具有確定接收者的方法。

它本質上是得到一個方法，方法可以直接呼叫，也可以被當做引數傳遞給高階函式。

如果直接呼叫那上面這個例子用bind可以改成：

c1.showName.call(c2);	//class2
c1.showName.apply(c2);	//class2
c1.showName.bind(c2)();	//class2

看到bind後面的一對小括號了嗎？如果沒有那對小括號，c1.showName.bind(c2); 僅僅表示一個方法，然後就沒有然後了。加上那對小括號就是直接呼叫"通過bind為方法繫結接收者後返回的方法"

如果只能直接呼叫，那用call和apply即可，bind就沒有存在的價值了，因此另一個作用就是當做引數傳遞給高階函式，一個常用的例子就是用bind實現函式柯里化（將函式與其引數的一個子集繫結的技術稱為函式柯里化）：

function simpleURL(protocol, domain, path) {
    return protocol + "://" + domain + "/" + path;
}

上面是一個非常普通的生成URL地址的函式。但你覺得其實前兩個引數通常是固定不變的，無非是第三個引數要變來變去，你可以這樣：

var urls = paths.map(function(path) {
    return simpleURL("http", "csdn", path);	//前兩個引數都固定，只有第3個引數會變
});

用bind可以簡化上述程式碼：

var urls = paths.map(simpleURL.bind(null, "http", "csdn"));

bind的第一個引數為方法的接收者，由於simpleURL沒有this，因此設為null即可，表示忽略接收者。這樣bind將單個引數path呼叫simpleURL函式委託到simpleURL("http", "baidu", path)函式。