JavaScript實現數組元素增減的方法示例
任務描述
本關任務:掌握數組元素增減的方法。
相關知識
數組元素的增刪是JavaScript的一個特點,因為其他很多編程語言的數組是不允許增加或者刪除元素的。
數組元素的增加
在JavaScript中,為數組增加元素可以在數組頭部(索引最小處)或者尾部進行,可以使用數組的方法或者直接使用運算符。
在尾部添加元素
最直觀的方法是直接給當前尾部元素的后一個位置賦值。
var numberArray = [12,23,34,45]; numberArray[numberArray.length] = 56; console.log(numberArray);//輸出[12,23,34,45,56]
第二種方法是使用push()函數,往數組的末尾添加一個或多個元素,參數是要添加的元素,返回數組長度。
//利用push()方法在數組尾部添加元素 var numberArray = [12,23,34,45]; var newLength = numberArray.push(56); console.log(newLength);//輸出5 console.log(numberArray);//輸出[12,23,34,45,56]
在頭部添加元素
unshift()方法在數組的頭部添加元素,并返回數組新的長度,其余元素自動向索引大的方向移動。
var sArray = ["ja","va","script"];
var newLength = sArray.unshift("he","llo");
console.log(newLength)//輸出5
console.log(sArray);//輸出["he","llo","ja","va","script"];數組元素的刪除
刪除也能在數組頭部(索引值小)或者尾部進行。
在尾部刪除元素
上一關介紹過一種方法:直接修改數組長度為更小的值。
var array = [1,2,true,"hello"]; array.length = 3;//索引最大的元素被刪除 console.log(array);//輸出[1,2,true]
第二種方法是使用delete運算符。delete運算符后接要刪除的元素,但是刪除后,會有一個空占位符,所以數據的長度保持不變。如:
var dArray = [11,22,33,44,55]; delete dArray[4];//刪除索引最大的元素 console.log(dArray);//輸出[11,22,33,44] console.log(dArray.length); //長度為5
第三種方法是使用pop(),一次刪除一個,并返回被刪除的元素。
//利用pop()方法在數組尾部刪除元素 var numberArray = [3,4,5,6,7]; var deletedNumber = numberArray.pop(); console.log(deletedNumber);//輸出被刪除的元素7 console.log(numberArray);//刪除后的數組為[3,4,5,6]
在頭部刪除元素
有unshift(),自然有shift(),shift()的作用是刪除數組頭部一個元素并返回該元素,然后所有元素往索引值小的方向移動一位。
初學者很容易混淆這兩個方法,建議記住shift單詞的意思是:刪除,去掉。
var dArray = [11,22,33,44,55]; console.log(dArray.shift());//輸出11,11被從數組中刪除 console.log(dArray);//輸出[22,33,44,55]
編程要求
本關的編程任務是補全右側代碼片段中begin至end中間的代碼,具體要求如下:
將數組
testArray的最后a個元素移動到最前面,這a個元素之間的相對位置不變,其余元素之間的相對位置不變;比如將數組
[1,2,3,4,5]最后2個元素移動到最前面,數組變?yōu)?code>[4,5,1,2,3];返回移動結束后數組在索引
b處的元素;
var testArray = [12,"java","js","c","c++",24,36,"python","c#","css"];
function mainJs(a,b) {
a = parseInt(a);
b = parseInt(b);
//請在此處編寫代碼
/*********begin*********/
for (var i = 1; i <= a; i++){
testArray.unshift(testArray.pop());
}
return testArray[b];
/*********end*********/
}到此這篇關于JavaScript實現數組元素增減的方法示例的文章就介紹到這了,更多相關JavaScript數組元素增減內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
JS創(chuàng)建優(yōu)美的頁面滑動塊效果 - Glider.js
JS創(chuàng)建優(yōu)美的頁面滑動塊效果 - Glider.js...2007-09-09
被jQuery折騰得半死,揭秘為何jQuery為何在IE/Firefox下均無法使用
某學員前日實施一個Web項目實施發(fā)生了悲劇,找到我求解決,把我也折騰個半死。2010-01-01

