for in,for of,for each in ,forEach使用笔记
2018-01-31 18:15
573 查看
1. for each in
该方法已经不被推荐使用,所以,尽量避免使用该方法。同时,该方法只能用于objecy,不能用于数组。var sum = 0; var obj = {prop1: 5, prop2: 13, prop3: 8}; for each (var item in obj) { sum += item; } console.log(sum); //26
2. forEach
从JavaScript5起,我们开始可以使用内置的forEach方法,可以为数组中的每个元素调用定义的回调函数,但是该方法只能用于数组的遍历,同时无法使用 break 语句和 return 语句中断循环。var arr=[1,2,3] arr.forEach(function (value) { console.log(value); }); // 1 // 2 // 3
3. for in
for (variable in [object | array]) { statements } variable 必需。一个变量,可以是 object 的任何属性名或 array 的任何元素索引。 object, array 可选。要对其进行循环的对象或数组。 statements 可选。要为 object 的每个属性或 array 的每个元素执行的一个或多个语句。
var obj={a:1,b:2} for(var key in obj){ console.log(key,obj[key]) } // a 1 // b 2 var arr=[1,2,3] for(var index in arr){ console.log(index,obj[index]) } // 0 1 // 1 2 // 2 3
使用 for in 循环遍历对象的属性时,原型链上的所有属性都将被访问:
Object.prototype.bar = 10;// 修改Object.prototype var obj={"name":"wjl","age":26};//定义一个object对象 var keys=[];//定义一个数组用来接受key var values=[];//定义一个数组用来接受value for(var key in obj){ keys.push(key); values.push(obj[key]);//取得value } console.log("keys is :"+keys+" and values is :"+values); //keys is : name,age,bar and values is : wjy,26,10
4. for of
对从可迭代对象中获取的迭代器的每个值执行一个或多个语句。普通对象{a:1,b:2,c:3} 无法使用for of)for (variable of object) { statements } variable 必需。可为 object 的任何属性值的变量。 object 必需。 Array、Map、Set 等可迭代对象或实现 迭代器接口的对象。 statements 可选。要为 object 的每个值执行的一个或多个语句。可以是复合语句。
在数组上使用
let arr = [ "fred", "tom", "bob" ]; for (let i of arr) { console.log(i); }
在Map对象上使用
var m = new Map(); m.set(1, "black"); m.set(2, "red"); for (var n of m) { console.log(n); } // Output: // 1,black // 2,red
在Set对象上使用
var set=new Set([1, 2, 3, 4, 5]); for (var s of set) { console.log(s) } // 1 2 3 4 5
另外,普通对象无法使用for of 进行循环,但是可以通过Object.entries(obj)返回给定对象自身可枚举属性的键值对数组。
var obj={a:1,b:2} var arr=Object.entries(obj) //[["a", 1],["b", 2]] for(var i of Object.entries(obj)){ console.log(i) } // ["a", 1] // ["b", 2]
相关文章推荐
- js中关于for循环、for in、foreach、for each in
- 从数据结构的角度分析 for each in 比 for in 快的多
- as3中for in 和 for each in的区别
- js中for in 和 for each in的用法和区别
- 如何使用th:each属性迭代模板-原标题:How To Use th:each For Iteration In Thymeleaf Template?
- js笔记一:js中forEach,for in,for of循环的用法
- C# Parallel之for,foreach使用(笔记)
- Flex中的 for in 与 for each in
- js中foreach,for in,for of的使用及区别,遍历对象,遍历数组使用的不一样 JavaScript
- [Effective JavaScript 笔记]第49条:数组迭代要优先使用for循环而不是for...in循环
- Flex中的 for in 与 for each in
- JavaScript 循环 for,for in,forEach ,for of 知识点整理
- js中for in 和 for each in的用法和区别
- 浅谈javascript中for in 和 for each in的区别
- 使用for...of 优点,代替for...in,forEach和for循环
- js中for in 和 for each in的使用
- 对于for in 与for each in 的注意事项
- 从数据结构的角度分析 for each in 比 for in 快的多
- 浅谈AS3 中的for,for in ,for each in的效率问题
- 全面解析JS中的for ,for in, forEach, for of