接上一篇《Javascript數組Array基礎介紹》,這一篇詳細介紹Array的所有方法。
所有數組的方法都定義在Array.prototype上,而Array.prototype本身也是一個數組。
array.concat()
淺復制一份當前數組,並把接收到的參數附加到新數組的末尾。原數組不改變。
語法
array.concat(value1, value2, ..., valueN)
參數為需要合並的數組或非數組值
var arr1 = [1, 2, 3]; var obj = {animal : 'monkey'}; var arr2 = arr1.concat([4, 5, 6], obj, [7, 8, 9]); // arr1 [1, 2, 3] // arr2 [1, 2, 3, 4, 5, 6, {animal : 'monkey'}, 7, 8, 9] obj.animal = 'tiger'; // [1, 2, 3, 4, 5, 6, {animal : 'tiger'}, 7, 8, 9]
可以合並數組或非數組值,但是要注意如果包含對象,對象還是引用原來的對象。
array.join()
返回一個將數組所有元素用分隔符拼接成的字符串,默認分隔符為逗號。
語法
array.join(seperator)
參數為分割符
var arr1 = [1, 2, 3]; var str = arr1.join(); // 1,2,3 str = arr1.join('#'); // 1#2#3
當將大量字符串片段組裝時,join方法比+元素運算符要快。
利用new Array(3)將生成一個長度為三的空數組,同時結合join()方法,可以實現重復某段字符串。
var str = new Array(3).join('-+'); // -+-+
重復的次數就是數組長度減一,因為字符串是分隔符。
由於數組本身是對象,擁有toString()方法,利用它也能實現將數組拼接成一個字符串,只不過分隔符只能是逗號了。
var arr1 = [1, 2, 3]; arr1.toString(); // 1,2,3
實際上它會先調用每一個元素的toString()方法。
array.push()
把一個或多個參數附加在數組末尾,返回數組長度。改變數組自身。
語法
array.push(value1, value2, ..., valueN);
實例
var arr1 = [1, 2, 3]; var len = arr1.push(4, 5); console.log(len); // 5 console.log(arr1); // [1, 2, 3, 4, 5]
另一種方法也可以實現在數組末尾插入值。
arr1[arr1.length] = 6; // [1, 2, 3, 4, 5, 6] array.pop()
將數組最後一項刪除,並返回刪除項。改變數組自身。
var arr1 = [1, 2, 3]; arr.pop(); // [1, 2] 返回 3
如果數組為空,返回undefined。
array.unshift()
把一個或多個參數插入到數組頭部,返回數組長度。改變數組自身。
var arr1 = [1, 2, 3]; var len = arr1.unshift(4, 5); console.log(len); // 5 console.log(arr1); // [4, 5, 1, 2, 3]
array.shift()
將數組的第一項刪除,並返回刪除項。改變數組自身。
var arr1 = [1, 2, 3]; arr.shift(); // [2, 3] 返回 1
如果數組為空,返回undefined。
array.sort()
這個方法按照每個元素的toString()方法返回的值進行排序,所以一般得不到期望的結果。
var arr1 = [1, 2, 3, 14, 24]; arr1.sort(); // [1, 14, 2, 24, 3]
但是sort()方法可以接收一個我們自定義的函數進行比較。比較函數接受兩個參數,尤其sort()默認是升序,所以如果想讓第一個參數位於第二個參數前面就要返回負數,相等返回0,位於後面返回正數。
var compare = function(a, b){ return a - b; } var arr2 = [1, 12, 2, 23, 3 , 5, 4]; arr2.sort(compare); // [1, 2, 3, 4, 5, 12, 23]
比較字符串可以結合string.localeCompare()方法來用。
var arr3 = ['F', 'e', 'f', 'E']; arr3.sort(function(a, b){ return a.localeCompare(b); }); // ['e', 'E', 'f', 'F']
array.reverse()
反轉數組元素順序,返回數組自身。
var arr1 = [1, 4, 3, 2]; arr1.reverse(); // [2, 3, 4, 1]
array.slice()
對數組淺復制其中的一段,不改變數組自身。
array.slice(start, end);
方法接受兩個參數,最後一個可以省略,默認是數組自身長度。
var arr1 = [1, 2, 3, 4, 5, 6]; arr1.slice(4); // [5, 6] arr1.slice(2, 4); // [3, 4] arr1.slice(-3); // [4, 5, 6]
如果傳入負數,那麼會被自動加上數組的長度,試圖變成非負數。
傳入一個絕對值小於數組長度的值,就是從後向前取負數絕對值個數的元素。例如例子中取了後三個元素。
array.splice()
這是數組中最強大也最常用對的方法了,可以實現刪除,插入,替換。
語法
array.slice(start, count, item);
該方法移除一個或多個元素,並用新的元素替代他們。start是開始的位置,count是刪除的數量,item是新增加的元素(item不止一個,也可省略),以數組形式返回刪除的元素。
var arr1 = [1, 2, 3, 4, 5]; //刪除 arr1.splice(2, 1); // [1, 2, 4, 5] 返回 [3] //插入 arr1.splice(3, 0, 6, 7); // [1, 2, 4, 6, 7, 5] //替換 arr1.splice(1, 2, 8, 9); // [1, 8, 9, 6, 7, 5] 返回[2, 4]
下面介紹一些ECMAScript5新增的方法,主要是ie8不支持。
indexOf() 與 lastIndexOf()
查找對應項在數組中的索引位置,第二個參數表示對應查找方向的起始位置,返回第一個匹配的位置,如果沒有找到則返回-1;
indexOf()是從前往後查找,lastIndexOf()是從後往前查找。
var arr1 = [1, 2, 3, 4, 3, 2, 1]; arr1.indexOf(2); // 1 arr1.indexOf(2, 3); // 5 arr1.lastIndexOf(3); // 4 arr1.lastIndexOf(3, 4) // 2
迭代方法
以下方法接受兩個參數,第一個是每一項運行的函數,第二個函數運行的作用域。
運行函數有三個參數,分別是當前項,位置,數組本身。
array.every()
運行給定函數,如果迭代每一項都返回true,則最終返回true。
var arr1 = [1, 2, 3, 4, 5]; arr1.every(function(item, index, array){ return item > 3; }); // false
array.some()
運行給定函數,如果迭代中有一項返回true,則最終返回true。
arr1.some(function(item, index, array){ return item > 3; }); // true
array.map()
運行給定函數,將迭代中返回的值組成數組,返回該數組。
arr1.map(function(item, index, array){ return item * 2; }); // [2, 4, 6, 8, 10]
array.filter()
運行給定函數,將迭代中返回true的元素以數組形式返回
arr1.filter(function(item, index, array){ return item > 3; }); // [4, 5]
array.forEach()
運行給定函數,不返回任何值。類似於普通的for循環的功能。
歸並方法
函數接受兩個參數,第一個參數是每一個運行的自定義函數,第二項是作為歸並基礎的初始值。
自定義函數接受四個參數,分別是前一項,當前項,位置,數組。
array.reduce() 與 array.reduceRight() var splitstr = function(prev, item, index, array){ return prev + '#' + item; } var arr1 = [1, 2, 3, 4, 5]; arr1.reduce(splitstr, 8); // 8#1#2#3#4#5 arr1.reduceRight(splitstr, 8); // 8#5#4#3#2#1
小結
這一篇介紹了數組方法的種種細節和注意問題,下一篇將會介紹數組更高級的用法。本篇後續會添加ECMAScript6 新增加的數組方法的介紹。