一、为什么ES2015 引入 for of 循环
我们先来回想一下,ES2015以前与遍历相关的方法
- for循环:遍历普通的数组
- for in : 遍历键值对
- 一些函数式的遍历方法 ,比如forEach
这些遍历方式都有一定的局限性,比如说forEach() 不能退出循环
// for of 基本语法
const arr = [100,200,300,400]
for(const item of arr){
console.log(item)
if(item > 100){
break // for of 可以用退出循环
}
}
arr.forEach() // 不能退出循环
// 为了能够终止遍历, 需要借用以下方法
arr.some() // return true 终止遍历
arr.every() // return false 终止遍历
ES2015引入了 for of 循环 ,作为遍历所有数据结构的统一方式
二、for of 循环基本使用
数组、伪数组、Set、Map 对象 都可以直接 用for of 遍历
const m = new Map()
m.set('foo',123)
m.set('bar',345)
for(const item of m){
console.log(item)//item 键和值都会拿到 ['foo',123]
}
// 数组解构
for(const [key,value] of m){
console.log(key,value)
}
for of 遍历对象可以吗?
const obj = {name:'jack'}
for(const item of obj){
console.log(item)
}
诶?不是说 for of 循环可以作为遍历所有数据结构的统一方式吗?
为什么遍历对象报错了呢?
三、了解for…of 的内部原理
看下一篇文章: ES2015 Iterable(可迭代的)接口