【前端知识】JavaScript——5个迭代函数:every、filter、forEach、map、some
JavaScript高级程序设计(第4版):ECMAScript 为数组定义了 5 个迭代方法。每个方法接收两个参数:以每一项为参数运行的函数,以及可选的作为函数运行上下文的作用域对象(影响函数中 this 的值)。传给每个方法的函数接收 3个参数:数组元素、元素索引和数组本身。因具体方法而异,这个函数的执行结果可能会也可能不会影响方法的返回值。数组的 5 个迭代方法如下。
函数 | 描述 |
---|---|
every() | 对数组每一项都运行传入的函数,如果对每一项函数都返回 true,则这个方法返回 true。 |
filter() | 对数组每一项都运行传入的函数,函数返回 true 的项会组成数组之后返回。 |
forEach() | 对数组每一项都运行传入的函数,没有返回值。 |
map() | 对数组每一项都运行传入的函数,返回由每次函数调用的结果构成的数组。 |
some() | 对数组每一项都运行传入的函数,如果有一项函数返回 true,则这个方法返回 true。 |
-
【区别一】every() 和 some()
对 every() 来说,传入的函数必须对每一项都返回 true,它才会返回 true;否则,它就返回 false。而对 some() 来说,只要有一项让传入的函数返回 true,它就会返回 true。
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; let everyResult = numbers.every((item, index, array) => item > 2); console.log(everyResult); // false let someResult = numbers.some((item, index, array) => item > 2); console.log(someResult); // true
-
【区别二】filter()
every() 和 some()返回值是true/false,而 filter() 返回的是数组,其决定某一项是否应该包含在它返回的数组中。
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; let filterResult = numbers.filter((item, index, array) => item > 2); console.log(filterResult); // 3,4,5,4,3
-
【区别三】map()
filter() 返回符号条件的子项,而 map() 对原始数组中同样位置的元素运行传入函数而返回所有元素的结果。
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; let mapResult = numbers.map((item, index, array) => item * 2); console.log(mapResult); // 2,4,6,8,10,8,6,4,2
-
【区别四】forEach()
不同于上面4个迭代方法,forEach() 只会对每一项运行传入的函数,没有返回值。
let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]; numbers.forEach((item, index, array) => { // 执行某些操作 console.log(item); });