JS操作數組常用實用方法

1.join()方法:對數組進行指定分隔符分割成一個字元串。

var fruits = ["Banana", "Orange","Apple", "Mango"];
document.getElementById("demo").innerHTML = fruits.join(" * "); 
           

結果為：Banana * Orange * Apple * Mango

2.pop()和 push():pop()方法彈出數組末尾的最後一個元素，并傳回該元素。push()方法在數組末尾增加一個元素。這兩個方法正常都是一起使用的。這兩個方法比較常用，就不貼代碼了。

3.shift()和unshift()：與pop()和push()剛好反過來，shift()是在數組的開頭删除首元素，然後其他元素依次向前進一位，他傳回的是删除的元素。unshift()是在數組的開頭插入一個對象，然後其他元素依次向後退一位，他傳回的是新的數組的長度。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.shift();             // 傳回 "Banana"

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon");    // 向 fruits 添加新元素 "Lemon"，傳回 5
           

4.splice()：用于拼接數組

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var newFruits=fruits.splice(2, 0, "Lemon", "Kiwi");
           

splice()的第一個參數表示從第幾個位置開始，第二個參數表示要删除幾個元素，其餘參數表示要插入哪些元素，它不會替代原來的數組，而是生成一個新的數組。如上述代碼表示從第二位開始，删除0個元素，插入Lemon、Kiwi兩個元素。

同理，splice()也可以用來删除指定位置的多個元素，并且插入新元素。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 2, "Lemon", "Kiwi");
           

如上述表示，從第二位置開始，删除兩個元素，再插入Lemon、Kiwi兩個元素。

5.concat():用來合并多個數組，傳回一個新的數組。

var arr1 = ["Cecilie", "Lone"];
var arr2 = ["Emil", "Tobias", "Linus"];
var arr3 = ["Robin", "Morgan"];
var myChildren = arr1.concat(arr2, arr3);   // 将arr1、arr2 與 arr3 連接配接在一起
           

6.slice()：從數組中的某個位置之後，裁剪出一個新的數組，并傳回新數組。

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var citrus = fruits.slice(3);
           

傳回的citrus的結果為Apple,Mango

7.sort():當内容是字元串數組時，預設按照以字母順序對數組進行排序。

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();            // 對 fruits 中的元素進行排序
           

 傳回的結果是["Apple","Banana","Mango","Orange"];

 對于數字的數組而言，我們通過一個比值函數來修正此問題。

var points = [40, 100, 1, 5, 25, 10];
//表示按從小到大的順序進行排序
points.sort(function(a, b){return a - b});
//表示按照從大到小的順序進行排序 
points.sort(function(a, b){return b - a}); 
//表示按照随機的順序進行排序
points.sort(function(a, b){return 0.5 - Math.random()}); 
           

8.reverse() :反轉數組中的元素,即倒叙排序，直接調用既可以，不貼代碼。

9.forEach():為數組裡面的每個元素調用一次函數。

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);

function myFunction(value) {
  txt = txt + value + "<br>"; 
}
           

調用此函數，使數組變成字元串數組，并且每個結尾都以"<br>"結束。

10.filter()：為數組過濾掉不符合條件的内容

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);

function myFunction(value) {
  return value > 18;
}
           

如上例子，表示獲得數組中大于18的元素，然後傳回一個新數組。

11.reduce()：在數組中循環疊加計算某個函數，如果要指定他按照從左往右的順序循環疊加，則使用reduceRight()。

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);

function myFunction(total, value, index, array) {
  return total * value;
}
           

如上例子，表示循環疊加地把數組内的元素相乘起來，傳回一個最終疊加結果。