JavaScript 數組迭代方法
- JS 數組排序
- JS 日期
數組迭代方法對每個數組項進行操作。
Array.forEach()
forEach() 方法為每個數組元素調用一次函數（回調函數）。
實例
<code>var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value, index, array) {
txt = txt + value + "
";
}
/<code>
親自試一試
註釋：該函數接受 3 個參數：
- 項目值
- 項目索引
- 數組本身
上面的例子只用了 value 參數。這個例子可以重新寫為：
實例
<code>var txt = "";
var numbers = [45, 4, 9, 16, 25];
numbers.forEach(myFunction);
function myFunction(value) {
txt = txt + value + "
";
}
/<code>
親自試一試
所有瀏覽器都支持 Array.forEach()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.map()
map() 方法通過對每個數組元素執行函數來創建新數組。
map() 方法不會對沒有值的數組元素執行函數。
map() 方法不會更改原始數組。
這個例子將每個數組值乘以2：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value, index, array) {
return value * 2;
}
/<code>
親自試一試
請注意，該函數有 3 個參數：
- 項目值
- 項目索引
- 數組本身
當回調函數僅使用 value 參數時，可以省略索引和數組參數：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var numbers2 = numbers1.map(myFunction);
function myFunction(value) {
return value * 2;
}
/<code>
親自試一試
所有瀏覽器都支持 Array.map()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.filter()
filter() 方法創建一個包含通過測試的數組元素的新數組。
這個例子用值大於 18 的元素創建一個新數組：
實例
<code>var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
/<code>
親自試一試
請注意此函數接受 3 個參數：
- 項目值
- 項目索引
- 數組本身
在上面的例子中，回調函數不使用 index 和 array 參數，因此可以省略它們：
實例
<code>var numbers = [45, 4, 9, 16, 25];
var over18 = numbers.filter(myFunction);
function myFunction(value) {
return value > 18;
}
/<code>
親自試一試
所有瀏覽器都支持 Array.filter()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.reduce()
reduce() 方法在每個數組元素上運行函數，以生成（減少它）單個值。
reduce() 方法在數組中從左到右工作。另請參見 reduceRight（）。
reduce() 方法不會減少原始數組。
這個例子確定數組中所有數字的總和：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
/<code>
親自試一試
請注意此函數接受 4 個參數：
- 總數（初始值/先前返回的值）
- 項目值
- 項目索引
- 數組本身
上例並未使用 index 和 array 參數。可以將它改寫為：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction);
function myFunction(total, value) {
return total + value;
}
/<code>
親自試一試
reduce() 方法能夠接受一個初始值：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduce(myFunction, 100);
function myFunction(total, value) {
return total + value;
}
/<code>
親自試一試
所有瀏覽器都支持 Array.reduce()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.reduceRight()
reduceRight() 方法在每個數組元素上運行函數，以生成（減少它）單個值。
reduceRight() 方法在數組中從左到右工作。另請參見 reduce（）。
reduceRight() 方法不會減少原始數組。
這個例子確定數組中所有數字的總和：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value, index, array) {
return total + value;
}
/<code>
親自試一試
請注意此函數接受 4 個參數：
- 總數（初始值/先前返回的值）
- 項目值
- 項目索引
- 數組本身
上例並未使用 index 和 array 參數。可以將它改寫為：
實例
<code>var numbers1 = [45, 4, 9, 16, 25];
var sum = numbers1.reduceRight(myFunction);
function myFunction(total, value) {
return total + value;
}
/<code>
親自試一試
所有瀏覽器都支持 Array.reduceRight()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.every()
every() 方法檢查所有數組值是否通過測試。
這個例子檢查所有數組值是否大於 18：
實例
<code>var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
/<code>
親自試一試
請注意此函數接受 3 個參數：
- 項目值
- 項目索引
- 數組本身
如果回調函數僅使用第一個參數（值）時，可以省略其他參數：
實例
<code>var numbers = [45, 4, 9, 16, 25];
var allOver18 = numbers.every(myFunction);
function myFunction(value) {
return value > 18;
}
/<code>
親自試一試
所有瀏覽器都支持 Array.every()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.some()
some() 方法檢查某些數組值是否通過了測試。
這個例子檢查某些數組值是否大於 18：
實例
<code>var numbers = [45, 4, 9, 16, 25];
var someOver18 = numbers.some(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
/<code>
親自試一試
請注意此函數接受 3 個參數：
- 項目值
- 項目索引
- 數組本身
所有瀏覽器都支持 Array.some()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
Array.indexOf()
indexOf() 方法在數組中搜索元素值並返回其位置。
註釋：第一個項目的位置是 0，第二個項目的位置是 1，以此類推。
實例
檢索數組中的項目 "Apple"：
<code>var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.indexOf("Apple");
/<code>
親自試一試
所有瀏覽器都支持 Array.indexOf()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
語法
<code>array.indexOf(item, start)/<code>
item 必需。要檢索的項目。 start 可選。從哪裡開始搜索。負值將從結尾開始的給定位置開始，並搜索到結尾。
如果未找到項目，Array.indexOf() 返回 -1。
如果項目多次出現，則返回第一次出現的位置。
Array.lastIndexOf()
Array.lastIndexOf() 與 Array.indexOf() 類似，但是從數組結尾開始搜索。
實例
檢索數組中的項目 "Apple"：
<code>var fruits = ["Apple", "Orange", "Apple", "Mango"];
var a = fruits.lastIndexOf("Apple");
/<code>
親自試一試
所有瀏覽器都支持 Array.lastIndexOf()，除了 Internet Explorer 8 或更早的版本：
Yes 9.0 Yes Yes Yes
語法
<code>array.lastIndexOf(item, start)/<code>
item 必需。要檢索的項目。 start 可選。從哪裡開始搜索。負值將從結尾開始的給定位置開始，並搜索到開頭。
Array.find()
find() 方法返回通過測試函數的第一個數組元素的值。
這個例子查找（返回）大於 18 的第一個元素的值：
實例
<code>var numbers = [4, 9, 16, 25, 29];
var first = numbers.find(myFunction);
function myFunction(value, index, array) {
return value > 18;
}
/<code>
親自試一試
請注意此函數接受 3 個參數：
- 項目值
- 項目索引
- 數組本身
老舊的瀏覽器不支持 Array.find()。下面列出了完全支持此方法的首個瀏覽器版本：
45 12 25 8 32
閱讀更多 鎮上寶塔 的文章
關鍵字: 瀏覽器 JavaScript 實例
