天天看點

javascript 原生數組操作指南

作者:前端飯團

1. 數組的建立

var arrayObj = new Array(); //建立一個數組

var arrayObj = new Array([size]); //建立一個數組并指定長度,注意不是上限,是長度

var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); //建立一個數組并指派

var arrayObj = []; //建議使用這種方式建立數組

//for example

var arr = new Array();

var arr = new Array(2);

var arr = new Array(1,2);

var arr = [1,2];
           

要說明的是,雖然第二種方法建立數組指定了長度,但實際上所有情況下數組都是變長的,也就是說即使指定了長度為2,仍然可以将元素存儲在規定長度以外的,注意:這時長度會随之改變。

2.數組元素的通路

var arr = [1,2];

console.log(arr[0]); //1

console.log(arr[1]); //2

//指派

arr[1]=3;

console.log(arr); //[1,3]           

3.數組元素的添加

//将一個或多個新元素添加到數組結尾,并傳回數組新長度
arrayObj.push([item1 [item2 [. . . [itemN ]]]]);
//将一個或多個新元素添加到數組開始,數組中的元素自動後移,傳回數組新長度
arrayObj.unshift([item1 [item2 [. . . [itemN ]]]]);
//将一個或多個新元素插入到數組的指定位置,插入位置的元素自動後移,傳回""
arrayObj.splice(index,howmany,item1,.....,itemX);

//for example

//push方法

var arr =[1,2];

var sum =arr.push(3,"電腦");

console.log(sum); //4

console.log(arr); //[1,2,3,"電腦"]

//unshift方法

var arr = [1,2];

var sum = arr.unshift(3,"電腦");

console.log(sum); //4

console.log(arr); //[ 3, '電腦', 1, 2 ]

//splice方法

var arr = [1,2,3];

arr.splice(1,0,'William');

console.log(arr); //[ 1, 'William', 2, 3 ]

arr.splice(1,1); //從數組的第一個元素,删除一個

console.log(arr); // [ 1, 2, 3 ]           

4.數組元素的删除

//用于删除并傳回數組的最後一個元素.pop() 方法将删除 arrayObject 的最後一個元素,把數組長度減 1,并且傳回它删除的元素的值。
//如果數組已經為空,則 pop() 不改變數組,并傳回 undefined 值。
arrayObject.pop() 
//方法用于把數組的第一個元素從其中删除,并傳回第一個元素的值。
arrayObject.shift() 

//for example

//pop方法

var arr = [1,2,3,4];

var delsum = arr.pop();

console.log(arr); //[1,2,3]

console.log(delsum);//4

//shift方法

var arr = [1,2,3,4];

var sum = arr.shift();

console.log(arr); //[2,3,4]

console.log(sum);//1           

5.數組元素的合并

//方法用于連接配接兩個或多個數組,該方法不會改變現有的數組,而僅僅會傳回被連接配接數組的一個副本。
arrayObject.concat(arrayX,arrayX,......,arrayX)

//for example

var arr = [1,2];

var arr1 = [3,4];

var total = arr.concat(arr1);

console.log(total); //[ 1, 2, 3, 4 ]

var total1 = arr.concat(arr1,arr1);

console.log(total1);//[ 1, 2, 3, 4, 3, 4 ]           

接下來會分享一下es6的數組常用操作,敬請期待。