BLOG

非同期処理メモ⑦(raceとallSettled)

おはようございます。

最近彼女が飲んでて自分も欲しくなって買った、美酢(ミチョって読む)っていう飲むお酢を飲みながら執筆なうなどうもハヤトワンです。

ミチョって覚えるのに数日かかりました

ミチョミチョ

はい、あいも変わらず今日も非同期処理について。

こうして毎日ちょっとの時間でも1つの概念をブログに綴るなりして体に染み込ませようという作戦でございます。

非同期処理メモ⑥

昨日の続きで、昨日はPromise.allについてやりましたが、

今日はPromiseのraceとallSettledについてメモっていきます。

raceとは

Promiseのraceとは配列の中に渡されたpromiseのどれかひとつが完了した時点で次のthenメソッドに処理が移行する。

function sleep(val) {
  return new Promise(function(resolve) {
    setTimeout(function() {
      console.log(val++);
      resolve(val);
    }, val * 500);
  });
}

Promise.race([sleep(2),sleep(3),sleep(4)])
.then(function (data){
  console.log(data);
});

コンソール

2
3
3
4

この場合だと、[sleep(2)]が1番目に完了するので、sleepの2が完了した時点でdataにはsleepの2が渡してくるresolveの値が入ってくることになる。

すると、2で引数を渡しているのでconsole(val++)のval++でプラス1されてresolve(val)で3という値が渡されてくる為、コンソールには3が2つ渡ってくることとなる。

allSettledについて

次にallSettled

function sleep(val) {
  return new Promise(function(resolve) {
    setTimeout(function() {
      console.log(val++);
      resolve(val);
    }, val * 500);
  });
}

Promise.allSettled([sleep(2),sleep(3),sleep(4)])
.then(function (data){
  console.log(data);
});

コンソール

2
3
4
(3) [{...},{...},{...}]
↑先頭を展開すると
0:
status: "fulfilled"
value: 3
....

allSettledの場合は、展開したオブジェクトの中のvalueに3,statusにfulfilledが入っている。

fulfilledはresolveが呼ばれたタイミングではpromiseのstatusになるが、rejectが呼ばれるとfulfilledがrejectに変わる。

このように全ての非同期処理が完了するのを待つが、完了した非同期処理が成功したか失敗したか分からないというのがallSettledになる。

allとの違い

allの場合、rejectが呼ばれるとcatchの方に処理が移るが、allSettledはcatchに処理が移行しない。

これは比較的新しいメソッドなのでブラウザが対応しているかチェックする必要がある。

これらがPromiseを使った並列処理になる。

という感じでした。

なるほど、そういう動き方なのね。っていうのはなんとなく分かってきた。

ということで時間になりましたので続きはまた明日。

今日も良い1日を!