JS数组的迭代

cc17 发布于2019-08-23 15:38 / 483人阅读

摘要：方法对数组的每个元素执行一次提供的函数。与的区别是返回一个循环处理后的数组，不改变原数组的值，而则只是遍历一遍数组，执行提供的函数。对于放在空数组上的任何条件，此方法返回。

forEach

forEach() 方法对数组的每个元素执行一次提供的函数。

var array1 = ["a", "b", "c"];

array1.forEach(function(element) {
  console.log(element);
});

// expected output: "a"
// expected output: "b"
// expected output: "c"

forEach()是没有办法中止或者跳出循环的，除非抛出一个异常。

map

map() 方法创建一个新数组，其结果是该数组中的每个元素都调用一个提供的函数后返回的结果。

var array1 = [1, 4, 9, 16];

// pass a function to map
const map1 = array1.map(x => x * 2);

console.log(map1);
// expected output: Array [2, 8, 18, 32]

map()与forEach()的区别是map返回一个循环处理后的数组，不改变原数组的值，而forEach则只是遍历一遍数组，执行提供的函数。

for of

for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句

let iterable = [10, 20, 30];

for (const value of iterable) {
  console.log(value);
}
// 10
// 20
// 30

关于for...of语句遍历更多用法mdn

filter

filter() 方法创建一个新数组, 其包含通过所提供函数实现的测试的所有元素。

var words = ["spray", "limit", "elite", "exuberant", "destruction", "present"];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

reduce

reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行)，将其结果汇总为单个返回值。

const array1 = [1, 2, 3, 4];
// 1 + 2 + 3 + 4
console.log(array1.reduce((accumulator, currentValue) => accumulator + currentValue));
// expected output: 10

every

every() 方法测试数组的所有元素是否都通过了指定函数的测试。

function isBigEnough(element, index, array) {
  return (element >= 10);
}
var passed = [12, 5, 8, 130, 44].every(isBigEnough);
// passed is false
passed = [12, 54, 18, 130, 44].every(isBigEnough);
// passed is true

some

some() 方法测试是否至少有一个元素通过由提供的函数实现的测试。
对于放在空数组上的任何条件，此方法返回false。

[2, 5, 8, 1, 4].some(x => x > 10);  // false
[12, 5, 8, 1, 4].some(x => x > 10); // true

GPU云服务器云服务器 js迭代数组数组迭代器 javascript迭代数组 js 数组的索引

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/102368.html

JS迭代器模式《JavaScript设计模式与开发实践》阅读笔记

摘要：但实际中，内部迭代器和外部迭代器两者并无优劣。迭代器并不只迭代数组迭代器模式不仅能迭代数组，还可以迭代一些类数组对象。晚安了，参考设计模式与开发实践曾探本文作者本文链接迭代器模式设计模式与开发实践阅读笔记迭代器模式：一个相对简单的模式，目前绝大多数语言都内置了迭代器，以至于大家都不觉得这是一种设计模式迭代器模式迭代器模式指提供一种方法访问一个聚合对象中的各个元素，而又不需要暴露该...

djfml 2019-08-23 10:43 评论0 收藏0
js中的常见的循环迭代：for loop, forEach, for...in... for...

摘要：下面就总结下中常见的几种循环方法。因为循环将遍历对象本身的所有可枚举属性，以及对象从其构造函数原型中继承的属性。上也明确提示不应该用于迭代一个，其中索引顺序很重要。引言平时工作中循环的使用场景可以说是非常之多了，昨天改别人代码时候有位同事非常喜欢用ES6等新特性，一个数组的遍历全部都是用for...of...，然后业务需求要用到数组中的序号index值，就很尴尬了，我只能改回for...

Leo_chen 2019-08-23 12:44 评论0 收藏0
js for of 无法改变数组变量

摘要：今天写个函数时想遍历数组，想想没怎么用过这类的语法，于是做了个尝试，竟发现无法改变数组元素。这里我们可以看到的本质是返回一个迭代器第三，迭代器是如何获得值的迭代器通过方法返回值，而不是指向地址，所以在迭代中无法改变数组元素参考材料今天写个函数时想遍历数组，想想没怎么用过for...of...这类的语法，于是做了个尝试，竟发现for...of...无法改变数组元素。贴代码，上例子 l...

hover_lew 2019-08-23 10:28 评论0 收藏0
js 中的迭代方法

摘要：根据使用的方法不同，这个函数执行后的返回值可能会也可能不会影响方法的返回值。对数组中的每一项运行给定函数，返回改函数会返回的项组成的数组。 ECMAScript 为数组定义了五个迭代方法。每个方法都接收两个参数：要在每一项上运行的函数和（可选的）运行该函数的作用域对象——影响this的值。传入这些方法中的函数会接收三个参数：数组项的值、该项在数组中的位置和数组对象本省。根据使用的...

fsmStudy 2019-08-20 17:34 评论0 收藏0
js数组操作--使用迭代方法替代for循环

摘要：还有一个就是，我本身在数组的遍历上，基本都是用循环进行操作，在开始使用了迭代方法之后，我循环用的很少。对数组中每一项运行给定函数。返回该函数会返回的项组成的数组。前言数组的迭代方法，这个想必大家都不陌生了，可能刚入门的人暂时还没接触到这个。但是以后的开发中，肯定会用得上的。我自身的一个使用经历就是，如果迭代方法用的适当，不但可以减少代码量，也能使代码可读性更强，性能上的优化也是肯定...

kamushin233 2019-08-21 15:55 评论0 收藏0