JavaScript
setTimeout

setTimeoutにおける0ミリ秒後とは


JavascriptにおけるsetTimeoutとは


  • nミリ秒後に何かを実行したい場合に使う関数

  • 下記の例だと、コンソールにnowと出力した1000ミリ秒=1秒後に1 sec. laterと出力される


whatIsSetTimeout.js

function hoge() {

console.log('now');
setTimeout(function () {
console.log('1 sec. later');
}, 1000);
}

hoge();

// now
// 1 sec. later # 1秒後



使い方

setTimeout(callback, delay)

引数
説明

callback
実行したい関数

delay
何ミリ秒後に実行するか (初期値は0)


利用シーン

一連の処理の直後に何かを実行したい場合


sample.js


function fuga() {

console.log('process1');
console.log('process2');

setTimeout(function () {
console.log('setTimeout process');
});

console.log('process3')

}

fuga();


setTimeoutの第2引数を指定しなかったので0が代入され、

この関数は下記のような順序で処理される


result

process1

process2
process3
setTimeout process


「0ミリ秒後ってなんだよ」問題


実験その1

setTimeoutの引数に0, 1, 2を与え、それぞれ同じ関数内で実行してみる


test1.js

setTimeout(()=>console.log(0), 0);

setTimeout(()=>console.log(1), 1);
setTimeout(()=>console.log(2), 2);


result1

0

1
2

結果はなんとなく想定通りだが、0秒と1秒を指定したときの違いが分からないので次の実験に移る。


実験その2

実験その1から記述の順番を逆転させてみる


test2.js

setTimeout(()=>console.log(2), 2);

setTimeout(()=>console.log(1), 1);
setTimeout(()=>console.log(0), 0);


result2

1

0
2

え、、、10より先に来るのか・・・


結論

この他にもいろいろ試したが、

setTimeoutの第2引数に0を与えるのと1を与えるのは同じであることが判明した。

同じなので、単純に記述した順に実行される。

その他にも少数(0以上1以下)・マイナスなどで試したが、1以下の数値を指定しても同じ結果となった


心の声

(だったら初期値も1で良くね?)