前言
ECMAScript 規(guī)范給所有函數(shù)都定義了 call 與 apply 兩個(gè)方法,它們的應(yīng)用非常廣泛菇用,它們的作用也是一模一樣澜驮,只是傳參的形式有區(qū)別而已。
call()
call(),為改變某個(gè)函數(shù)運(yùn)行時(shí)的上下文(context)而存在的惋鸥,換句話說(shuō)杂穷,是為了改變函數(shù)內(nèi)部的this指向。
call 方法第一個(gè)參數(shù)作為函數(shù)上下文的對(duì)象卦绣,但是后面?zhèn)魅氲氖且粋€(gè)參數(shù)列表耐量,而不是數(shù)組。
// demo1
var sayKlay = {
name :"Klay",
say : function(){
console.log(this.name);
}
}
var sayClam = {
name : 'Clam'
}
/*
sayClam沒有say方法滤港,但是sayKlay()有廊蜒,
所以可以把sayKlay.say()方法的運(yùn)行時(shí)上下文
也就是運(yùn)行時(shí)的this的指向,指向sayClam
這個(gè)時(shí)候用say()方法就可以sayClam了。
*/
sayKlay.say.call(sayClam); // Clam
// demo2
function a(xx) {
this.b = xx;
}
var o = {};
a.call(o, 5);
console.log(a.b); // undefined
console.log(o.b); // 5
apply()
apply方法實(shí)際上是與call方法用法相同山叮,只不過(guò)apply方法傳進(jìn)去的參數(shù)是以數(shù)組形式八堡。
apply 方法傳入兩個(gè)參數(shù):一個(gè)是作為函數(shù)上下文的對(duì)象,另外一個(gè)是作為函數(shù)參數(shù)所組成的數(shù)組聘芜。
function add(a,b) {
this.sum = a + b;
}
var o = {};
add.call(o, 5,5);
console.log(o.sum); // 10
add.apply(o,[3,5]);
console.log(o.sum); // 8
bind()
bind()的作用其實(shí)與call()以及apply()都是一樣的兄渺,都是為了改變函數(shù)運(yùn)行時(shí)的上下文,bind()與后面兩者的區(qū)別是汰现,call()和apply()在調(diào)用函數(shù)之后會(huì)立即執(zhí)行挂谍,而bind()方法調(diào)用并改變函數(shù)運(yùn)行時(shí)的上下文的之后,返回一個(gè)新的函數(shù)瞎饲,在我們需要調(diào)用的地方去調(diào)用他口叙。
var a = 1;
var obj = {
a=9;
};
function example(b){
return this.a+b
};
console.log(example.bind(obj,2)); // 打印出來(lái)的是一個(gè)函數(shù) 不會(huì)立即執(zhí)行
var newexample = example();
newexample(); // 調(diào)用的地方去調(diào)用
對(duì)比
call,apply嗅战,bind 三者用法和區(qū)別:參數(shù)妄田、綁定規(guī)則(顯示綁定和強(qiáng)綁定)、運(yùn)行效率(最終都會(huì)轉(zhuǎn)換成一個(gè)一個(gè)的參數(shù)去運(yùn)行)驮捍、運(yùn)行情況(call疟呐,apply 立即執(zhí)行,bind 是return 出一個(gè) this “固定”的函數(shù)东且,這也是為什么 bind 是強(qiáng)綁定的一個(gè)原因)启具。
注:“固定”這個(gè)詞的含義,它指的固定是指只要傳進(jìn)去了 context珊泳,則 bind 中 return 出來(lái)的函數(shù) this 便一直指向 context鲁冯,除非 context 是個(gè)變量。
詳情參考:
JavaScript 中 apply 色查、call 的詳解
javascript中call(),apply().bind()方法的作用和異同