日付範囲生成器：JavaScript での簡単な日付操作

はじめに

この実験では、JavaScript を使って日付範囲生成器を作成する方法を検討します。この生成器を使うと、指定された範囲内のすべての日付を、与えられたステップで簡単に生成できます。Date コンストラクタと yield キーワードを使うことで、日付を効率的に反復処理してユーザーに返すことができます。この実験は、JavaScript でループと日付を扱う練習の良い機会になります。

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL 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/loops("Loops") javascript/AdvancedConceptsGroup -.-> javascript/spread_rest("Spread and Rest Operators") subgraph Lab Skills javascript/variables -.-> lab-28248{{"日付範囲生成器"}} javascript/data_types -.-> lab-28248{{"日付範囲生成器"}} javascript/arith_ops -.-> lab-28248{{"日付範囲生成器"}} javascript/comp_ops -.-> lab-28248{{"日付範囲生成器"}} javascript/loops -.-> lab-28248{{"日付範囲生成器"}} javascript/spread_rest -.-> lab-28248{{"日付範囲生成器"}} end

日付範囲生成器

与えられたステップで、指定された範囲内のすべての日付を生成するには、ターミナル/SSH で次のコードを入力して node を実行します。

const dateRangeGenerator = function* (start, end, step = 1) {
  let d = start;
  while (d < end) {
    yield new Date(d);
    d.setDate(d.getDate() + step);
  }
};

これは、while ループを使って start から end まで反復処理する生成器を作成します。Date コンストラクタを使って範囲内の各日付を返し、Date.prototype.getDate() と Date.prototype.setDate() を使って step 日だけ増やします。

step の既定値を 1 にするには、3 番目の引数を省略します。

dateRangeGenerator を使う方法の例を次に示します。

[...dateRangeGenerator(new Date("2021-06-01"), new Date("2021-06-04"))];
// [ 2021-06-01, 2021-06-02, 2021-06-03 ]

まとめ

おめでとうございます！日付範囲生成器の実験を完了しました。技術力を向上させるために、LabEx でさらに多くの実験を行って練習してください。