for…in和for...of用法及区别

for…in和for…of

for...in 语句以任意顺序迭代一个对象的除Symbol以外的可枚举属性，包括继承的可枚举属性。

for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句

• for... of 不能循环遍历普通的对象（非可迭代的）

• 两个语法相同：iterable:可迭代对象

for (variable of iterable) {
    //code
}

• for… in 和 for…of 的区别

  • for... in语句用于循环对象属性, 为字符串类型;

    是为遍历对象属性而构建的，不建议与数组一起使用，数组可以用forEach()

  • for... of 语句用于循环遍历对象属性的值

    对于for...of的循环，可以由 break, throw 或 return 终止。

let arr = [1,2,3,4]
for(let i in arr ){//i为变量
    console.log(i);  //i是字符串类型的索引数字
    console.log(arr[i])	//1,2,3,4
}
for(let i of arr){
    console.log(i);  //i是值: 1,2,3,4
}

-------
let obj = {
    name:'zs',
    age: 6
}
for(let k in obj){ //for...of会报错
    console.log(obj.k) //undefined
    console.log(k)  // name age  是字符串类型的键名
    //console.log(k[0~3]);//n-a-m-e
    console.log(obj[k]) //zs 6
}

------
for(var i =0;i<arr.length;i++){
    console.log(i);  //i是数字类型索引
}