js

forEach, map, for in, for of

2019-06-05  本文已影响0人  书虫和泰迪熊

forEach

  1. 三个参数,第一个value, 第二个 index, 第三个数组体。
  2. 适用于 数组,set,map,不适应于 字符串,Object。
  3. 无法修改和删除集合数据,效率和for循环相同,不用关心集合下标的返回。
  4. 不能终止循环,break,continue不能使用。
    栗子(Array 循环):
let arr = [1, "ding", null, 5, true, undefined];
arr.forEach(function(value, index, a) {
    console.log("value:", value, "index:", index, "a:", a);
})
image.png

栗子(Set, Map 循环):

let obj = {
    name: "dingding",
    age: 20,
    male: false,
    city: "北京"
};
let set = new Set(arr);
let map = new Map();
map.set('obj', obj);
map.set("color", "pink");
set.forEach((item, index, a) => {
    console.log(item, "------", index, "------:", a);
})
console.log('\n');
map.forEach(function(item, index, a){
    console.log(item, "++++++", index, "+++++++", a);
})
image.png

map

forEach()返回值是undefined,不可以链式调用。
map()返回一个新数组,原数组不会改变。

for in

  1. 索引为字符串
  2. 多用于遍历对象,json,数组,无顺序,增加了转换过程所以开销比较大
  3. 可扩展属性(自定义属性)也会遍历
  4. 支持break, continue
  5. 某些情况下,for in 循环会以任意顺序遍历键名
  6. 循环读取键名
    栗子:
for(let item in obj) {
    console.log(item, ":", obj[item]);  
    if(item == "age") delete obj[item];  //删除属性成功
}
console.log("obj:", obj);
image.png

栗子:(可扩展属性也会遍历)

arr.name = "red";
for(let i in arr) {
    console.log(i, ":", arr[i]);
}
console.log("arr", arr)
image.png

for of

  1. ES6新引入的特性,是目前遍历数组最好的方法,可以用在set,map,类数组,字符串上,但是不支持原生的Object遍历
  2. 不会遍历可扩展属性(自定义属性)
  3. 支持break, continue
  4. 循环读取键值
上一篇下一篇

猜你喜欢

热点阅读