眾所周知岭辣,call,apply甸饱,bind三種方法沦童,都可以改變this的指向,區(qū)別只在于傳參的不同叹话,今天來用原生js對三種方法進(jìn)行封裝偷遗。
首先,要聲明一個函數(shù)作為例子:
var obj={
name:'zss',
say:function (){
console.log(this.name,arguments);
//arguments為函數(shù)中的屬性驼壶,代表接收的所有參數(shù)
}
}
var s={
name:'wsnd'
}
call方法為obj.say.call(s,44);
js方法封裝:
Function.prototype.mycall=function(opt,...arguments){
var opt=opt || window;
//聲明變量氏豌,當(dāng)為空時用window進(jìn)行調(diào)用
var fnName=this.name;
//聲明一個變量為要調(diào)用函數(shù)的函數(shù)名
opt[fnName]=this;
//object[key]=value,添加原函數(shù)中的該屬性
var val=opt[fnName](...arguments);
//聲明一個新的變量接收它热凹,方便于之前加上的屬性進(jìn)行刪除
delete opt[fnName];
return val;
}
obj.say.mycall(s,44);
apply方法和call基本類似泵喘,傳值不同,apply傳入的是一個數(shù)組
Function.prototype.myapply=function (opt,arguments){
var opt=opt || window
var fnName=this.name;
opt[fnName]=this;
var val=opt[fnName](arguments);
return val;
}
obj.say.myapply(s,[33,4,5,52,24]);
bind方法般妙,則是傳入單個參數(shù)時纪铺,自執(zhí)行一個函數(shù)。
Function.prototype.mybind=function (opt,...arguments){
var that=this;
//因?yàn)橐祷匾粋€自執(zhí)行函數(shù)碟渺,聲明一個變量保留this指向
return function(){
var all_argu=arguments.concat(...arguments)
//聲明一個變量鲜锚,拼接調(diào)用apply的參數(shù)和原參數(shù)
that.myapply(opt,arguments);
}
}
obj.say.bind(s,33,4,5,52,24)()
}