apply和call方法以及bind

每一個函數都包含兩個非繼承而來的方法：apply()和call()。；

call與apply都屬於Function.prototype的一個方法，因此每一個function實例都有call、apply屬性； 做用 call（）方法和apply（）方法的做用相同：改變this指向。

區別 他們的區別在於接收參數的方式不一樣：

call（）：第一個參數是this值沒有變化，變化的是其他參數都直接傳遞給函數。在使用call（）方法時，傳遞給函數的參數必須逐個列舉出來。

apply（）：傳遞給函數的是參數數組 以下代碼作出解釋：

function add(c, d){ r

eturn this.a + this.b + c + d;

}

var o = {a:1, b:3};

add.call(o, 5, 7); // 1 + 3 + 5 + 7 = 16

add.apply(o, [10, 20]); // 1 + 3 + 10 + 20 = 34 

在瞭解一個東西前，先須要瞭解這個東西爲何須要被創造出來

舉個例子，ex：

<script> var a = { name : "fang" , setName : (name) => { console.log(name) } } var b = { name : "zz" } a.setName.call(b,b.name) </script>

如碼所示，在a中有setName方法，可是b中沒有，此時若b要調用setName方法，在b中複寫一次setName方法，就顯得很尷尬，此時就能調用call、apply、bind來實現了

區別：
一樣是上面這個demo，若在apply中實現則要

<script> var a = { name : "fang" , setName : (name) => { console.log(name) } } var b = { name : "zz" } a.setName.apply(b,[b.name]) //apply中只能有兩個參數，第一個參數表示引用單位變量名，第二個參數需以數組形式 </script>

此上兩種方法，實際做用都是【對象b】 調用 【對象a】的方法；都是修改了setName中this的指向；都是立刻進行運行，急打開頁面時控制檯就會立刻出現 「zz」

可是若需求並非「立刻」調用，若是是須要觸發一個條件後再調用呢？
bind就是拿來解決這種狀況的

同樣是上面那個demo，若我須要將次事件綁定到點擊 <span>標籤時，則

HTML

<spna>點擊</span>

<script>

var a = { name : "fang" , setName : (name) => { console.log(name) } } var b = { name : "zz" } document.querySelector('span').onclick = a.setName.bind(b,b.name) </script>

bind的做用是 引用 注意區別於調用

即它並非立刻進行運行，控制檯上不會立刻打印「zz」，只有在綁定到觸發事件上時，被觸發了，纔會調用。例如這裏的點擊一次，打印一次