詳解js中call與apply關(guān)鍵字的作用
javascript call與apply關(guān)鍵字的作用
apply接受兩個(gè)參數(shù)。第一個(gè)參數(shù)指定函數(shù)體內(nèi)this對(duì)象的指向,第二個(gè)參數(shù)為一個(gè)帶下標(biāo)的集合。
call則是apply的語(yǔ)法糖,如果參數(shù)數(shù)量固定,則可以不用帶下標(biāo)的集合傳第二個(gè)參數(shù)。
var func = function(a,b,c) { alert(a + b + c); } func.apply(null,[1,2,3]);//彈出6 func.call(null,1,2,3);//彈出6
當(dāng)apply與call傳入的第一個(gè)參數(shù)為null時(shí),函數(shù)體內(nèi)的this會(huì)指向window。
當(dāng)apply與call傳入的第一個(gè)參數(shù)為null時(shí),函數(shù)體內(nèi)的this會(huì)指向window。
call與apply的用途
1、改變this的指向
var obj1 = { name = '劉備' } var obj2 = { name = '曹操' } var getName = function(){ alert(this.name); } window.name = '三國(guó)'; getName();//彈出"三國(guó)" getName.call(obj1);//彈出"劉備" getName.call(obj2);//彈出"曹操"
所以,當(dāng)在一些情況下this被莫名改變指向之后,可以使用call或apply來進(jìn)行修正this的指向。
document.getElementById('div1').onclick = function(){ alert(this.id);//div1 var fun1 = function(){ alert(this.id);//window.id 即undefined } fun1();//普通函數(shù)的方式調(diào)用,this指代window,相當(dāng)于window.id 即 undefined }
由于是普通函數(shù)的方式調(diào)用,所以上面的例子中,this已經(jīng)變成了window。下面看看如何使用call進(jìn)行修正。
document.getElementById('div1').onclick = function(){ alert(this.id); var fun1 = function(){ alert(this.id); } fun1.call(this);//強(qiáng)制函數(shù)內(nèi)的this為外層的this, }
2、調(diào)用其他對(duì)象的函數(shù)
示例1:
var obj1 = { a:1, b:2, add:function() { return this.a + this.b; } } var obj2 = { a:1, b:2, } var result = obj1.add.call(obj2);//用obj1的函數(shù)來計(jì)算obj2的兩個(gè)屬性的和 alert(result);//輸出3
示例2:借用構(gòu)造函數(shù)實(shí)現(xiàn)類似繼承的效果
var A = function(name) { this.name = name; }; var B = function(){ A.apply(this,arguments) } B.prototype.getName = function(){ return this.name; } var b = new B('劉備'); alert(b.getName());
以上就是本文的內(nèi)容,有問題可以和小編聯(lián)系,謝謝對(duì)腳本之家的支持!
- 實(shí)例講解JavaScript中call、apply、bind方法的異同
- 詳解js中的apply與call的用法
- Function.prototype.apply()與Function.prototype.call()小結(jié)
- 關(guān)于JS中的apply,call,bind的深入解析
- JS中改變this指向的方法(call和apply、bind)
- 淺談javascript的call()、apply()、bind()的用法
- JS中call/apply、arguments、undefined/null方法詳解
- 淺談javascript中call()、apply()、bind()的用法
- js繼承call()和apply()方法總結(jié)
- 從JQuery源碼分析JavaScript函數(shù)的apply方法與call方法
相關(guān)文章
JS根據(jù)年月獲得當(dāng)月天數(shù)的實(shí)現(xiàn)代碼
這篇文章主要介紹了JS根據(jù)年月獲得當(dāng)月天數(shù)的實(shí)現(xiàn)代碼,需要的朋友可以參考下2014-07-07JavaScript拆分字符串時(shí)產(chǎn)生空字符的解決方案
使用JavaScript的split方法拆分字符串時(shí)出現(xiàn)一些空字符串"",尤其是當(dāng)使用正則表達(dá)式作為分隔符的時(shí)候。那么,產(chǎn)生這些空字符串的原因是什么?又該如何來處理呢,這就是今天我們要探討的問題2014-09-09ionic實(shí)現(xiàn)帶字的toggle滑動(dòng)組件
這篇文章主要為大家詳細(xì)介紹了ionic實(shí)現(xiàn)帶字的toggle滑動(dòng)組件,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-08-08js實(shí)現(xiàn)的簡(jiǎn)練高效拖拽功能示例
這篇文章主要介紹了js實(shí)現(xiàn)的簡(jiǎn)練高效拖拽功能,通過對(duì)js鼠標(biāo)事件的擴(kuò)展實(shí)現(xiàn)拖拽效果,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2016-12-12不提示直接關(guān)閉網(wǎng)頁(yè)窗口的JS示例代碼
本篇文章主要是對(duì)不提示直接關(guān)閉網(wǎng)頁(yè)窗口的JS示例代碼進(jìn)行了介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12Bootstrap標(biāo)簽頁(yè)(Tab)插件使用方法
這篇文章主要為大家詳細(xì)介紹了Bootstrap標(biāo)簽頁(yè)(Tab)插件的使用方法,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03小程序角標(biāo)的添加及綁定購(gòu)物車數(shù)量進(jìn)行實(shí)時(shí)更新的實(shí)現(xiàn)代碼
這篇文章主要介紹了小程序角標(biāo)的添加及綁定購(gòu)物車數(shù)量進(jìn)行實(shí)時(shí)更新的實(shí)現(xiàn)代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-12-12