みなさんこんにちは、現役エンジニアのサメハックです
未経験からWebエンジニアに転職し、
正社員として5年働いたのちフリーランスとして独立しました。
JavaScriptの解説シリーズです。
今回はsetTimeoutの使い方について学んでいきましょう！
駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます！
この記事を読むと・・・
- setTimeoutの使い方が理解できる
setTimeoutを使おう！
setTimeoutとは、
指定した時間が経過したあとに一度だけ処理を実行する関数です。
いわゆる遅延実行という処理だよ！
setTimeoutの構文：引数なし
setTimeout(関数名, ミリ秒);関数名の後に（）を付けないのがポイントだよ！
setTimeoutの構文：引数あり
setTimeout(関数名, ミリ秒, 引数1, 引数2 ,....);通常の関数と引数の渡し方が異なるよ！
setTimeoutの構文：コールバック関数
setTimeout(() => {
// 処理
}, ミリ秒);無名関数を渡してスコープ内で好きな処理が作成できるよ！
実際に動かしてみよう！
const greet = (name) => {
console.log("こんにちは、" + name + "だよ！");
};
// 関数 遅延 引数
setTimeout(greet, 1000, "サメハック");
console.log(1);
console.log(2);
console.log(3);
console.log(4);
console.log(5);
実際に動かしてみると、
1秒遅れて「こんにちは、サメハックだよ！」と出力されるのがわかります。
まとめ
- setTimeout関数とは、遅延実行するために使用される
- setIntervalsと違い、1度しか実行されない
- 関数名の後に（）を付けない
- setTimeout(関数名, ミリ秒);
- setTimeout(関数名, ミリ秒, 引数1, 引数2 ,….);
- setTimeout(() => { // 処理 }, ミリ秒);
満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈
