本文介绍JavaScript中Array.prototype.forEach()方法的用法,通过股票符号提取示例,对比传统for循环与forEach的实现方式,展示如何利用forEach简化数组遍历代码并获取相同输出结果。
Array.prototype.forEach()方法简介
Array.prototype.forEach()方法使数组的每个元素执行一次提供的回调函数。 — MDN
使用forEach提取数组元素示例
假设存在如下场景,获取到一个数组数据
[ { symbol: "XFX", price: 240.22, volume: 23432 }, { symbol: "TNZ", price: 332.19, volume: 234 }, { symbol: "JXJ", price: 120.22, volume: 5323 }, ]
你需要基于其中的symbol字段构建一个新数组,即
[ "XFX", "TNZ", "JXJ"] 通常可通过for循环实现:
function getStockSymbols(stocks) {
var symbols = [],
stock,
i;
for (i = 0; i < stocks.length; i++) {
stock = stocks[i];
symbols.push(stock.symbol);
}
return symbols;
}
var symbols = getStockSymbols([
{ symbol: "XFX", price: 240.22, volume: 23432 },
{ symbol: "TNZ", price: 332.19, volume: 234 },
{ symbol: "JXJ", price: 120.22, volume: 5323 },
]);
输出: "[/"XFX/", "TNZ/", "JXJ/"]"
你也可以利用Array的forEach方法来简化代码逻辑,其输出结果完全一致。
function getStockSymbols(stocks) {
var symbols = [];
stocks.forEach(function(stock) {
symbols.push(stock.symbol);
});
return symbols;
}