JavaScript で関数の実行を遅らせる

はじめに

この実験では、指定されたミリ秒数だけ関数の実行を遅らせることができる delay() 関数を調べます。この関数は、コードの実行に一時停止を追加する必要があるシナリオで役立ちます。たとえば、アニメーションを扱っている場合や、タイムセンシティブなタスクを実行している場合です。この実験を通じて、JavaScript コードで delay() 関数を効果的に使用する方法を学びます。

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/ToolsandEnvironmentGroup(["Tools and Environment"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/BasicConceptsGroup -.-> javascript/functions("Functions") javascript/AdvancedConceptsGroup -.-> javascript/async_prog("Asynchronous Programming") javascript/AdvancedConceptsGroup -.-> javascript/closures("Closures") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") javascript/ToolsandEnvironmentGroup -.-> javascript/debugging("Debugging") subgraph Lab Skills javascript/variables -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/data_types -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/arith_ops -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/comp_ops -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/functions -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/async_prog -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/closures -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/spread_rest -.-> lab-28271{{"関数の実行を遅らせる"}} javascript/debugging -.-> lab-28271{{"関数の実行を遅らせる"}} end

JavaScript で関数の実行を遅らせる方法

JavaScript で関数の実行を遅らせるには、setTimeout() メソッドを使用できます。方法は以下の通りです。

ターミナル/SSH を開き、コーディングの練習を始めるために node と入力します。
関数 fn の実行を ms ミリ秒遅らせるには、次の構文を使用します。

const delay = (fn, ms, ...args) => setTimeout(fn, ms, ...args);

関数に引数を渡すには、次のようにスプレッド (...) 演算子を使用します。

delay(
  function (text) {
    console.log(text);
  },
  1000,
  "later"
); // 1 秒後に 'later' をログに出力します。

このコードでは、指定されたミリ秒数 (ms) 後に提供された関数 fn が呼び出されます。...args パラメータを使用することで、任意の数の引数を関数に渡すことができます。

まとめ

おめでとうございます！「関数の実行を遅らせる」実験を完了しました。技術力を向上させるために、LabEx でさらに実験を行って練習してください。