徹底搞懂JavaScript中的apply和call方法(必看)
call和apply都是為了改變某個函數(shù)運(yùn)行的context上下文而存在的,即為了改變函數(shù)體內(nèi)部this的指向。因?yàn)镴avaScript的函數(shù)存在定義上下文和運(yùn)行時上下文以及上下文是可以改變的概念。
回到目錄定義
fun.apply(thisArg, [argsArray]) fun.call(thisArg, arg1,arg2, ...)
其中thisArg可以為null或undefined,此時表示全局對象,更詳細(xì)見MDN:apply()、call()
二者的作用完全一樣,只是接受參數(shù)的方式不太一樣。例如,有一個函數(shù)定義如下:
var func1 = function(arg1, arg2){};
可以通過func1.call(this, arg1, arg2);或者func1.apply(this, [arg1, arg2])來調(diào)用。其中this是你想指定的上下文,它可以是任意一個JavaScript對象(JavaScript一切皆對象),call需要把參數(shù)傳遞進(jìn)去,而apply則把參數(shù)放在數(shù)組里。
因?yàn)樵贘avaScript中,某個函數(shù)的參數(shù)數(shù)量是不固定的,當(dāng)你的參數(shù)明確知道數(shù)量時,用call,而不確定的時候用apply,然后把參數(shù)push進(jìn)數(shù)組傳遞進(jìn)去。當(dāng)參數(shù)數(shù)量不確定時,函數(shù)內(nèi)部也可以通過arguments這個數(shù)組來遍歷所有的參數(shù)。
回到目錄一個例子
在JavaScript OOP中,我們經(jīng)常會這樣定義:
funciton programmer() {
}
programmer.prototype = {
hobby: 'programming',
say.function() {
alert('I love' + this.hobby);
}
}
var xiaoMing = new programmer();
xiaoMing.say();
此時如果我們有一個設(shè)計(jì)妹子對象xiaoHua = {hobby: 'designing'};我們不想對它重新定義say方法,那么我們可以通過call或apply使用xiaoMing的say方法:xiaoMing.say.call(xiaoHua)。
由此可看出,call和apply都是為了動態(tài)改變this而出現(xiàn)的,當(dāng)一個object沒有某個方法或?qū)傩詴r,但是其他的對象有,則可以借助call或apply來使用其他對象的方法來操作。
obj.call(thisObj, arg1, arg2, ...); obj.apply(thisObj, [arg1, arg2, ...]);
兩者都是把obj(即this)綁定到thisObj,這時候thisObj具備(或繼承)了obj的屬性和方法
其中比較常見的,通過document.getElementByTagName選擇的節(jié)點(diǎn)是一種類數(shù)組,它不能應(yīng)用Array下的push,pop等方法。但我們可以通過:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
Array.prototype.slice.call能所有具有l(wèi)ength屬性的對象轉(zhuǎn)為數(shù)組,這樣domNodes就可以應(yīng)用Array下的所有方法了。
以上這篇徹底搞懂JavaScript中的apply和call方法(必看)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
利用canvas實(shí)現(xiàn)的加載動畫效果實(shí)例代碼
之前看到一個Android的加載效果不錯,一直想自己動手做一個,正好這段時間重溫了一個Canvas,所以就嘗試了一下。下面這篇文章主要給大家介紹了關(guān)于利用canvas實(shí)現(xiàn)加載效果的相關(guān)資料,需要的朋友可以參考下。2017-07-07
npm script和package-lock.json使用示例詳解
這篇文章主要為大家介紹了npm script和package-lock.json使用示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-02-02
改進(jìn) JavaScript 和 Rust 的互操作性并深入認(rèn)識 wasm-bindgen 組件
這篇文章主要介紹了改進(jìn) JavaScript 和 Rust 的互操作性并深入認(rèn)識 wasm-bindgen 組件,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-07-07
js綜合應(yīng)用實(shí)例簡單的表格統(tǒng)計(jì)
在做調(diào)查問卷的過程中,遇到一個表格的統(tǒng)計(jì)問題,一個需要用到j(luò)s方面的綜合知識,感覺還不錯所以記錄下來與大家分享,感興趣的朋友可以了解下2013-09-09
微信小程序 配置頂部導(dǎo)航條標(biāo)題顏色的實(shí)現(xiàn)方法
這篇文章主要介紹了微信小程序 配置頂部導(dǎo)航條標(biāo)題顏色的實(shí)現(xiàn)方法的相關(guān)資料,希望通過本文能幫助到大家,需要的朋友可以參考下2017-09-09
mui 打開新窗口的方式總結(jié)及注意事項(xiàng)
這篇文章主要介紹了mui 打開新窗口的方式總結(jié)及注意事項(xiàng),需要的朋友可以參考下2017-08-08
Layui數(shù)據(jù)表格跳轉(zhuǎn)到指定頁的實(shí)現(xiàn)方法
今天小編就為大家分享一篇Layui數(shù)據(jù)表格跳轉(zhuǎn)到指定頁的實(shí)現(xiàn)方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09

