您好,登錄后才能下訂單哦!
這篇文章給大家介紹call()與apply()在JavaScript中的功能是什么,內容非常詳細,感興趣的小伙伴們可以參考借鑒,希望對大家能有所幫助。
1.call()和apply()的作用
首先引出問題:用call()和apply()的目的是什么?
來看個例子,在javascript OOP中,我們經常會這樣定義:
function cat(){ } cat.prototype={ food:"fish", say: function(){ alert("I love "+this.food); } } var blackCat = new cat; blackCat.say();
但是如果我們有一個對象whiteDog = {food:"bone"}
,我們不想對它重新定義say方法,那么我們可以通過call或apply用blackCat的say方法:blackCat.say.call(whiteDog);
所以,可以看出call和apply是為了動態改變this而出現的,當一個object沒有某個方法,但是其他的有,我們可以借助call或apply用其它對象的方法來操作。
在實際中用的比較多的是,通過document.getElementsByTagName
選擇的dom 節點是一種類似array的對象。它不能應用Array下的push,pop等方法。我們可以通過:
var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));
這樣domNodes就可以應用Array下的所有方法了。
2.call()和apply()的區別
首先apply的定義如下:
apply方法能劫持另外一個對象的方法,繼承另外一個對象的屬性
Function.apply(obj,args)方法能接收兩個參數,第一個參數是在其中運行函數的作用域,另一個是參數數組。其中,第二個參數可以是數組,也可以是arguments對象
obj:這個對象將代替Function類里this對象
args:這個是數組,它將作為參數傳給Function(args–>arguments)
apply()
的用法
//定義一個人類 function Person(name,age){ this.name = name; this.age = age; } //定義一個學生類 function Student(name,age,grade){ Person.apply(this,arguments);//傳入arguments對象 //Person.apply(this,[num1,num2]);//傳入數組 this.grade = grade; } //創建一個學生類 var student = new Student('A','10','一年級'); //測試 console.log('name:'+student.name+'age:'+student.age+'grade:'+student.grade);
學生類里沒有給name和age屬性賦值啊,為什么又存在這兩個屬性的值呢,這個就是apply的神奇之處。
分析:Person.apply(this,arguments);
this:代表的是student,表示將Person中的this指向student。
arguments:是一個數組,在例子中表示[‘A','10','一年級'];
通俗一點講就是:用student去執行Person這個類里面的內容,在Person這個類里面存在this.name
等之類的語句,這樣就講屬性創建到了student對象里面.
apply()
和call()
的作用是一樣的,他們的區別僅在于接收參數的方式不同,call()
需要把參數一個個列出來。
call()的用法
在Student函數里面可以將apply中修改成如下:
Person.call(this,name,age);
3.什么情況下用apply(),什么情況下用call()
至于是使用apply()
還是call()
,取決于采取那種給函數傳遞參數的方式最方便。
如果打算直接傳入arguments對象,或者是數組,并且參數列表相同則使用apply()
;否則,選擇call()
可能更合適。
例:apply示例里面傳遞了參數arguments,并且在調用Person的時候參數的列表是對應一致的,也就是Person和Student的參數列表前兩位是一致的,就可以采用apply。
如果我的Person的參數列表是這樣的(age,name)而Student的參數列表是(name,age,grade),這樣的就可以用call來實現了Person.call(this,age,name,grade);
關于call()與apply()在JavaScript中的功能是什么就分享到這里了,希望以上內容可以對大家有一定的幫助,可以學到更多知識。如果覺得文章不錯,可以把它分享出去讓更多的人看到。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。