JavaScript の配列操作 | Dropwhile 関数

はじめに

この実験では、JavaScript の dropWhile 関数を調べます。この関数を使うと、指定された条件が満たされなくなるまで、配列から要素を削除できます。この実験が終わると、自分のコードで dropWhile を使って配列をフィルタリングして操作する方法をより深く理解できるようになります。

Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL 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/BasicConceptsGroup -.-> javascript/array_methods("Array Methods") subgraph Lab Skills javascript/variables -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} javascript/data_types -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} javascript/arith_ops -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} javascript/comp_ops -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} javascript/loops -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} javascript/array_methods -.-> lab-28278{{"JavaScript の dropWhile 関数を探る"}} end

関数に基づく配列要素の削除

配列から特定の要素を削除するには、dropWhile 関数を使用します。この関数は、渡された関数が true を返すまで要素を削除します。その後、関数は配列の残りの要素を返します。

動作の仕方は以下の通りです。

Array.prototype.slice() を使って配列をループ処理し、func から返される値が true になるまで配列の最初の要素を削除します。
残りの要素を返します。

使用例：

const dropWhile = (arr, func) => {
  while (arr.length > 0 && !func(arr[0])) arr = arr.slice(1);
  return arr;
};

dropWhile([1, 2, 3, 4], (n) => n >= 3); // [3, 4]

コーディングの練習を始めるには、ターミナル/SSH を開いて node と入力します。

まとめ

おめでとうございます！関数に基づいて左から配列要素を削除する実験を完了しました。技術力を向上させるために、LabEx でさらに多くの実験を行って練習してください。