公開日

JavaScriptにおけるハッシュマップ: 高性能なキーバリューペア

著者

ハッシュマップを使う理由

他のプログラミング言語に ハッシュテーブル と呼ばれるものがあることをご存知でしょう。これは、キーと値のペアを格納するデータ構造であり、O(1) の定数時間ルックアップが可能なので非常に優れています。データの格納に利用できる有利なデータ構造です。JavaScript には、ハッシュテーブルのような組み込みのデータ構造はありません。しかし、オブジェクトを使用してキーと値のペアを格納できます。JavaScript では、これは Map と呼ばれます。

Map とは何か

Map は、各要素がキーと値のペアとして格納される要素の集合です。Map のキーと値には、オブジェクトとプリミティブ値の両方を含むあらゆる値を使用できます。Map オブジェクトは、挿入順序で要素を反復処理します。for...of ループは、各反復で [キー、値] の配列を返します。

Map は、キーが任意のデータ型になることができるキーと値のペアを保持します。Map には、Map のサイズを表すプロパティがあります。Map は、キーの元の挿入順序を記憶します。

Map のメソッドとプロパティ

メソッド説明
new Map()新しい Map オブジェクトを作成します。
set()Map のキーの値を設定します。
get()キーの値を返します。
has()Map にキーが存在するかどうかを示すブール値を返します。
delete()Map からキーを削除します。
clear()Map からすべてのキーを削除します。
values()Map の値のイテレータオブジェクトを返します。
keys()Map のキーのイテレータオブジェクトを返します。
entries()Map のキーと値のペアのイテレータオブジェクトを返します。
forEach()Map のキーと値のペアごとに、指定された関数を一度実行します。
プロパティ説明
sizeMap 内のキー/値のペアの数を返します。

Map の例

const map = new Map()
map.set('name', 'John')
map.set('age', 30)
map.set('isMarried', true)
map.set('address', { city: 'New York', state: 'NY' })
map.set('hobbies', ['reading', 'writing', 'coding'])

console.log(map.get('name')) // John
console.log(map.get('age')) // 30
console.log(map.get('isMarried')) // true
console.log(map.get('address')) // {city: 'New York', state: 'NY'}
console.log(map.get('hobbies')) // ['reading', 'writing', 'coding']

console.log(map.size) // 5

Map の反復処理

const map = new Map()
map.set('name', 'John')
map.set('age', 30)
map.set('isMarried', true)
map.set('address', { city: 'New York', state: 'NY' })
map.set('hobbies', ['reading', 'writing', 'coding'])

// キーを反復処理します
for (const key of map.keys()) {
  console.log(key)
}

// 値を反復処理します
for (const value of map.values()) {
  console.log(value)
}

// キーと値のペアを反復処理します
for (const [key, value] of map.entries()) {
  console.log(key, value)
}

// キーと値のペアを反復処理します
map.forEach((value, key) => {
  console.log(key, value)
})

Map vs. オブジェクト

Mapオブジェクト
Map は、オブジェクトのように、キー付きのデータ項目の集合です。しかし、主な違いは、Map は任意の型のキーを許可することです。オブジェクトのキーは、文字列またはシンボルである必要があります。
Map は反復可能であり、簡単にループ処理できます。オブジェクトは反復可能ではなく、簡単にループ処理できません。
Map は、組み込みの forEach メソッドを持っているため、配列に変換する必要はありません。オブジェクトは、組み込みの forEach メソッドを持っていません。
Map には size プロパティがあるため、項目数を簡単に取得できます。オブジェクトには size プロパティがありません。
Map は、オブジェクトをキーとして使用できます。オブジェクトは、オブジェクトをキーとして使用できません。
Map は、一般的にオブジェクトよりも高速です。オブジェクトは、一般的に Map よりも低速です。

まとめ

この記事では、JavaScript の Map について学びました。Map のメソッドとプロパティについて学びました。また、Map とオブジェクトの違いについても学びました。この記事がお役に立てば幸いです。ご質問があれば、コメント欄にご記入ください。お読みいただきありがとうございました。

元記事: https://blog.imam.dev/blog/javascript-hashmap

参考文献

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map

https://www.freecodecamp.org/news/what-is-a-javascript-map-what-are-the-differences-between-map-and-object-in-javascript/

https://www.geeksforgeeks.org/map-vs-object-javascript/