javascript約束setTimeout

Question

私は現在、ウェブサイトのスロットマシンエフェクトに取り組んでいます。私は、setTimeout（）で何回も呼び出す関数を使用します。私は減速する効果が必要なので、単純なループではなくsetTimeout（）を使用します。これはミリ秒が便利な場所です。この後、私は別のパラメータで同じ機能を起動したい。だから私は最初の "ループ"が完了したときを知る必要があります。私はその約束を試みた。成功なし。

問題を単純化するために、以下のコードが.then（）メソッドを起動しない理由を誰かに教えてください。私はこのすべてのプログラミングには新しく、これは私の最初の質問です。私はここで明らかに間違いがないことを願っています。

あなたは単純にそうように、再帰呼び出しの後に約束を解決する必要があり

function countDown(i) { 
    return promise = new Promise((resolve, reject) => { 

    console.log(i--); 

    if (i > 0) { 
     setTimeout(() => { 
     countDown(i); 
     }, 1000); 
    } else { 
     resolve('counter finished:'); 
    } 

    }); 

} 

let counter = countDown(10); 
counter.then((msg) => { 
    console.log(msg); 
}); 

Answer 1

：

function countDown(i) { 
 
    return promise = new Promise((resolve, reject) => { 
 

 
    console.log(i--); 
 

 
    if (i > 0) { 
 
     setTimeout(() => { 
 
     countDown(i).then(resolve); 
 
     }, 1000); 
 
    } else { 
 
     resolve('counter finished:'); 
 
    } 
 

 
    }); 
 

 
} 
 

 
let counter = countDown(10); 
 
counter.then((msg) => { 
 
    console.log(msg); 
 
});

Answer 2

あなたがここにあなたの例は、async/awaitを使用してに見たいと思うかもしれませんこれを使って

古いブラウザをターゲットにする必要がある場合は、Babel/Typescriptなどを使用することもできますが、最新のブラウザでは既にこれをサポートしています。

function sleep(ms) { return new Promise((resolve) => setTimeout(resolve, ms)) } 
 

 
async function countDown(i) { 
 
    while (i > 0) { 
 
    console.log(i--); 
 
    await sleep(1000); 
 
    } 
 
    return "counter finished:"; 
 
} 
 

 
let counter = countDown(10); 
 
counter.then((msg) => { 
 
    console.log(msg); 
 
});