js中 forEach循环异步任务的执行顺序

forEach中 异步任务的执行顺序.

1. 先看代码

<script>
    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(); // 按顺序执行


</script>

forEach MDN

结论

1. forEach 不会按顺序执行 而是并发执行异步任务
2. for of 和 普通的for循环却能顺序执行异步任务

forEach为什么是并发执行

1. 在 tc39的文档中 第五点 说明 foreach 会用 while循环 判断当前的索引是否小于数组的length,如果小于会一直执行下去不会等待异步任务执行完成.

Repeat, while k < len,
a. Let Pk be ! ToString(𝔽(k)).
b. Let kPresent be ? HasProperty(O, Pk).
c. If kPresent is true, then
i. Let kValue be ? Get(O, Pk).
ii. Perform ? Call(callbackfn, thisArg, « kValue, 𝔽(k), O »).
d. Set k to k + 1.