非同期処理⑬(asyncとawait続き)

公開日 2020/11/27

おはようございます。

今日の9時からamazonのブラックフライデー&サイバーマンデーセールなので自己投資と謳って攻めちぎってやろうと思っていますどうもハヤトワンです。

(ちゃんと厳選します笑)

ということで今日もasyncとawaitの続きφ(..)メモメモ

asyncをつけた関数はPromiseのインスタンスを返すので、initをconsole.log(init())で見てみると、Promiseのインスタンスが返ってきていることがわかる。

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

async function init() {
  let val = await sleep(0);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
 console.log(val)
}
console.log(init())

コンソール

Promise {<pending>}__proto__: Promise[[PromiseState]]: "fulfilled"[[PromiseResult]]: undefined
0
1
2
3
4
5

init()を実行すると、Promiseが返されることが分かったので、thenメソッドをつないで書くこともできる。

initの戻り値にvalを設定するとthenメソッドの引数にvalが渡ってくる。

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

async function init() {
  let val = await sleep(0);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
  return val;
}
init().then(function(val){
  console.log(`hello ${val}`)
});

コンソール

0
1
2
3
4
hello 5

となる。

　そしてこの関数の中でthrowが呼ばれた場合はこうなる。

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

async function init() {
  let val = await sleep(0);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
  val = await sleep(val);
  throw new Error();
  return val;
}
init().then(function(val){
  console.log(`hello ${val}`)
}).catch(function(e) {
  console.error(e);
});

コンソール

0
1
2
3
4
Error at init

initのcatchに処理が移るのでエラー処理を書く。

これが基本的なasyncとawaitの使い方になる。

内部的にはPromiseと同じ挙動をとる。

なので、awaitで受けれるのはPromiseのインスタンスだし、asyncが返すものはPromiseになる。

ということで今日はここまで。

今日も良い１日を！

BLOG

非同期処理⑬(asyncとawait続き)

Related posts