JavaScript 數組迭代

數組迭代方法對每個數組項進行操作。

Array.forEach()

forEach() 方法為每個數組元素調用一次函數（回調函數）。

實例

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value, index, array) {
  txt = txt + value + "<br>"; 
}

親自試一試

注釋：該函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

上面的例子只用了 value 參數。這個例子可以重新寫為：

實例

var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value) {
  txt = txt + value + "<br>"; 
}

親自試一試

所有瀏覽器都支持 Array.forEach()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.map()

map() 方法通過對每個數組元素執行函數來創建新數組。

map() 方法不會對沒有值的數組元素執行函數。

map() 方法不會更改原始數組。

這個例子將每個數組值乘以2：

實例

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
  return value * 2;
}

親自試一試

請注意，該函數有 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

當回調函數僅使用 value 參數時，可以省略索引和數組參數：

實例

var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value) {
  return value * 2;
}

親自試一試

所有瀏覽器都支持 Array.map()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.filter()

filter() 方法創建一個包含通過測試的數組元素的新數組。

這個例子用值大于 18 的元素創建一個新數組：

實例

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

親自試一試

請注意此函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

在上面的例子中，回調函數不使用 index 和 array 參數，因此可以省略它們：

實例

var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value) {
  return value > 18;
}

親自試一試

所有瀏覽器都支持 Array.filter()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.reduce()

reduce() 方法在每個數組元素上運行函數，以生成（減少它）單個值。

reduce() 方法在數組中從左到右工作。另請參閱 reduceRight()。

reduce() 方法不會減少原始數組。

這個例子確定數組中所有數字的總和：

實例

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value, index, array) {
  return total + value;
}

親自試一試

請注意此函數接受 4 個參數：

  • 總數（初始值/先前返回的值）
  • 項目值
  • 項目索引
  • 數組本身

上例并未使用 index 和 array 參數。可以將它改寫為：

實例

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value) {
  return total + value;
}

親自試一試

reduce() 方法能夠接受一個初始值：

實例

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);
function myFunction(total, value) {
  return total + value;
}

親自試一試

所有瀏覽器都支持 Array.reduce()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.reduceRight()

reduceRight() 方法在每個數組元素上運行函數，以生成（減少它）單個值。

reduceRight() 方法在數組中從右到左工作。另請參閱 reduce()。

reduceRight() 方法不會減少原始數組。

這個例子確定數組中所有數字的總和：

實例

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
  return total + value;
}

親自試一試

請注意此函數接受 4 個參數：

  • 總數（初始值/先前返回的值）
  • 項目值
  • 項目索引
  • 數組本身

上例并未使用 index 和 array 參數。可以將它改寫為：

實例

var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
  return total + value;
}

親自試一試

所有瀏覽器都支持 Array.reduceRight()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.every()

every() 方法檢查所有數組值是否通過測試。

這個例子檢查所有數組值是否大于 18：

實例

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

親自試一試

請注意此函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

如果回調函數僅使用第一個參數（值）時，可以省略其他參數：

實例

var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value) {
  return value > 18;
}

親自試一試

所有瀏覽器都支持 Array.every()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.some()

some() 方法檢查某些數組值是否通過了測試。

這個例子檢查某些數組值是否大于 18：

實例

var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

親自試一試

請注意此函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

所有瀏覽器都支持 Array.some()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

Array.indexOf()

indexOf() 方法在數組中搜索元素值并返回其位置。

注釋：第一個項目的位置是 0，第二個項目的位置是 1，以此類推。

實例

檢索數組中的項目 "Apple"：

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");

親自試一試

所有瀏覽器都支持 Array.indexOf()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

語法

array.indexOf(item, start)
item 必需。要檢索的項目。
start 可選。從哪里開始搜索。負值將從結尾開始的給定位置開始，并搜索到結尾。

如果未找到項目，Array.indexOf() 返回 -1。

如果項目多次出現，則返回第一次出現的位置。

Array.lastIndexOf()

Array.lastIndexOf() 與 Array.indexOf() 類似，但是從數組結尾開始搜索。

實例

檢索數組中的項目 "Apple"：

var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");

親自試一試

所有瀏覽器都支持 Array.lastIndexOf()，除了 Internet Explorer 8 或更早的版本：

Yes 9.0 Yes Yes Yes

語法

array.lastIndexOf(item, start)
item 必需。要檢索的項目。
start 可選。從哪里開始搜索。負值將從結尾開始的給定位置開始，并搜索到開頭。

Array.find()

find() 方法返回通過測試函數的第一個數組元素的值。

這個例子查找（返回）大于 18 的第一個元素的值：

實例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

親自試一試

請注意此函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

老舊的瀏覽器不支持 Array.find()。下面列出了完全支持此方法的首個瀏覽器版本：

45 12 25 8 32

Array.findIndex()

findIndex() 方法返回通過測試函數的第一個數組元素的索引。

這個例子查找大于 18 的第一個元素的索引：

實例

var numbers = [4, 9, 16, 25, 29];
var first = numbers.findIndex(myFunction);
function myFunction(value, index, array) {
  return value > 18;
}

親自試一試

請注意此函數接受 3 個參數：

  • 項目值
  • 項目索引
  • 數組本身

老舊的瀏覽器不支持 Array.findIndex()。下面列出了完全支持此方法的首個瀏覽器版本：

45 12 25 8 32