2 つに配列を分割する

JavaScriptJavaScriptBeginner
今すぐ練習

This tutorial is from open-source community. Access the source code

💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください

はじめに

この実験では、JavaScriptを使って、与えられた関数の各要素に対する真偽値に基づいて配列を2つの別々の配列に分割する方法を探ります。Array.prototype.reduce() メソッドを使って2つの配列を作成し、Array.prototype.push() メソッドを使って、与えられた関数の真偽値に基づいて適切な配列に要素を追加します。この実験が終わるとき、JavaScriptで配列を分割する方法を十分に理解し、この知識を将来のプロジェクトで活用できるようになります。


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced 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/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") subgraph Lab Skills javascript/variables -.-> lab-28540{{"2 つに配列を分割する"}} javascript/data_types -.-> lab-28540{{"2 つに配列を分割する"}} javascript/arith_ops -.-> lab-28540{{"2 つに配列を分割する"}} javascript/comp_ops -.-> lab-28540{{"2 つに配列を分割する"}} javascript/higher_funcs -.-> lab-28540{{"2 つに配列を分割する"}} javascript/destr_assign -.-> lab-28540{{"2 つに配列を分割する"}} end

関数に基づいて配列を2つに分割する方法

与えられた関数に基づいて配列を2つに分割するには、次の手順に従います。

  1. ターミナル/SSHを開き、コーディングを練習するために node と入力します。
  2. Array.prototype.reduce() を使って2つの配列の配列を作成します。
  3. Array.prototype.push() を使って、fntrue を返す要素を最初の配列に追加し、fnfalse を返す要素を2番目の配列に追加します。

使用できるコードは次のとおりです。

const partition = (arr, fn) =>
  arr.reduce(
    (acc, val, i, arr) => {
      acc[fn(val, i, arr) ? 0 : 1].push(val);
      return acc;
    },
    [[], []]
  );

このコードをテストするには、次の例を使用できます。

const users = [
  { user: "barney", age: 36, active: false },
  { user: "fred", age: 40, active: true }
];
partition(users, (o) => o.active);
// [
//   [{ user: 'fred', age: 40, active: true }],
//   [{ user: 'barney', age: 36, active: false }]
// ]

これにより、2つの配列の配列が返されます。最初の配列には、与えられた関数が true を返すすべての要素が含まれ、2番目の配列には、与えられた関数が false を返すすべての要素が含まれます。

まとめ

おめでとうございます!2つに配列を分割する実験を完了しました。スキルを向上させるために、LabExでさらに実験を練習できます。