js繼承call()和apply()方法總結(jié)
1、方法定義
call方法:
語(yǔ)法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定義:調(diào)用一個(gè)對(duì)象的一個(gè)方法,以另一個(gè)對(duì)象替換當(dāng)前對(duì)象。
說明:
call 方法可以用來代替另一個(gè)對(duì)象調(diào)用一個(gè)方法。call 方法可將一個(gè)函數(shù)的對(duì)象上下文從初始的上下文改變?yōu)橛?thisObj 指定的新對(duì)象。
如果沒有提供 thisObj 參數(shù),那么 Global 對(duì)象被用作 thisObj。
apply方法:
語(yǔ)法:apply([thisObj[,argArray]])
定義:應(yīng)用某一對(duì)象的一個(gè)方法,用另一個(gè)對(duì)象替換當(dāng)前對(duì)象。
說明:
如果 argArray 不是一個(gè)有效的數(shù)組或者不是 arguments 對(duì)象,那么將導(dǎo)致一個(gè) TypeError。
如果沒有提供 argArray 和 thisObj 任何一個(gè)參數(shù),那么 Global 對(duì)象將被用作 thisObj, 并且無法被傳遞任何參數(shù)。
2、常用實(shí)例
a、
function add(a,b)
{
alert(a+b);
}
function sub(a,b)
{
alert(a-b);
}
add.call(sub,3,1);
這個(gè)例子中的意思就是用 add 來替換 sub,add.call(sub,3,1) == add(3,1) ,所以運(yùn)行結(jié)果為:alert(4); // 注意:js 中的函數(shù)其實(shí)是對(duì)象,函數(shù)名是對(duì) Function 對(duì)象的引用。
b、
function Animal(){
this.name = "Animal";
this.showName = function(){
alert(this.name);
}
}
function Cat(){
this.name = "Cat";
}
var animal = new Animal();
var cat = new Cat();
//通過call或apply方法,將原本屬于Animal對(duì)象的showName()方法交給對(duì)象cat來使用了。
//輸入結(jié)果為"Cat"
animal.showName.call(cat,",");
//animal.showName.apply(cat,[]);
call 的意思是把 animal 的方法放到cat上執(zhí)行,原來cat是沒有showName() 方法,現(xiàn)在是把a(bǔ)nimal 的showName()方法放到 cat上來執(zhí)行,所以this.name 應(yīng)該是 Cat
c、實(shí)現(xiàn)繼承
function Animal(name){
this.name = name;
this.showName = function(){
alert(this.name);
}
}
function Cat(name){
Animal.call(this, name);
}
var cat = new Cat("Black Cat");
cat.showName();
Animal.call(this) 的意思就是使用 Animal對(duì)象代替this對(duì)象,那么 Cat中不就有Animal的所有屬性和方法了嗎,Cat對(duì)象就能夠直接調(diào)用Animal的方法以及屬性了.
d、多重繼承
function Class10()
{
this.showSub = function(a,b)
{
alert(a-b);
}
}
function Class11()
{
this.showAdd = function(a,b)
{
alert(a+b);
}
}
function Class2()
{
Class10.call(this);
Class11.call(this);
}
很簡(jiǎn)單,使用兩個(gè) call 就實(shí)現(xiàn)多重繼承了
當(dāng)然,js的繼承還有其他方法,例如使用原型鏈,這個(gè)不屬于本文的范疇,只是在此說明call 的用法。說了call ,當(dāng)然還有 apply,這兩個(gè)方法基本上是一個(gè)意思,區(qū)別在于 call 的第二個(gè)參數(shù)可以是任意類型,而apply的第二個(gè)參數(shù)必須是數(shù)組,也可以是arguments
還有 callee,caller..
- JavaScript中的apply()方法和call()方法使用介紹
- JS面向?qū)ο?、prototype、call()、apply()
- 在JavaScript中call()與apply()區(qū)別
- 跟我學(xué)習(xí)javascript的call(),apply(),bind()與回調(diào)
- js中apply()和call()的區(qū)別與用法實(shí)例分析
- 基于JavaScript實(shí)現(xiàn)繼承機(jī)制之調(diào)用call()與apply()的方法詳解
- 深入理解關(guān)于javascript中apply()和call()方法的區(qū)別
- 淺談javascript的call()、apply()、bind()的用法
- 有關(guān)JavaScript中call()和apply() 的一些理解
- JavaScript函數(shù)apply()和call()用法與異同分析
- JS中call()和apply()的功能及用法實(shí)例分析
相關(guān)文章
JavaScript hasOwnProperty() 函數(shù)實(shí)例詳解
hasOwnProperty()函數(shù)用于指示一個(gè)對(duì)象自身(不包括原型鏈)是否具有指定名稱的屬性。下面通過本文給大家分享JavaScript hasOwnProperty() 函數(shù)實(shí)例講解,感興趣的朋友一起看看吧2017-08-08實(shí)現(xiàn)隔行換色效果的兩種方式【實(shí)用】
本文主要介紹了實(shí)現(xiàn)隔行顏色交替 鼠標(biāo)經(jīng)過高亮顏色的兩種方式的具體實(shí)例,有助于理解和使用。方案一:純CSS編寫;方案二:js代碼編寫。需要的朋友可以參考下2016-11-11javascript斷點(diǎn)調(diào)試心得分享
javascript中程序是怎么可以中斷執(zhí)行,然后一步一步走下去。而且debug的時(shí)候,可以看到變量,調(diào)用棧等東西。這個(gè)是如何實(shí)現(xiàn)的?2016-04-04微信小程序全局變量改變監(jiān)聽的實(shí)現(xiàn)方法
這篇文章主要給大家介紹了關(guān)于微信小程序全局變量改變監(jiān)聽的實(shí)現(xiàn)方法,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家學(xué)習(xí)或者使用微信小程序具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07JavaScript聲明函數(shù)的5種方法小結(jié)
本文主要介紹了JavaScript聲明函數(shù)的5種方法小結(jié),文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-02-02Javascript 網(wǎng)頁(yè)黑白效果實(shí)現(xiàn)代碼(兼容IE/FF等)
今天在網(wǎng)上看到有人推薦的一個(gè)不錯(cuò)的方法,試了一下,效果還是可以的,可以自定義讓網(wǎng)頁(yè)的某一部分變成灰度顏色(黑白)。2010-04-04使用JavaScript實(shí)現(xiàn)響應(yīng)式計(jì)數(shù)器動(dòng)畫
在本文中,我們將學(xué)習(xí)如何使用?HTML?CSS?和?JavaScript創(chuàng)建響應(yīng)式計(jì)數(shù)器動(dòng)畫。?我們?cè)诤芏嗟胤蕉伎梢杂?,比如適用于不同類型的個(gè)人網(wǎng)站、企業(yè)網(wǎng)站等,感興趣的可以了解一下2022-08-08