JavaScript数组迭代方法详解:map、forEach、reduce与filter
作者:纸飞机时间:2026-10-28 21:49:37浏览:416
本文详细介绍JavaScript中数组的四种核心迭代方法:map、forEach、reduce和filter。通过具体代码示例,解析如何利用map生成新数组,使用forEach执行副作用操作,借助reduce进行累积计算,以及通过filter筛选符合条件的元素。这些方法是前端开发中处理数组数据的基础工具,掌握它们能有效提升代码效率与可读性。
JavaScript数组迭代方法详解
本文通过具体实例,详细解析了JavaScript中数组的迭代处理方法。这些方法为开发者提供了高效操作数组数据的工具,适合希望深入理解JS数组操作的读者参考。
核心迭代方法代码示例
<!doctype html>
<html>
<head lang="zh">
<meta charset="utf-8">
<title>js数组迭代</title>
<meta name="renderer" content="webkit">
<script>
var arr1 = [1,2,3,4,5,6];
function double(x){
return 2*x;
}
// map可以产生一个新的数组
// alert(arr1.map(double));
function print(x){
console.log(x*2)
}
arr1.forEach(print);
function even(x){
return x %2 ==0
}
var arr2 = [2,4,,5,6];
// alert(arr2.every(even))//false;
// alert(arr2.some(even))//true;
function add(a,b){
return a*b;
}
var arr3=[1,2,4,5];
var factorial = arr3.reduce(add);
//alert(factorial) //40
var arr4=[1,24,5,6,7,8,234,4];
alert(arr4.filter(even))
</script>
<pre>
map,filter可以产生一个新的数组
var arr1 = [1,2,3,4,5,6];
function double(x){
return 2*x;
}
//alert(arr1.map(double));
//forEach是对数组每项都调用某个函数,不返回
function print(x){
console.log(x*2)
}
arr1.forEach(print);
//some,every 参数是一个有返回布尔值的函数
function even(x){
return x %2 ==0
}
var arr2 = [2,4,,5,6];
// alert(arr2.every(even))//false;
// alert(arr2.some(even))//true;
//reduce接受一个函数,返回一个值 ,不断累加到最后一项
//同理,reduceRight是由后面累加到第一项,具体可从CONCAT 看出
function add(a,b){
return a*b;
}
var arr3=[1,2,4,5];
var factorial = arr3.reduce(add);
//alert(factorial) //40
//filter与every类似,参入一个返回布尔值 的函数,返回一个新的数组
</pre>
</body>
</html>
希望上述关于JavaScript数组迭代处理的介绍,能为读者的程序设计工作提供实际帮助。
作者最新文章
JS动态构建复杂嵌套JSON对象的方法
2026-11-05 15:41:52
JS负数取余为什么是负数?详解余数与模运算区别
2026-11-05 13:34:41
JS 解压出现乱码或报错怎么解决?
2026-11-05 12:32:38
JS 中 startsWith、indexOf 与正则判断字符串前缀的对比
2026-11-04 22:19:43
JS解析Excel后怎么将数据转换为JSON格式
2026-11-04 20:58:28
