全面了解構(gòu)造函數(shù)繼承關(guān)鍵apply call
主要我是要解決一下幾個問題:
1. apply和call的區(qū)別在哪里
2. apply的其他巧妙用法(一般在什么情況下可以使用apply)
我首先從網(wǎng)上查到關(guān)于apply和call的定義,然后用示例來解釋這兩個方法的意思和如何去用.
apply:方法能劫持另外一個對象的方法,繼承另外一個對象的屬性.
Function.apply(obj,args)方法能接收兩個參數(shù)
obj:這個對象將代替Function類里this對象
args:這個是數(shù)組,它將作為參數(shù)傳給Function(args-->arguments)
call:和apply的意思一樣,只不過是參數(shù)列表不一樣.
Function.call(obj,param1,param2,…,paramN)
obj:這個對象將代替Function類里this對象
params:這個是一個參數(shù)列表
apply示例:
<script type="text/javascript">
/*定義一個人類*/
function Person(name,age) {
this.name=name; this.age=age;
}
/*定義一個學(xué)生類*/
functionStudent(name,age,grade) {
Person.apply(this,arguments); this.grade=grade;
}
//創(chuàng)建一個學(xué)生類
var student=new Student("qian",21,"一年級");
//測試
alert("name:"+student.name+"\n"+"age:"+student.age+"\n"+"grade:"+student.grade);
//大家可以看到測試結(jié)果name:qian age:21 grade:一年級
//學(xué)生類里面我沒有給name和age屬性賦值啊,為什么又存在這兩個屬性的值呢,這個就是apply的神奇之處.
</script>
分析: Person.apply(this,arguments);
this:在創(chuàng)建對象在這個時候代表的是student
arguments:是一個數(shù)組,也就是[“qian”,”21”,”一年級”];
也就是通俗一點(diǎn)講就是:用student去執(zhí)行Person這個類里面的內(nèi)容,在Person這個類里面存在this.name等之類的語句,這樣就將屬性創(chuàng)建到了student對象里面
call示例
在Studen函數(shù)里面可以將apply中修改成如下:
Person.call(this,name,age);
區(qū)別
在給對象參數(shù)的情況下,如果參數(shù)的形式是數(shù)組的時候,比如apply示例里面?zhèn)鬟f了參數(shù)arguments,這個參數(shù)是數(shù)組類型,并且在調(diào)用Person的時候參數(shù)的列表是對應(yīng)一致的(也就是Person和Student的參數(shù)列表前兩位是一致的) 就可以采用 apply , 如果我的Person的參數(shù)列表是這樣的(age,name),而Student的參數(shù)列表是(name,age,grade),這樣就可以用call來實(shí)現(xiàn)了,也就是直接指定參數(shù)列表對應(yīng)值的位置(Person.call(this,age,name,grade));
apply的一些其他巧妙用法
細(xì)心的人可能已經(jīng)察覺到,在我調(diào)用apply方法的時候,第一個參數(shù)是對象(this), 第二個參數(shù)是一個數(shù)組集合,
在調(diào)用Person的時候,他需要的不是一個數(shù)組,但是為什么他給我一個數(shù)組我仍然可以將數(shù)組解析為一個一個的參數(shù),
這個就是apply的一個巧妙的用處,可以將一個數(shù)組默認(rèn)的轉(zhuǎn)換為一個參數(shù)列表([param1,param2,param3] 轉(zhuǎn)換為 param1,param2,param3) 這個如果讓我們用程序來實(shí)現(xiàn)將數(shù)組的每一個項(xiàng),來裝換為參數(shù)的列表,可能都得費(fèi)一會功夫,借助apply的這點(diǎn)特性,所以就有了以下高效率的方法:
a) Math.max 可以實(shí)現(xiàn)得到數(shù)組中最大的一項(xiàng)
因?yàn)镸ath.max 參數(shù)里面不支持Math.max([param1,param2]) 也就是數(shù)組
但是它支持Math.max(param1,param2,param3…),所以可以根據(jù)剛才apply的那個特點(diǎn)來解決 var max=Math.max.apply(null,array),這樣輕易的可以得到一個數(shù)組中最大的一項(xiàng)
(apply會將一個數(shù)組裝換為一個參數(shù)接一個參數(shù)的傳遞給方法)
這塊在調(diào)用的時候第一個參數(shù)給了一個null,這個是因?yàn)闆]有對象去調(diào)用這個方法,我只需要用這個方法幫我運(yùn)算,得到返回的結(jié)果就行,.所以直接傳遞了一個null過去
b) Math.min 可以實(shí)現(xiàn)得到數(shù)組中最小的一項(xiàng)
同樣和 max是一個思想
var min=Math.min.apply(null,array);
c) Array.prototype.push 可以實(shí)現(xiàn)兩個數(shù)組合并
同樣push方法沒有提供push一個數(shù)組,但是它提供了push(param1,param,…paramN) 所以同樣也可以通過apply來裝換一下這個數(shù)組,即:
vararr1=new Array("1","2","3");
vararr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2);
也可以這樣理解,arr1調(diào)用了push方法,參數(shù)是通過apply將數(shù)組裝換為參數(shù)列表的集合.
以上就是小編為大家?guī)淼娜媪私鈽?gòu)造函數(shù)繼承關(guān)鍵apply call全部內(nèi)容了,希望大家多多支持腳本之家~
相關(guān)文章
純js實(shí)現(xiàn)重發(fā)驗(yàn)證碼按鈕倒數(shù)功能
這篇文章主要介紹了純js實(shí)現(xiàn)重發(fā)驗(yàn)證碼按鈕倒數(shù)功能,本文整理了兩個實(shí)現(xiàn)代碼,需要的朋友可以參考下2015-04-04
javascript checkbox/radio onchange不能兼容ie8處理辦法
這篇文章主要介紹了javascript checkbox/radio onchange不能兼容ie8處理辦法的相關(guān)資料,需要的朋友可以參考下2017-06-06
JavaScript對象類型轉(zhuǎn)換的分類及步驟詳解
這篇文章主要為大家介紹了JavaScript對象類型轉(zhuǎn)換的分類及步驟詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-05-05
javascript拖曳互換div的位置實(shí)現(xiàn)示例
一個div拖動互換位置的demo,還有很大優(yōu)化的空間,利用dom元素的dragstart/ondragover/ondrop事件完成,感興趣的可以了解一下2021-06-06
小程序中使用css var變量(使js可以動態(tài)設(shè)置css樣式屬性)
這篇文章主要介紹了小程序中使用css var變量,使js可以動態(tài)設(shè)置css樣式屬性,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-03-03
JavaScript實(shí)現(xiàn)一個輸入框組件
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)一個輸入框組件,文中示例代碼介紹的非常詳細(xì),具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09
詳解微信小程序-canvas繪制文字實(shí)現(xiàn)自動換行
這篇文章主要介紹了微信小程序canvas繪制文字實(shí)現(xiàn)自動換行,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
window.onbeforeunload方法在IE下無法正常工作的解決辦法
下面的代碼可以做到不管用戶是點(diǎn)擊了關(guān)閉,或者是在任務(wù)欄關(guān)閉、點(diǎn)擊后退、刷新、按F5鍵,都可以檢測到用戶即將離開的消息。2010-01-01

