JS中 map, filter, some, every, forEach, for in, for

yankeys 发布于2019-08-20 15:26 / 455人阅读

摘要：有返回值，返回一个符合条件的元素数组返回一个，判断是否有元素符合条件，如果有一个元素符合条件，则循环会终止。返回一个遍历器对象，用来遍历键名键值组成的数组。这三个方法调用后生成的遍历器对象，所遍历的都是计算生成的数据结构。

1.map

有返回值，返回一个新的数组，每个元素为调用func的结果。

let list = [1, 2, 3, 4, 5];
let other = list.map((d, i) => {
    return d * 2;
});
console.log(other);
// print: [2, 4, 6, 8, 10]

2.filter

有返回值，返回一个符合func条件的元素数组

let list = [1, 2, 3, 4, 5];
let other = list.filter((d, i) => {
    return d % 2;
});
console.log(other);
// print: [1, 3, 5]

3.some

返回一个boolean，判断是否有元素符合func条件，如果有一个元素符合func条件，则循环会终止。

let list = [1, 2, 3, 4, 5];
list.some((d, i) => {
    console.log(d, i);
    return d > 3;
});
// print: 1,0 2,1 3,2 4,3
// return false

4.every

返回一个boolean，判断每个元素是否符合func条件，有一个元素不满足func条件，则循环终止，返回false。

let list = [1, 2, 3, 4, 5];
list.every((d, i) => {
    console.log(d, i);
    return d < 3;
});
// print: 1,0 2,1 3,2
// return false

5.forEach

没有返回值，只针对每个元素调用func。
优点：代码简介。
缺点：无法使用break，return等终止循环。

let list = [1, 2, 3, 4, 5];
let other = [];
list.forEach((d, i) => {
    other.push(d * 2);
});
console.log(other);
// print: [2, 4, 6, 8, 10]

6.for in

for-in循环实际是为循环”enumerable“对象而设计的，for in也可以循环数组，但是不推荐这样使用，for–in是用来循环带有字符串key的对象的方法。
缺点：只能获得对象的键名，不能直接获取键值。

var obj = {a:1, b:2, c:3};
for (var prop in obj) {
  console.log("obj." + prop + " = " + obj[prop]);
}
// print:  "obj.a = 1" "obj.b = 2" "obj.c = 3"

7.for of

for of为ES6提供，具有iterator接口，就可以用for of循环遍历它的成员。也就是说，for of循环内部调用的是数据结构的Symbol.iterator方法。
for of循环可以使用的范围包括数组、Set和Map结构、某些类似数组的对象（比如arguments对象、DOM NodeList对象）、后文的Generator对象，以及字符串。
有些数据结构是在现有数据结构的基础上，计算生成的。比如，ES6的数组、Set、Map都部署了以下三个方法，调用后都返回遍历器对象。

entries

entries() 返回一个遍历器对象，用来遍历[键名, 键值]组成的数组。对于数组，键名就是索引值；对于Set，键名与键值相同。Map结构的iterator接口，默认就是调用entries方法。

keys

keys() 返回一个遍历器对象，用来遍历所有的键名。

values

values() 返回一个遍历器对象，用来遍历所有的键值。
这三个方法调用后生成的遍历器对象，所遍历的都是计算生成的数据结构。

// 字符串
let str = "hello";
for (let s of str) {
  console.log(s); // h e l l o
}

// 遍历数组
let list = [1, 2, 3, 4, 5];
for (let e of list) {
    console.log(e);
}
// print: 1 2 3 4 5

// 遍历对象
obj = {a:1, b:2, c:3};
for (let key of Object.keys(obj)) {
  console.log(key, obj[key]);
}
// print:  a 1 b 2 c 3
说明：对于普通的对象，for...in循环可以遍历键名，for...of循环会报错。
一种解决方法是，使用Object.keys方法将对象的键名生成一个数组，然后遍历这个数组。

// entries
let arr = ["a", "b", "c"];
for (let pair of arr.entries()) {
  console.log(pair);
}
// [0, "a"]
// [1, "b"]
// [2, "c"]

GPU云服务器云服务器 for-in js js for-in for循环和foreach java中for

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

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

JS中some(),every(),forEach(),map(),filter()区别

摘要：在中为新增了几个方法，，，，，也就是一共有这么多方法了。刚开始接触这些倒也记得不是很清楚，在此纪录一下以加深影响。我主要从两个角度来理解和记忆吧，一个是的使用，一个是内部实现。 JS在1.6中为Array新增了几个方法map()，filter()，some()，every()，forEach()，也就是一共有这么多方法了。刚开始接触这些倒也记得不是很清楚，在此纪录一下以加深影响。我主...

CoderBear 2019-08-23 14:05 评论0 收藏0
JS 数组循环遍历方法的对比

摘要：循环方法方法不改变原数组方法会给原数组中的每个元素都按顺序调用一次函数。筛选出过滤出数组中符合条件的项组成新数组代码方法方法为数组中的每个元素执行一次函数，直到它找到一个使返回表示可转换为布尔值的值的元素。 showImg(https://segmentfault.com/img/bV2QTD?w=1600&h=500); 前言 JavaScript 发展至今已经发展出多种数组的循环遍...

BlackFlagBin 2019-08-26 11:31 评论0 收藏0
jS:关于对象遍历和数组遍历的那些事

摘要：如图遍历数组遍历数组元素并以某种方式处理每个元素是一个常见的操作。如图不过，里的功能比较强大，可以遍历而且返回值是的则被省略掉总结遍历对象，遍历出来的是键名，而不是键值，参数必须是对象。可能是由于职业的关系，下班之后完全不想Open PC，但很多知识点有必要自己做个小小总结。本人之前对原生Array和Object完全没概念。遍历对象的方法： Object.keys(Object)...

qingshanli1988 2019-08-20 18:16 评论0 收藏0
关于JS循环遍历

摘要：关于循环遍历写下这篇文章的目的，主要是想总结一下关于对于集合对象遍历的方式方法，以及在实际应用场景中怎样去使用它们。的作用主要是去遍历对象的可枚举属性。例如索引，数值打印结果为当第二项不满足条件式跳出循环，返回。关于JS循环遍历写下这篇文章的目的，主要是想总结一下关于JS对于集合对象遍历的方式方法，以及在实际应用场景中怎样去使用它们。本文会主要介绍：while,for,forEac...

eternalshallow 2019-08-21 11:38 评论0 收藏0
IE兼容forEach/map/every/some/indexOf/filter/getCompu

摘要：修复兼容等新方法。在第版时，被添加进标准因此在某些实现环境中不被支持。是在最近的标准中新添加的方法所以一些旧版本的浏览器可能没有实现该方法。算法假定和拥有它们的初始值。修复IE兼容forEach、indexOf、filter、getComputedStyle等新方法。补充：此文是从这里搜集来的developer.mozilla.org，只是个人做个笔记，为了方便以后对JSLite万一...

XUI 2019-08-22 10:55 评论0 收藏0