一.for in

for in 可以遍历对象,也可以遍历数组,既可以获得键名/索引,所以借助这个获得键值

代码演示

遍历对象时:

let obj = { a:"1" , b:"2" , c:"3" }
for ( i in obj ) {
    console.log(i)    // a , b , c
    console.log(obj[i])    // 1 , 2 , c
}

遍历数组时:

let list = [ "z" , "2" , "3" ]
for ( i in list ) {
    console.log(i)    // 0 , 1 , 2
    console.log(list[i])    // z , 2 , 3
}

总结:for in 既可以循环对象,也可以循环数组,i是键名/索引值

二.for of

for of 只能遍历具有迭代属性的对象,也就是数组那种,普通的对象是没有可迭代属性的,所以就不能用for of
基础点记忆就是: for of 遍历数组

代码演示:

let list = [ "z" , "2" , "3"]
for ( i of list ) {
    console.log(i)    // z , 2 , 3
}

总结: for of 遍历数组,直接将键值作为i遍历出来

三.综合对比

for in => 遍历对象,数组 i 键名/索引值 -> 借助这个可以获得键值
for of => 遍历数组 i 键值

四.其他

在js中,还有譬如
1.Object.keys(obj) //遍历对象/数组的键名/索引,以数组形式返回
2.Object.values(obj) //遍历对象/数组的键值,以数组形式返回
3.list.map( item => console.log(item) ) //遍历数组的键值,不影响原数组

tips:准确来说,数组其实也是对象,但是在本文中,为了方便区分普通对象和数组,所以分开明确来讲