JavaScript ES5数组迭代方法详解与实战

作者:异步漫步

时间:2026-10-21

浏览:166

本文系统介绍ECMAScript5定义的5种数组迭代方法:every、some、filter、map和forEach。详细解析各方法接收的参数、返回值类型及适用场景,结合工资清单示例演示条件判断、数据筛选与转换的实际用法,帮助开发者高效处理数组数据。

文章目录

近期工作涉及大量数据处理,其中数组操作尤为频繁,常需进行遍历与转换。鉴于网络资料较为分散,笔者查阅《JavaScript高级程序设计》(红宝书)并整理笔记,以便日后查阅。

数组迭代方法概述

数组常用的迭代方法

ECMAScript5规范为数组定义了5种迭代方法。这些方法均接收两个参数:第一个是在数组每一项上执行的回调函数fn,第二个是可选的作用域对象,用于指定回调函数执行时的this值。

传入这些迭代方法的回调函数(fn)会接收3个参数:item(当前元素)、index(当前索引)和array(原数组)。示例如下:


array.forEach(function(item,index,array){
  //do your staff here;
},this)

根据具体方法的不同,回调函数执行后的返回值可能会影响或不会影响迭代方法本身的返回值。

这5种迭代方法的作用及返回值概览如下:

ECMAScript5 Array元素迭代方法

方法名 方法作用  返回值
every() 针对数组中每一项元素运行指定函数 Boolean:若每一项都返回true,返回true;
filter() 针对数组中每一项元素运行指定函数, Array:   返回函数运行返回true的元素组成的新数组
forEach() 针对数组中每一项元素运行指定函数 null:  无返回值
map() 针对数组中每一项元素运行指定函数  Array:  返回函数运行后,得到到新新元素组成的新数组
some() 针对数组中每一项元素运行指定函数 Boolean: 若有任意一项执行函数后返回true, 则返回true

简而言之:

every()和some()方法适用于对数组元素进行条件判断;

filter()和map()方法适用于对数组进行条件筛选或再处理;

forEach()方法不对原数组本身做操作,仅对数组元素进行二次应用;

各方法使用示例

下面介绍各个方法的使用示例:

假设一个场景:你拿到了公司的本月工资清单,假设你的工资为9000;公司员工工资组成的数组为salaries=[8500,12000,9900,9000],

a. 想知道 你的工资是不是最低的;

b.想知道 有没有人和你工资一样多;

c.想知道 是不是所有人待遇都一样;

d.想把大家的工资都换成K为单位的数据


var a,b,c;
var your=9000;
var salaries=[8500,12000,9900,9000];
 a=slaries.some(function(item,index,array){
  return item<9000
});
console.log(a);//true;恭喜你,还有人比你工资更低
b=salaries.filter(function(item,index,array){
  return item== your;
})
console.log(b);//[9000] 呵呵,有人跟你待遇一样
c=salaries.every(function(item,index,array){
  return item==your; 
});
console.log(c);//false .不是所有人都和你一样待遇哦
d=salaries.map(function(item,index,array){
  return item/1000 
});
console.log(d);//[8.5,12,9.9,9]

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持本站!

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章