マンガでわかるJavaScriptのPromise

第6話「Promiseを使ったコード」

今回は「Promise」を使ったコード、その1です。

コード1

 コールバック関数の例です。

ソースコード)コールバック関数の例

setTimeout(function() {
    console.log('完了');
}, 1000);

    

コード2

 「Promise」と「then」の例です。

ソースコード)「Promise」と「then」の例

new Promise(function(resolve) {
    setTimeout(function() {
        console.log('処理1');
        resolve();
    }, 500);
})
.then(function() {
    return new Promise(function(resolve) {
        setTimeout(function() {
            console.log('処理2');
            resolve();
        }, 600);
    });
})
.then(function() {
    return new Promise(function(resolve) {
        setTimeout(function() {
            console.log('処理3');
            resolve();
        }, 700);
    });
})
.then(function() {
    return new Promise(function(resolve) {
        setTimeout(function() {
            console.log('処理4');
            resolve();
        }, 800);
    });
})
.then(function() {
    console.log('終了');
});

    

出力)実行結果

処理1
処理2
処理3
処理4
終了

    

コラム:MDN

 JavaScriptの仕様を確認するにはMDNが便利です。MDNは、『Mozilla Firefox』を出しているMozilla Foundationの、Web開発者用の文書サイトです。HTMLやJavaScript、CSSといったWebの仕様がまとまっています。

リンク)MDN Web Docs

 「Promise」についても情報がまとまっていますので、機会があれば目を通しておくとよいです。


リンク)プロミスの使用 - JavaScript | MDN
作成:2022/07/19  更新:2022/07/19  [Permalink]

クロクロ・ショップ
特殊な技術書多数あります
レトロ風RPG フルスクラッチ開発 全コード
レトロゲーム風RPGの全コードを掲載して解説した本
HTML5とJavaScriptで作る 落ち物パズルゲーム 全コード
『テトリス』や『ぷよぷよ』に類似した落ち物パズルゲームの全コードを掲載して解説した本
JavaScriptでリバーシゲームをつくろう
ライブラリを使わずに全コードを書いて、リバーシゲームを作るまでを徹底解説
ワールドマップ自動生成読本
二次元ゲームのワールドマップを自動生成するための本
レトロゲームファクトリー
過去のゲームを最新機に移植する会社のお仕事小説(新潮社)
顔貌売人 ハッカー探偵 鹿敷堂桂馬
プログラマーが探偵役のエンタメ・ミステリー第2弾 最先端の情報犯罪に安藤と鹿敷堂が挑みます(文藝春秋)
裏切りのプログラム ハッカー探偵 鹿敷堂桂馬
プログラマー鹿敷堂桂馬が、女性社長の安藤裕美と共に、IT業界で起きた事件に挑む。2016年の松本清張賞の最終候補作(文藝春秋)
×