非同期タスクを順番に実行
13567 ワード
非同期タスクは、同期順に実行する必要がある場合があります.
上記のコード
Promise.all
では、アレイ内の非同期タスクをアレイ順に実行できますが、実行の完了を待たずに実行できます.const list = [1, 2, 3, 4, 5];
function sleep(value) {
return new Promise(resolve => {
console.log(`실행순서 : ${value}`);
setTimeout(() => {
console.log(`결과 : ${value}`);
resolve();
}, (list.length - value) * 500);
});
}
console.time('시간');
Promise.all(
list.map((item) => sleep(item))
).then(() => {
console.timeEnd('시간');
});
上記のコードを実行すると、次の結果が得られます.私たちは1つのタスクが完了した後に次のタスクを実行することを望んでいます.そのため、promise.all
は要求に合致しません.실행순서 : 1
실행순서 : 2
실행순서 : 3
실행순서 : 4
실행순서 : 5
결과 : 5
결과 : 4
결과 : 3
결과 : 2
결과 : 1
非同期動作が完了すると、then
を使用して非同期動作を再処理することができる.sleep(list[0])
.then(() => {
return sleep(list[1]);
})
.then(() => {
return sleep(list[2]);
})
.then(() => {
return sleep(list[3]);
})
.then(() => {
return sleep(list[4]);
})
上記のコードを実行すると、前の非同期操作が完了すると、次の非同期操作が実行されます.上記のコード
reduce
を用いて、コードをより簡潔に記述することができる.const list = [1, 2, 3, 4, 5];
function sleep(value) {
return new Promise(resolve => {
setTimeout(() => {
console.log(value);
resolve();
}, (list.length - value) * 500);
});
}
console.time('시간');
list.reduce((promise, item) => {
return promise.then(() => sleep(item));
}, Promise.resolve())
.then(() => {
console.timeEnd('시간');
});
Reference
この問題について(非同期タスクを順番に実行), 我々は、より多くの情報をここで見つけました https://velog.io/@suld2495/비동기-작업을-순차대로-실행시키기テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol