JavaScript の Map

JavaScript の Map とは

JavaScript の Map クラスは、キー・値 (バリュー) ペアとして使います。

これまでは、オブジェクトのアトリビュートなどがキー・バリューペアとして使われることが多かったのですが、 Map が JavaScript に追加されることによってキー・バリューペアをより便利に使えるようになりました。

JavaScript の Map オブジェクトの作成

JavaScript の Map オブジェクトは new Map() として作成します。

let m = new Map()
m.set('CA', 'California')
m.set('TX', 'Texas')
m.set('HI', 'Hawaii')
console.log(m)
// Map { 'CA' => 'California', 'TX' => 'Texas', 'HI' => 'Hawaii' }

この例では CA というキーに対して、 California という値、 TX というキーに対して、 Texas という値などが設定されています。

キーと値のペアの初期値を渡して Map オブジェクトを作成するには、次の例のように、配列の配列の形でキーと値のペアを渡します。

let m = new Map([
  ['CA', 'California'],
  ['TX', 'Texas'],
  ['HI', 'Hawaii'],
])
console.log(m)
// Map { 'CA' => 'California', 'TX' => 'Texas', 'HI' => 'Hawaii' }

Map のコンストラクタに Map オブジェクトを渡すことで、 Map オブジェクトのクローンを作成できます。

let m = new Map([
  ['CA', 'California'],
  ['TX', 'Texas'],
  ['HI', 'Hawaii'],
])
let m2 = new Map(m)
console.log(m2)
// Map { 'CA' => 'California', 'TX' => 'Texas', 'HI' => 'Hawaii' }

JavaScript の Map へのキーと値の設定と削除

JavaScript の Map オブジェクトにキーと値を設定するには、 set() メソッドを使います。

let m = new Map()
m.set('CA', 'California')
m.set('TX', 'Texas')
console.log(m)
// Map { 'CA' => 'California', 'TX' => 'Texas' }

Map オブジェクトのキー・バリューペアを削除するには、 delete() メソッドにキーを指定して呼び出します。

let m = new Map()
m.set('CA', 'California')
m.set('TX', 'Texas')
console.log(m)
// Map { 'CA' => 'California', 'TX' => 'Texas' }
m.delete('TX')
console.log(m)
// Map { 'CA' => 'California' }

JavaScript の Map の値を取得

JavaScript の Map オブジェクトに設定した値を、キーを使って取り出すには get() メソッドを使います。

let m = new Map()
m.set('CA', 'California')
m.set('TX', 'Texas')
console.log(m.get('CA')) // California
console.log(m.get('TX')) // Texas

JavaScript の Map の要素の存在確認

JavaScript の Map オブジェクトの特定のキーに値が設定されているかチェックするには、 has() メソッドを使います。

let m = new Map()
m.set('CA', 'California')
console.log(m.has('CA')) // true
console.log(m.get('CA')) // California
console.log(m.has('NY')) // false
console.log(m.get('NY')) // undefined

has() メソッドにキーを渡して、そのキーに対して値がセットされていれば true、セットされていなければ false が返ります。

JavaScript の Map の要素の列挙

JavaScript の Map オブジェクトに設定されているキーバリューペアは、 for 文を利用することで取得することができます。

let m = new Map()
m.set('CA', 'California')
m.set('NY', 'New York')
for (let v of m) {
  console.log(`${v[0]}: ${v[1]}`)
}
// CA: California
// NY: New York

また、Map オブジェクトの forEach() メソッドを用いると、Map オブジェクトに設定された全てのキーと値が渡されて関数が呼び出されます。

m.forEach((v, k) => {
  console.log(`${k}: ${v}`)
})
// CA: California
// NY: New York

以上、JavaScript の Map の使い方を説明しました。