for/of

ES6添加了一个新的循环语句:for/of

for/of本质是对可迭代对象进行迭代操作
例:
for(let element of data){
    // data.push(sum)  // 这样会创造一个无穷的循环,因为迭代永远不能触及最后一个数组
    sum += element
}
若对象不可迭代,则抛出TypeError
for(let element of o){
    console.log(element) // TypeError: o is not iterable
}
若想迭代对象的属性,应使用for/in,或使用Object.keys()/values()/entries()
for(let k of Object.keys(o)){
    console.log(k)   // 注意:在循环体内修改对象向不会影响迭代的进行
}
字符串是可迭代的
let frequency = {}
for(let i of "mississippi"){
    if(frequency[i]) frequency[i]++
    else frequency[i] = 1
}
console.log(frequency)  // { m: 1, i: 4, s: 4, p: 2 }
Set(集合)与Map(映射)是可迭代的
let newSet = new Set([1, 2, 3, 4, 5, 6])
for(let i of newSet){
    console.log(i)  // 1 2 3 4 5 6
}

let newMap = new Map([["a", 1], ["b", 2], ["c", 3]])
for(let i of newMap){
    console.log(i)  // [ 'a', 1 ] [ 'b', 2 ] [ 'c', 3 ]
}

for/await/of ES2018新增了异步迭代器

从异步可迭代流中读取数据块并打印
async function printStream(stream){
    for await (let i of stream){
        console.log(i);
    }
}

那么这时有一个问题,for/of,for/in,forEach和普通for循环四种for循环,执行异步请求是什么情况呢?

话不多说,上代码:

下述代码执行结果,for/in,for/of和普通for循环都成功阻塞了进程,唯独forEach没有阻塞成功

    let promiseTask = (num) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log(num * num);
                resolve(true);
            }, 1000);
        })
    }

    const task = [1, 2, 3];

    async function DoTaskByForEach() {
        await task.forEach((g) => {
            promiseTask(g);
        });
    }

    // DoTaskByForEach(); // 并发执行

    async function DoTaskByForLength() {
        for (let i = 0; i < task.length; i++) {
            await promiseTask(task[i]);
        }
    }

    // DoTaskByForLength(); // 按顺序执行

    async function DoTaskByForOf() {
        for (let item of task) {
            await promiseTask(item);
        }
    }

    DoTaskByForOf(); // 按顺序执行
    async function DoTaskByForIn() {
        for (item in task) {
            await promiseTask(item);
        }
    }

    DoTaskByForIn(); // 按顺序执行
 

 

 

posted @ 2021-12-06 20:52  邢韬  阅读(48)  评论(0编辑  收藏  举报