javascript中call,apply,bind函數(shù)用法示例
本文實(shí)例講述了javascript中call,apply,bind函數(shù)用法。分享給大家供大家參考，具體如下：
一.call函數(shù)
a.call(b);
簡(jiǎn)單的理解：把a(bǔ)對(duì)象的方法應(yīng)用到b對(duì)象上(a里如果有this，會(huì)指向b)
call()的用法：用在函數(shù)上面
var Dog=function(){
this.name="汪星人";
this.shout=function(){
alert(this.name);
}
};
var Cat=function(){
this.name="喵星人";
this.shout=function(){
alert(this.name);
}
};
var dog=new Dog();
var cat=new Cat();
dog.shout();
cat.shout();
如果貓函數(shù)中沒(méi)有shout方法，要達(dá)到一樣的效果
var Dog=function(){
this.name="汪星人";
this.shout=function(){
alert(this.name);
}
};
var Cat=function(){
this.name="喵星人";
};
var dog=new Dog();
var cat=new Cat();
dog.shout();
dog.shout.call(cat);
cat.shout();
call的作用：函數(shù)可以復(fù)用
二、apply函數(shù)
var xh=
{
name:"小紅",
job:"前端工程師"
};
var xm=
{
name:"小明",
job:"js工程師"
};
var xw=
{
name:"小王",
job:"html5工程師"
};
function myjob(gender,age,company)
{
alert(this.name+","+gender+",今年"+age+"歲,在"+company+"擔(dān)任"+this.job);
}
myjob.call(xh,"女",24,"騰訊");
myjob.call(xm,"男",22,"新浪");
myjob.call(xw,"男",28,"網(wǎng)易");
call函數(shù)和apply函數(shù)功能一樣，區(qū)別是第二個(gè)參數(shù)形式不一樣，call傳遞多個(gè)參數(shù)，任意形式（傳入?yún)?shù)和函數(shù)所接受參數(shù)一一對(duì)應(yīng)），apply第二個(gè)參數(shù)必須是數(shù)組形式，如a.call(b,2,3); ==> a.apply(b,[2,3]);
var xh=
{
name:"小紅",
job:"前端工程師"
};
var xm=
{
name:"小明",
job:"js工程師"
};
var xw=
{
name:"小王",
job:"html5工程師"
};
function myjob(gender,age,company)
{
alert(this.name+","+gender+",今年"+age+"歲,在"+company+"擔(dān)任"+this.job);
}
myjob.apply(xh,["女",24,"騰訊"]);
myjob.apply(xm,["男",22,"新浪"]);
myjob.apply(xw,["男",28,"網(wǎng)易"]);
三、bind函數(shù)
call,apply和bind都可以“綁架”this，逼迫其指向其他對(duì)象
使用上和call,apply的區(qū)別，如
xw.say.call(xh); //對(duì)函數(shù)直接調(diào)用 xw.say.apply(xh); //對(duì)函數(shù)直接調(diào)用 xw.say.bind(xh)(); //返回的仍然是一個(gè)函數(shù)，因此后面需要()來(lái)調(diào)用
傳參時(shí)可以像call那樣
xw.say.bind(xh,"中央大學(xué)","一年級(jí)")();
由于bind返回的仍然是一個(gè)函數(shù)，所以也可以在調(diào)用時(shí)再進(jìn)行傳參
xw.say.bind(xh)("中央大學(xué)","一年級(jí)");
更多關(guān)于JavaScript相關(guān)內(nèi)容可查看本站專題：《javascript面向?qū)ο笕腴T教程》、《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
火狐下table中創(chuàng)建form導(dǎo)致兩個(gè)table之間出現(xiàn)空白
js加入form導(dǎo)致兩個(gè)table之間出現(xiàn)空白，還有另一種說(shuō)法在table中創(chuàng)建form表單是不符合DOM標(biāo)準(zhǔn)的，會(huì)導(dǎo)致post失效，以及js數(shù)據(jù)傳輸失效2013-09-09
BootStrap柵格系統(tǒng)可以把我們的container容器劃分為若干等分，如果想要每個(gè)部分之間留出一定的空隙，那么應(yīng)該怎么解決，本文就來(lái)介紹一下2021-08-08
javascript 流暢動(dòng)畫實(shí)現(xiàn)原理
瀏覽器目前來(lái)說(shuō)是沒(méi)有抗鋸齒效果的(將來(lái)不一定哦)，這樣dom元素外觀的改變就被限制在1個(gè)像素為最佳效果。2009-09-09
JavaScript中日常收集常見(jiàn)的10種錯(cuò)誤(推薦)
本文是小編給大家日常收集整理的js中常見(jiàn)的10種錯(cuò)誤，非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友參考下2017-01-01
JS實(shí)現(xiàn)黑客帝國(guó)文字下落效果
看過(guò)黑客帝國(guó)的朋友或許都對(duì)開頭的字幕效果很熟悉，自從影片播放以來(lái)，網(wǎng)頁(yè)設(shè)計(jì)者有不少都在模仿這種文字下落的效果，而且還有文字漸變效果，對(duì)我們學(xué)習(xí)研究JS還是挺有幫助的哦，下面跟著小編一起學(xué)習(xí)JS 黑客帝國(guó)文字下落效果吧2015-09-09
js項(xiàng)目中雙向數(shù)據(jù)綁定的簡(jiǎn)單實(shí)現(xiàn)方法
雙向數(shù)據(jù)綁定指的就是，綁定對(duì)象屬性的改變到用戶界面的變化的能力,反之亦然,下面這篇文章主要給大家介紹了關(guān)于js項(xiàng)目中雙向數(shù)據(jù)綁定的簡(jiǎn)單實(shí)現(xiàn)方法,需要的朋友可以參考下2021-08-08
avascript中的自執(zhí)行匿名函數(shù)應(yīng)用示例
javascript中的自執(zhí)行匿名函數(shù)可以用它創(chuàng)建命名空間，只要把自己所有的代碼都寫在這個(gè)特殊的函數(shù)包裝內(nèi)，那么外部就不能訪問(wèn)，除非你允許2014-09-09
TypeScript中import?type與import的區(qū)別詳析
ES6引入了模塊化,其設(shè)計(jì)思想是在編譯時(shí)就能確定模塊的依賴關(guān)系,以及輸入和輸出的變量,下面這篇文章主要給大家介紹了關(guān)于TypeScript中import?type與import區(qū)別的相關(guān)資料,需要的朋友可以參考下2022-07-07
要通過(guò)元素訪問(wèn)樣式表，那么就應(yīng)該先確定是哪個(gè)元素。直接訪問(wèn)樣式表在該樣式塊里找相應(yīng)的樣式規(guī)則，最后在該樣式規(guī)則里找相應(yīng)的樣式2014-07-07
有時(shí)候我們?cè)诰W(wǎng)頁(yè)制作過(guò)程中需要彈出窗口，一般情況下，我們更希望窗口可以居中顯示2007-08-08