Map (initial support) | Frontend Practical Guide

概要

Map はキーと値のペアを保持するコレクションです。オブジェクトと異なり、任意の値（オブジェクト含む）をキーにでき、挿入順序が保持され、size プロパティで要素数を取得できます。

対応ブラウザ

機能	デスクトップ				モバイル
機能	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`Map`	38	12	13	8	38	8
`Map.@@iterator` [Symbol.iterator]() は Map インスタンスのメソッドで、反復可能プロトコルを実装します。これにより、 Map オブジェクトが反復可能プロトコルを受け入れるほとんどの構文、たとえばスプレッド構文や Statements/for...of ループなどで使用できるようになります。マップのキーと値のペアを挿入順に返すイテレーターオブジェクトを返します。	38	12	36	10	38	10
`Map.@@species` Map[Symbol.species] は静的アクセサープロパティで、 Map オブジェクトをコピーする方法を示す未使用のアクセサープロパティです。	51	13	41	10	51	10
`Map.Map` Map() コンストラクターは、 Map オブジェクトを生成します。	38	12	13	8	38	8
`Map.Map.iterable allowed` `新しいマップ(反復可能)`	38	12	13	9	38	9
`Map.Map.null allowed` `新しいマップ(null)`	38	12	37	9	38	9
`Map.clear` clear() は Map インスタンスのメソッドで、このマップからすべての要素を削除します。	38	12	19	8	38	8
`Map.delete` delete() は Map インスタンスのメソッドで、このマップからキーを指定して特定の要素を削除します。	38	12	13	8	38	8
`Map.entries` entries() は Map インスタンスのメソッドで、挿入順でこの Map オブジェクトのそれぞれの要素に対する [キー, 値] のペアを含む新しいマップイテレーターオブジェクトを返します。	38	12	20	8	38	8
`Map.forEach` forEach() メソッドは、指定された関数を Map オブジェクト内にあるキーと値のペアそれぞれに対して 1 回ずつ、挿入順に実行します。	38	12	25	8	38	8
`Map.get` get() は Map インスタンスのメソッドで、この Map オブジェクトから指定された要素を返します。指定されたキーに関連付けられた値がオブジェクトである場合は、そのオブジェクトの参照を受け取ることになり、そのオブジェクトに対して変更を行った場合は、 Map オブジェクトの中にあるものに変更が行われます。	38	12	13	8	38	8
`Map.has` has() は Map インスタンスのメソッドで、指定されたキーに対する要素が存在するかどうかを示す論理値を返します。	38	12	13	8	38	8
`Map.key equality for zeros` -0 と 0 のキーの等価性	38	12	29	9	38	9
`Map.keys` keys() は Map インスタンスのメソッドで、この Map オブジェクトに挿入された要素のキーを挿入順に列挙する新しいイテレーターオブジェクトを返します。	38	12	20	8	38	8
`Map.set` set() は Map インスタンスのメソッドで、指定されたキーと値を持つ要素をこの Map オブジェクトに追加したり、更新したりします。	38	12	13	8	38	8
`Map.size` size は Map インスタンスのアクセサープロパティで、このマップにある要素の数を返します。	38	12	19	8	38	8
`Map.values` values() は Map インスタンスのメソッドで、この Map オブジェクトに挿入された要素の値を挿入順に列挙する新しいマップイテレーターオブジェクトを返します。	38	12	20	8	38	8

1+対応 (バージョン) 未対応 ※注釈ありサブ機能の解説は MDN Web Docs (CC BY-SA 2.5)

基本構文

JAVASCRIPT

const map = new Map();
map.set('name', 'Taro');
map.set(42, 'the answer');
map.set(true, 'boolean key');

map.get('name'); // 'Taro'
map.has(42);     // true
map.size;        // 3

// Iteration
for (const [key, value] of map) {
  console.log(`${key}: ${value}`);
}

ライブデモ

Basic Map operations

Add, read, delete, and iterate over entries while watching insertion order stay intact.

JavaScript

出力

「実行」ボタンを押してください

Object keys by reference

Map treats each object reference as a distinct key, even when the contents look the same.

JavaScript

出力

「実行」ボタンを押してください

実務での使いどころ

Map (initial support) の活用

キーと値のペアを格納するコレクション。Object と異なり、任意の型をキーに使用可能。

注意点

特になし。すべての主要ブラウザで安定して動作する。

参考リンク

MDN Web Docs — Map (initial support)

Powered by web-features

概要