html
1<!DOCTYPE html> 2<html lang="ja"> 3 4<head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7</head> 8 9<body> 10 <button>sleep</button> 11 <script src="main.js"></script> 12</body> 13 14</html>
js
1// 引数で渡された時間 (ミリ秒) ループする 2const sleep = (ms) => { 3 const sleepStartTime = new Date(); 4 while (new Date() - sleepStartTime < ms) { } 5}; 6 7// ボタンがクリックされたとき、4000ミリ秒待機する 8const click = () => { 9 sleep(4000); 10}; 11 12const button = document.querySelector("button"); 13button.addEventListener("click", click); 14 15const startTime = new Date(); 16setTimeout(() => console.log(new Date() - startTime), 2000);
リロード直後にボタンを押したとき、コンソールには4000前半の数字が出力されます。
このコードを書いたとき、
200ミリ秒でボタンを押す → 4000ミリ秒待機 → 残りの1800ミリ秒待機 → 6000が出力
となるのではないかと思っていました。これはsetTimeoutの仕様が原因ですか?
![guest](/img/icon/icnUserSample.jpg)
回答4件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2024/07/05 05:55