- JavaScript でオブジェクトのマップ関数を作成する方法
- Map 関数を作成して属性を表示する
- JavaScript で map.set() を使用してマップ関数を作成し、値を割り当てる
- JavaScript の Object.entries() メソッド
JavaScript でオブジェクトのマップ関数を作成する方法は?
JavaScript は、キーと値のペアで機能するオブジェクト用の map() メソッドを提供します。キー値を利用して、オブジェクトに対してさまざまな操作を実行するのに役立ちます。オブジェクトの要素を反復処理することで、array.map() メソッドと同様に機能します。オブジェクトの map 関数を考えると、構文は次のように記述されます。
構文
地図 ( 関数 ( 要素、インデックス )
この構文では、 関数 を繰り返します エレメント を通って 索引 価値。
ノート : ザ・ 地図（） メソッドは新しいオブジェクトを作成しませんが、インデックス値を使用して既存のオブジェクトを変更します。
例 1: マップ関数を作成して属性を表示する
例は、マップ関数を作成し、属性に異なる値を割り当てるように適合されています。 map() メソッドは、オブジェクトのすべての属性を繰り返します。最後に、すべての属性とその値をコンソール ウィンドウに表示します。次のコードは次のように実行されます。
コード
コンソール。 ログ ( 「オブジェクトのマップ関数を作成する」 ) ;Let Stud_Obj = {
「Math_Marks」 : 80 、
'English_Marks' : 77 、
「物理_マーク」 : 90 } ;
物体 . キー ( Stud_Obj ) . 地図 ( 関数 ( キー、値 ) {
} ) ;
コンソール。 ログ ( Stud_Obj ) ;
このコードでは:
- という名前のオブジェクトが作成されます。 「スタッドオブジェクト」 を含むさまざまな属性を持っています。 「Math_Marks」、「English_Marks」 と 「Physics_Marks」。
- これらの属性には、さまざまな 「80、77、90」 コロンによって割り当てられた値。
- その後、 Object.keys オブジェクトの属性を返すために利用されます 「スタッド オブジェクト」。
- 地図（） キーと値のペアを介して、オブジェクトに存在するすべての属性の関数呼び出し。
- 結局、 console.log() メソッドを使用してオブジェクトを表示します 「スタッドオブジェクト」 コンソール ウィンドウで。
出力
出力はすべての属性を返します 「Math_Marks」、「English_Marks」 と 「物理_マーク」 コンソール ウィンドウに割り当てられた値が表示されます。
例 2: マップ関数を作成して値を割り当てる
を利用して新しいマップ オブジェクトを作成する例を使用します。 新着 キーワード。その後、 map.set() メソッドは、JavaScript コードで属性を割り当てるために使用されます。
コード
コンソール。 ログ ( 「オブジェクトのマップ関数を作成する」 ) ;マップさせて = 新着 地図 ( ) ;
地図。 設定 ( 'Harry_id' 、04 ) ;
地図。 設定 ( 'ピーター_id' 、08 ) ;
地図。 設定 ( 'ジョン_id' 、07 ) ;
let obj_ids = 配列 . から ( 地図 ) . 減らす ( ( obj_ids、 [ キー、値 ] ) => (
物体 . 割当 ( obj_ids、 { [ 鍵 ] : 価値 } )
) 、 { } ) ;
コンソール。 ログ ( obj_ids ) ;
コードの説明は次のとおりです。
- あ 地図 オブジェクトは 新着 オブジェクトの属性を反復するキーワード。
- その後、 map.set() メソッドは、属性を割り当てることによって利用されます 「Harry_id」 、 「ピーターID」 と 「ジョン_id」。
- これらの属性には、次のような一意の値があります。 「04」、「08」、 と 「07」 それぞれ。
- さらに、 配列.from() メソッドは、 地図 物体。
- その後、 減らす（） メソッドは obj_ids すべての属性を抽出します 値 .
- の Object.assign() メソッドは、特定の値を各属性に設定します キー .
- 最後に、 console.log() メソッドは、のすべての属性を提示します 物体 通過することによって 「obj_id」 .
出力
例 3: JavaScript の Object.entries() メソッド
JavaScript は、 Object.entries() メソッドに基づいて、オブジェクトのすべての属性を返します キー値 ペア。を考慮することにより、 Object.entries() メソッドの場合、コードは次のように記述されます。
コード
コンソール。 ログ ( 「オブジェクトのマップ関数を作成する」 ) ;定数 スポーツオブジェクト = {
最初 : 'クリケット' 、
2番目 : 'フットボール' 、
三番 : 'ホッケー' 、
}
定数 メートル = 新しい地図 ( 物体 . エントリ ( スポーツオブジェクト ) ) ;
コンソール。 ログ ( メートル ) ;
コードの説明は次のとおりです。
- まずはオブジェ 「スポーツオブジェクト」 異なる属性を含むように作成されます 「第一」「第二」 と '三番'。
- これらの属性は、次のように異なる値を持ちます。 「クリケット」、「サッカー」 と 'ホッケー'。
- その後、 Object.entries() メソッドがオブジェクトを受け入れる 「スポーツオブジェクト」 すべての属性を返し、それらを変数に格納します 「ム」。
- 最後に、 console.log() メソッドを使用して、オブジェクトの属性のリストをコンソール ウィンドウに表示します。
出力
出力では、属性の数が「3」と表示され、すべての属性と値がコンソール ウィンドウに表示されます。
結論
JavaScript は 地図（） オブジェクトのプロパティと対話するマップ関数を作成するメソッド。キー値を利用して、オブジェクトのすべての属性を反復処理します。加えて map.set() メソッドを使用して、オブジェクトの属性を割り当てます。さらに、 Object.entries() メソッドは、JavaScript でマップ関数を作成した後、オブジェクトのすべての属性を返します。この記事では、オブジェクトのマップ関数の作成について説明し、オブジェクトのすべての属性をコンソール ウィンドウに表示します。