JavaScript模擬push
任務(wù):首先我定義了一個(gè)變量var arr = [0,1,2,3,4,5];我現(xiàn)在想模擬push方法在這個(gè)數(shù)組的5后面加?xùn)|西,我們應(yīng)該怎么做?給你5分鐘思考,在思考之前請(qǐng)不要往下看。
分析:我們是想往這個(gè)數(shù)組的最后面添加?xùn)|西對(duì)吧,關(guān)鍵點(diǎn)就在于我們?nèi)绾尾拍苷业皆刈詈蟮奈恢?。先不去考慮最后一個(gè)位置,我們先來(lái)想想我們平時(shí)是怎么樣訪問(wèn)一個(gè)數(shù)組的內(nèi)容的,是不是這樣arr[n],對(duì)不對(duì),假如我們?cè)L問(wèn)一個(gè)大于這個(gè)數(shù)組的索引,那么就是undefined,簡(jiǎn)單來(lái)說(shuō)就是沒(méi)有這個(gè)索引的話就是undefined,如果我們將這個(gè)數(shù)組的索引一直加1那么如果出現(xiàn)undefined是不是就是我們要找的位置,雖然這種方式可以,但是我有一個(gè)更好的方法就是利用length屬性,length屬性可以獲取到這個(gè)數(shù)組的長(zhǎng)度,那么這個(gè)長(zhǎng)度就是這個(gè)數(shù)組的索引+1,剛好我們就是要往這個(gè)索引上添加內(nèi)容。
代碼:
var arr = [0,1,2,3,4,5]; arr.length 獲取這個(gè)數(shù)組的最后位置
任務(wù):現(xiàn)在我們獲取到了數(shù)組的最后位置就可以給它添加內(nèi)容了,那么怎么添加呢?給誰(shuí)添加,怎么去添加。
分析:現(xiàn)在回想一下往一個(gè)數(shù)組里面添加內(nèi)容有哪些方式?獲取到的這個(gè)長(zhǎng)度就是我們要添加的位置。
合成:
var arr = [0,1,2,3,4,5];
function Push(value){
arr[arr.length] = value;
}
Push(6);
console.log(arr); //[0, 1, 2, 3, 4, 5, 6]
任務(wù):雖然現(xiàn)在可以往里面添加內(nèi)容了,但是每次只能添加一個(gè),怎么辦呢?
分析:突然好想念我的老朋友for,對(duì)這位老朋友可以幫我們完成一些重復(fù)的事情,那我們快請(qǐng)他來(lái)幫幫忙吧。
代碼:
分析:我們應(yīng)該怎么寫(xiě)這個(gè)for?i到底小于多少呢?是不是就是我們添加幾位就是幾?。磕敲次覀兊降滓砑佣嗌傥荒??好像我們確實(shí)不知道,但是卻有一位老朋友知道,他就是arguments,它可以獲取到我們傳入的參數(shù),并且它是一個(gè)偽數(shù)組,意味著它也可以像數(shù)組一樣使用length屬性獲取我們傳入的實(shí)參長(zhǎng)度。
代碼:
for(var i=0;i<arguments.length;i++){}
分析:那么現(xiàn)在問(wèn)題來(lái)了,我們把什么內(nèi)容添加到哪里去,再回到我們?nèi)蝿?wù),我們是不是想在某個(gè)數(shù)組的最后一個(gè)位置添加我們傳進(jìn)來(lái)的內(nèi)容,對(duì)我們穿進(jìn)來(lái)的,那么怎么獲取我們傳進(jìn)來(lái)的內(nèi)容呢,我們好像說(shuō)過(guò)arguments可以獲取它的內(nèi)容。
代碼:
var arr = [0,1,2,3,4,5];
function Push{
for(var i=0;i<arguments.length;i++){
arr[arr.length] = arguments[i];
}
}
Push(6,7,8);
完成。
課外擴(kuò)展:有基礎(chǔ)的朋友
ok,雖然這樣已經(jīng)完成了任務(wù),但是現(xiàn)在的問(wèn)題是,這段代碼只能為arr這個(gè)數(shù)組服務(wù),如果我們想為所以的數(shù)組提供這個(gè)功能就需要給Array的原型添加這個(gè)方法。
var arr = [0,1,2,3,4,5];
Array.prototype.Push = function{
for(var i=0;i<arguments.length;i++){
this[this.length] = arguments[i];
}
}
arr.Push(1,2,3)
把里面的arr修改成this,this表示誰(shuí)調(diào)用就是誰(shuí),如果你想了解更多關(guān)于this的內(nèi)容,可以看徹底理解js中this的指向,不必硬背這篇文章。
相關(guān)文章
基于zepto.js實(shí)現(xiàn)手機(jī)相冊(cè)功能
這篇文章主要為大家詳細(xì)介紹了基于zepto.js實(shí)現(xiàn)手機(jī)相冊(cè)功能,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07
JavaScript簡(jiǎn)單判斷復(fù)選框是否選中及取出值的方法
這篇文章主要介紹了JavaScript簡(jiǎn)單判斷復(fù)選框是否選中及取出值的方法,涉及javascript遍歷復(fù)選框及元素取值的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-08-08
bootstrap-table獲取表格數(shù)據(jù)的多種方式
這篇文章主要介紹了bootstrap-table獲取表格數(shù)據(jù)的多種方式,bootstrap-table獲取值得兩種方式,一種是通過(guò)data獲取,一種是通過(guò)url獲取,需要的朋友可以參考下2023-10-10
JavaScript實(shí)現(xiàn)圖片放大鏡效果
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)圖片放大鏡效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-06-06
JS判斷當(dāng)前頁(yè)面是否在微信瀏覽器打開(kāi)的方法
這篇文章主要介紹了JS判斷當(dāng)前頁(yè)面是否在微信瀏覽器打開(kāi)的方法,涉及JavaScript針對(duì)客戶端的相關(guān)判定技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-12-12
js實(shí)現(xiàn)文字跟隨鼠標(biāo)移動(dòng)而移動(dòng)的方法
這篇文章主要介紹了js實(shí)現(xiàn)文字跟隨鼠標(biāo)移動(dòng)而移動(dòng)的方法,實(shí)例分析了javascript處理鼠標(biāo)事件及文字特效的技巧,需要的朋友可以參考下2015-02-02
JS實(shí)現(xiàn)圖片橫向滾動(dòng)效果示例代碼
圖片橫向滾動(dòng)效果,大家可能都已經(jīng)很熟悉了,本文為大家介紹下使用js實(shí)現(xiàn)橫向滾動(dòng)效果,喜歡的朋友可以參考下,希望對(duì)大家有所幫助2013-09-09

