このサイトにはプロモーションが含まれます

[TS/JS]MapとSetについて

MapとSetについて

Map と Set は、JavaScriptやTypeScriptにおけるデータ構造の異なるオブジェクトです。

Map 連想配列のようなKeyとValueを持つ構造
Set 重複を認めない一意なデータを保持

やんやん

プログラマーとしてLEMP環境に主に生息しており、DevOps 的な立ち回りをしながらご飯を食べている当ブログの管理人のやんやんと申します。
最近はTmux使うのを辞めました。

 

データの格納方法

Map

Map はキーと値のペアを格納するデータ構造です。各要素はキーと値の組み合わせで構成され、キーは一意でなければなりません。キーは任意のデータ型で指定できます。

// Mapの使用例 
const myMap = new Map(); 
// キーと値の追加 
myMap.set("key1", "value1"); 
myMap.set("key2", "value2");

Set

Set は一意の値の集合を格納するデータ構造です。重複する値を持たず、順序を保持しません。各要素は一意であり、重複した値を持つことはありません。要素は任意のデータ型で指定できます。

// Setの使用例 
const mySet = new Set(); 

// 値の追加 
mySet.add("value1"); 
mySet.add("value2"); 
mySet.add("value3"); 
mySet.add("value2"); // 重複した値は追加されません

要素へのアクセス方法

Map

Map はキーと値のペアを持つため、キーを使用して要素にアクセスします。get() メソッドを使用してキーに対応する値を取得できます。

//単一の取得
map.get(key)

//一括
myMap.forEach((value, key) => {
  console.log(key, value);
});

 

Set

Set は単一の値の集合を持つため、値自体を使用して要素にアクセスします。

または、配列に変換して要素にアクセスすることも可能っちゃ可能です。↓
Setを配列に変換する
ただ、せっかくSetで値を用意しているのに配列に変換してっていうのは野暮な感じがしますね。笑

順序の保持

Map

Map は要素の追加順序を保持します。要素を追加した順番にイテレーションが行われます。

Set

Set は要素の追加順序を保持しません。要素を追加した順番にアクセスすることはできません。

サイズの取得

Map/Set

どちらもsize プロパティを使用して要素数を取得できます。

// マップのサイズ取得 
console.log(myMap.size); // 1
// セットのサイズ取得 
console.log(mySet.size); // 3

重複の取り扱い

Map

Map はキーが一意であるため、同じキーで要素を追加すると、後続の値で上書きされます。

Set

Set は重複した値を持たないため、同じ値を複数回追加しても、最初の1つしか保持しません。

Twitterでフォローしよう

読んでみーな
おすすめの記事