logo

TechCodeview

JavaScript マップ

map() は、配列要素ごとに関数を呼び出して新しい配列を作成します。空の要素に対して関数を実行したり、元の配列を変更したりすることはありません。 JavaScript Map はキーと値のペアのコレクションであり、効率的なデータの取得と操作を可能にします。

反復すると、マップ オブジェクトは、挿入されたのと同じ順序でキーと値のペアを返します。 Map() コンストラクター JavaScript でマップを作成するために使用されます。



ラテックスの偏導関数

JavaScript 地図 マップのサイズを表すプロパティがあります。

例： 

  Input:  let map1 = new Map([  [1 , 10], [2 , 20] ,  [3, 30],[4, 40]  ]);   console.log('Map1: '); console.log(map1);   Output:  // Map1:  // Map(4) { 1 =>10、2 => 20、3 => 30、4 => 40 }>>

マップを作成する手順



  • 配列を渡すnew Map()>
  • マップを作成して使用するMap.set()>

JavaScript マップの例

新しいマップ()

この中で私たちが使うのは、new Map()>コンストラクタ、

例： この例では、prices>製品名と価格を関連付けて作成することで、価格情報の効率的な検索と管理を可能にします。

// Creating a Map for product prices const prices = new Map([   ['Laptop', 1000],  ['Smartphone', 800],  ['Tablet', 400]  ]);>

Map.set()

要素をマップに追加するには、set()>方法。



警察次長

例： この例では、 Map.set()> という名前のマップに製品価格を追加するためにメソッドが使用されます。prices>。

// Creating a Map for product prices  const prices = new Map();  // Using Map.set() to add product prices   prices.set('Laptop', 1000);   prices.set('Smartphone', 800);  // The Map now contains { 'Laptop' =>1000, 'スマートフォン' => 800 }>>

例 1: この例では、基本的なマップ オブジェクトを作成します。

JavaScript 
let map1 = new Map([  [1, 2],  [2, 3],  [4, 5] ]); console.log('Map1'); console.log(map1); let map2 = new Map([  ['firstname', 'sumit'],  ['lastname', 'ghosh'],  ['website', 'geeksforgeeks'] ]); console.log('Map2'); console.log(map2);>
出力 
Map1 Map(3) { 1 =>2, 2 => 3, 4 => 5 } Map2 Map(3) { '名' => 'スミット', '姓' => 'ゴーシュ', 'ウェブサイト' => 'geeksforgeeks' }>>

例 2: この例では、次を使用してマップに要素を追加します。 セット（） 方法。

JavaScript 
let map1 = new Map(); map1.set('FirstName', 'Shobhit'); map1.set('LastName', 'Sharma'); map1.set('website', 'techcodeview.com'); console.log(map1);>
出力 
Map(3) { 'FirstName' =>'Shobhit', 'LastName' => 'Sharma', 'website' => 'techcodeview.com' }>

例 3: この例では、次のような Map メソッドの使用について説明します。 もっている（） 、 得る（） 、 消去（） 、 そして クリア（） 。

JavaScript 
let map1 = new Map(); map1.set('first name', 'sumit'); map1.set('last name', 'ghosh'); map1.set('website', 'geeksforgeeks')  .set('friend 1','gourav')  .set('friend 2','sourav'); console.log(map1);   console.log('map1 has website ? '+   map1.has('website')); console.log('map1 has friend 3 ? ' +   map1.has('friend 3')); console.log('get value for key website '+  map1.get('website')); console.log('get value for key friend 3 '+  map1.get('friend 3')); console.log('delete element with key website '   + map1.delete('website'));   console.log('map1 has website ? '+   map1.has('website')); console.log('delete element with key website ' +  map1.delete('friend 3')); map1.clear(); console.log(map1);>
出力 
Map(5) { 'first name' =>「スミット」、「姓」 => 「ゴーシュ」、「ウェブサイト」 => 「geeksforgeeks」、「友達 1」 => 「グーラフ」、「友達」 2' => 'sourav' } マップ 1 にはウェブサイトがありますか? true マップ 1 には友人 3 がいますか? false を取得...>>

マップの利点:

地図 提供されたオブジェクト ES6 。マップのキーは 1 回発生する可能性があり、マップのコレクション内で一意になります。オブジェクトではなくマップを使用することには、わずかな利点があります。

  • 誤ったキーとセキュリティ: デフォルトのキーは保存されず、明示的に入力されたもののみが含まれます。そのため、安全に使用できます。
  • キーの種類と順序: キー関数として任意の値を指定でき、任意のオブジェクトを指定できます。そして、その順序はエントリー挿入順で簡単です。
  • サイズ： size プロパティにより、マップを簡単に取得できます。
  • パフォーマンス： 数学に対するあらゆる演算をより簡単に、より良い方法で実行できます。
  • シリアル化と解析: 次を使用して、Map の独自のシリアル化および解析サポートを作成できます。 JSON.stringify() そして JSON.parse() メソッド。

サポートされているブラウザ:

  • グーグルクローム
  • 角
  • Firefox
  • オペラ
  • サファリ