オブジェクトの逆転 | プログラミングチュートリアル

はじめに

この実験では、元のオブジェクトを変更することなく、オブジェクトのキーと値のペアを逆にする方法を探ります。オブジェクトを逆にするために、Object.keys() メソッドと Array.prototype.reduce() を使用します。また、逆にしたキーに関数を適用し、逆にした値を生成するためのキーの配列を返す方法を学びます。

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/BasicConceptsGroup -.-> javascript/array_methods("Array Methods") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/AdvancedConceptsGroup -.-> javascript/destr_assign("Destructuring Assignment") subgraph Lab Skills javascript/variables -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/data_types -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/arith_ops -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/comp_ops -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/array_methods -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/higher_funcs -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} javascript/destr_assign -.-> lab-28404{{"オブジェクトのキーと値のペアを逆にする"}} end

オブジェクトを逆にする関数

元のオブジェクトを変更することなく、オブジェクトのキーと値のペアを逆にするには、invertKeyValues 関数を使用します。

ターミナル/SSH で invertKeyValues(obj, fn) と入力することで関数を呼び出します。ここで、obj は逆にするオブジェクトで、fn は逆にしたキーに適用するオプショナルな関数です。
Object.keys() と Array.prototype.reduce() メソッドを使用して、逆にしたキーと値のペアを持つ新しいオブジェクトを作成します。関数が提供されている場合、それは各逆にしたキーに適用されます。
fn を省略した場合、関数は何も適用されずに逆にしたキーのみを返します。
関数は、各逆にした値が逆にした値を生成するためのキーの配列であるオブジェクトを返します。

const invertKeyValues = (obj, fn) =>
  Object.keys(obj).reduce((acc, key) => {
    const val = fn ? fn(obj[key]) : obj[key];
    acc[val] = acc[val] || [];
    acc[val].push(key);
    return acc;
  }, {});

使用例:

invertKeyValues({ a: 1, b: 2, c: 1 }); // { 1: [ 'a', 'c' ], 2: [ 'b' ] }
invertKeyValues({ a: 1, b: 2, c: 1 }, (value) => "group" + value);
// { group1: [ 'a', 'c' ], group2: [ 'b' ] }

まとめ

おめでとうございます！あなたはオブジェクトを逆にする実験を完了しました。あなたの技術を向上させるために、LabExでさらに多くの実験を練習することができます。