JS-for...in/for...of

一、for...of

1、特性说明

(1)常用于对数组，字符串，Set以及Map等可迭代数据的遍历

(2)可迭代的数据结构的判断方法: typeof obj[Symbol.iterator] === function，true则是

(3)需要注意一下对象不是普通对象不是可迭代的数据结构，不能使用for...of，会报错

let obj={name: 'wuyanzhⅰ'}

console.log(typeof obj[Symbol.iterator] === 'function') // false

2、遍历字符串

let str = 'wuy'
for(let i of str){
  console.log(i)
}

// w
// u
// y

3、遍历数组

let arr = ['wu', 'yan',  'zhi']
for(let item of arr){
  console.log(item)
}

//wu
//yan
//zhi

4、遍历Set

let set = new Set(['red', 'green', 'blue'])
for(let j of set){
  console.log(j)
}
//red
//green
//blue

二、for...in:常用来遍历对象,获取key值

注:也可以用来遍历数组，但遍历数组得到的是索引的集合，意义不大

let arr = {
  name: 'wu',
  name1: 'yan'
}
for(let i of arr){
  console.log(i)
}
//name
//name1

额外补充一些对象的知识点:

let arr = {
  name: 'wu',
  name1: 'y'
}

Object.keys(arr) // ['name', 'name1']

Object.values(arr) // ['wu', 'y']

Object.entries(arr) // [['name', 'wu'], ['name1', 'y']]