マンガでわかるJavaScriptのPromise

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

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

コード1

 「time」「text」を引数にした「timer()」関数です。

ソースコード)引数付きの「timer()」関数

const timer = function(time, text) {
    return new Promise(function(resolve) {
        setTimeout(function() {
            console.log(text);
            resolve();
        }, time);
    });
};

    

コード2

 先ほどの関数を、アロー関数で短く書き、実際に使用します。

ソースコード)短く書いて実際に利用

const timer = (time, text) => new Promise(resolve => {
    setTimeout(() => {
        console.log(text);
        resolve();
    }, time);
});

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

    

コード3

 「Promise」を利用した処理を、アロー関数で短く書き、さらに短く記述します。

ソースコード)さらに短く書いて実際に利用

const timer = (time, text) => new Promise(resolve => {
    setTimeout(() => {
        console.log(text);
        resolve();
    }, time);
});

timer(500, '処理1')
.then(() => timer(600, '処理2'))
.then(() => timer(700, '処理3'))
.then(() => timer(800, '処理4'))
.then(() => console.log('終了'));

    

出力)実行結果

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

    
作成:2022/07/20  更新:2022/07/20  [Permalink]

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