for...of迴圈

這個直接看程式碼吧

1.遍歷陣列

        var arr = [1,2,3,4,5];
        
        for(let val of arr.values()){
            console.log(val)
        }
        //1
        //2
        //3
        //4
        //5

2.遍歷索引

        var arr = [1,2,3,4,5];

        for(let index of arr.keys()){
            console.log(index)
        }
    
        //0
        //1
        //2
        //3
        //4
 

3.遍歷值和索引

        var arr = [1,2,3,4,5];

        for(let item of arr.entries()){
            console.log(item)
        }
        //第一個是索引，第二個是值
        // [0, 1]
        // [1, 2]
        // [2, 3]
        // [3, 4]
        // [4, 5]

4.上面的結果看起來和平時看的不一樣，看下面

        var arr = [1,2,3,4,5];

        for(let [key,val] of arr.entries()){
            console.log(key,val)
        }

        // 0 1
        // 1 2
        // 2 3
        // 3 4
        // 4 5
 

在for...of中 

陣列多了三個屬性

arr.values()         //陣列的值

arr.keys()            //陣列的下標

arr.entries()         //陣列的某一項

for...of 和for...in 的區別

for...in語句以任意順序迭代物件的可列舉屬性（可以列舉屬性）

for...of語句迭代可迭代物件定義為迭代的資料(只列舉資料)

        var arr = [1,2,3,4,5];
        //設定陣列，並給陣列的原型上新增屬性
        Array.prototype.name = "Name";


        //for...of方法列印
        for(let val of arr){
            console.log(val)
        }
        // 1，2，3，4，5


        //for...in方法列印
        //1，2，3，4，5，name
        for(let item in arr){
            console.log(arr[item])
        }
 

for...of 的實用案例

arguments是個類陣列物件，通常先要將其轉換為陣列才能遍歷，但for...of可以直接遍歷 

        function sum() {
            let sum = 0
            for (let num of arguments) {
                sum += num
            }
            console.log(sum);        //15
        }

        sum(1, 2, 3, 4, 5)

遍歷字串

let name = 'Asher';

for (let char of name) {

console.log(char); //A s h e r

}