JS數組操做之增刪改查的簡單實現

JS提供了不少方便操做數組的方法，本文所要分享的就是如何快速對數組進行增、刪、改、查。

1、增

一、push()

可接收任意數量的參數，把它們逐個添加至數組末尾，並返回修改後數組的長度。例如：

var arr = [];
var len = arr.push(1);
console.log(arr);  // [1]
console.log(len);  // 1
len = arr.push(2,3);
console.log(arr);  // [1,2,3]
console.log(len);  // 3

二、unshift()

該方法與push()相似，也可接收任意數量的參數，只不過是將參數逐個添加至數組前端而已，一樣返回新數組長度。我們接着上面的例子：

var len = arr.unshift(0);
console.log(arr);  // [0, 1, 2, 3]
console.log(len);  // 4
len = arr.unshift(-2,-1);
console.log(arr);   // [-2, -1, 0, 1, 2, 3]
console.log(len);   // 6

三、concat()

該方法與push()方法有點相似，一樣是將元素添加至數組末尾，只不過這個數組已經不是原來的那個數組了，而是其副本，因此concat()操做數組後會返回一個新的數組。具體用法以下：

① 不傳參數，返回當前數組副本
② 傳遞一或多個數組，則該方法會將這些數組中的每一項都添加到結果數組中
③ 傳遞非數組參數，這些參數就會被直接添加到結果數組的末尾

繼續接着上面的栗子：

var arr1 = arr.concat(4,[5,6]);
console.log(arr);   // [-2, -1, 0, 1, 2, 3]
console.log(arr1);   // [-2, -1, 0, 1, 2, 3, 4, 5, 6]

例子中一目瞭然，原數組保持不變，新數組後面添加了四、五、6三個元素。

四、splice()

前面的三個方法都具備很大侷限性，由於不是添加到數組前就是數組後，而splice()就不同了，它很是靈活和強大。靈活是由於它能夠添加元素到數組的任意位置，強大是由於它除了能夠添加元素以外還具備刪除和替換元素的功能（這個後面會陸續講到）。

splice()能夠向數組指定位置添加任意數量的元素，須要傳入至少3個參數： 起始位置、0（要刪除的元素個數）和要添加的元素。

依然接着上面的例子繼續：

arr.splice(3,0,0.2,0.4,0.6,0.8);
console.log(arr);  // [-2, -1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2, 3]

能夠看出，splice()與push()和unshift()同樣是直接在原數組上修改的。

2、刪

一、pop()

與push()方法配合使用能夠構成後進先出的棧，該方法可從數組末尾刪除最後一項並返回該項。

接着上例：

var item = arr.pop();
console.log(item);   // 3
console.log(arr);   // [-2, -1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]

二、shift()

與push()方法配合使用能夠構成先進先出的隊列，該方法可刪除數組第一項並返回該項。

繼續接着上例：

var item = arr.shift();
console.log(item);  // -2
console.log(arr);  // [-1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]

三、slice()

該方法同concat()同樣是返回一個新數組，不會影響原數組，只不過slice()是用來裁剪數組的，返回裁剪下來的數組，具體用法以下：

slice()方法能夠接受一或兩個參數，即要返回項的起始和結束位置。在只有一個參數的狀況下，slice()方法返回從該參數指定位置開始到當前數組末尾的全部項。若是有兩個參數，該方法返回起始和結束位置之間的項——但不包括結束位置的項。

我們仍是繼續接着上面例子吧~~

var arr2 = arr.slice(2,6);
console.log(arr);  // [-1, 0, 0.2, 0.4, 0.6, 0.8, 1, 2]
console.log(arr2);  // [0.2, 0.4, 0.6, 0.8]

四、splice()

好，繼續講這個「萬能」的方法。

上面講到，該方法在添加數組元素的時候須要傳入3個以上參數，而其中第2個參數就是用於指定要刪除元素的個數的，那時咱們傳的是數字0。那麼，若是單單隻需刪除元素，咱們就只需給splice()傳入兩個參數，第1個參數用於指定要刪除的第一項的位置，第2個參數用於指定要刪除元素的個數。

繼續上例~~

arr.splice(2,4);
console.log(arr);  // [-1, 0, 1, 2]

從索引項爲2的位置開始刪除4個元素，因此結果爲 [-1, 0, 1, 2]。

3、改

這個其實最靈活的方式就是直接使用splice()這個強大的方法了，其實經過以上對該方法的瞭解，咱們大體就能知道使用該方法修改數組元素的基本原理。

原理很簡單，就是向指定位置插入任意數量的元素，且同時刪除任意數量的元素。

依然繼續上例~~

arr.splice(2,1,0.5,1,1.5);
console.log(arr);   //  [-1, 0, 0.5, 1, 1.5, 2]

4、查

indexOf()和lastIndexOf()

這兩個方法都接收兩個參數：要查找的項和（可選的）表示查找起點位置的索引。其中，indexOf()從數組的開頭（位置0）開始向後查找，lastIndexOf()方法則從數組的末尾開始向前查找。

例如：

var index = arr.indexOf(0);
console.log(index);   // 1
index = arr.indexOf(3,0);
console.log(index);   // -1

當找不到該元素時，返回 -1 ，lastIndexOf()方法同理。