マンガでわかるJavaScriptのPromise

# 1p 1) ミア： 前回は 長ったらしい コードだった わよね [ミア] 2) モフオ： ごめんね 今回は 短くしていくよ まずは Ｐｒｏｍｉｓｅ オブジェクトを返す 関数を作るよ 「一定時間待って 終了する関数」 を登録したもの だよ [モフオ] ----- 3) const timer = function(time, text) { const promise = new Promise(function(resolve) { setTimeout(function() { console.log(text); resolve(); }, time); }); return promise; }; ----- 4) ミア： いきなり複雑そう なんだけど… 5) モフオ： そうだね 少しずつ分解して 説明するよ

# 2p 1) （コードの一部に色を塗り、矢印を引いて指し示す） まず この ｔｉｍｅｒ関数の 引数と戻り値を 示すよ 引数「待機時間」「出力文字列」 const timer = function(time, text) { return promise; }; 戻り値「Promiseオブジェクト」 ----- 2) （コードの一部に色を塗り、矢印を引いて指し示す） Ｐｒｏｍｉｓｅには ｓｅｔＴｉｍｅｏｕｔ を実行する関数を 登録している const promise = new Promise(function(resolve) { setTimeout(function() { }, time); }); ----- 3) （コードの一部に色を塗り、矢印を引いて指し示す） ｓｅｔ Ｔｉｍｅｏｕｔでは 待機時間ｔｉｍｅ が経過したら 処理を実行する setTimeout(function() { }, time); 4) （コードの一部に色を塗り、矢印を引いて指し示す） 処理の内容は 文字列ｔｅｘｔを 出力して ｒｅｓｏｌｖｅを 実行することだよ console.log(text); resolve();

# 3p 1) モフオ： 処理の内容を まとめるね 2) 引数：待機時間「time」、出力文字列「text」 処理：Promiseオブジェクト「promise」を作成 登録する処理 「setTimeout()」を実行 「time」の時間が経ったら 「text」を出力して 「resoleve()」を実行 戻り値：Promiseオブジェクト「promise」 ----- 3) ミア： 分かったような 分からないような そもそもコードが 長いのよね 4) モフオ： それは 僕も認めるよ 少し短く書いて みるね