JavaScriptのMapオブジェクト sizeプロパティの使い方

JavaScriptのmapオブジェクトのsizeメソッドについて記載します。
概要、実際のサンプルコードを交えて構文などの使い方をまとめてみました。

JavaScriptのMapオブジェクトとは？
JavaScriptのmapオブジェクトのsize概要
JavaScriptのmapオブジェクトのsizeを使ったサンプルコードの紹介
1. mapオブジェクトのsizeを使ったサンプルコード1
2. mapオブジェクトのsizeを使ったサンプルコード2
JavaScript mapオブジェクトの他メソッドについて

JavaScriptのMapオブジェクトとは？

キー（key）とキーに対応する値（value）を対応させて保持するオブジェクトで、Setオブジェクトと併せて、ES6(ES2015)から追加された比較的新しいデータタイプです。
配列に似ており、Javascript でデータを扱う上でよく使うデータ型として知られています。
またJSのオブジェクト型とも非常に似ておりますが、文字列や数値、真偽値（Boolean）をキーとなる値に対して自由に設定できる違いがあります。
JS,TypeScript,Node.jsなどで開発していくうえで重要なデータタイプとなっています。

それでは、次に本題の説明に移ります。

JavaScriptのmapオブジェクトのsize概要

mapオブジェクトのsizeは、マップ内のエントリーの数を返すプロパティです。

構文、使い方

map.size() // sizeを取得する

引数について

mapオブジェクトのsize()は、mapオブジェクト内の要素の数を返すメソッドです。引数は必要ありません。

返り値について

mapオブジェクトのsizeメソッドは、mapオブジェクト内の要素の数を返します。

このメソッドを利用した便利なテクニック

JavaScriptのmapオブジェクトのsizeプロパティを使うと、オブジェクト内の要素の数を取得できます。

これを使うと、オブジェクト内の要素を簡単に反復処理することができます。

現場で実際にどのように使われているか

JavaScriptのmapオブジェクトは、キーと値のペアを格納するために使用されます。

sizeプロパティは、mapオブジェクトに格納されているキーと値のペアの数を返します。

これは、特定のmapオブジェクト内の要素の数を確認するために使用されます。

JavaScriptのmapオブジェクトのsizeと一緒によく使われる処理

forEachメソッドです。forEachメソッドは、mapオブジェクトのすべてのエントリーに対して処理を実行するために使用されます。

これにより、すべてのエントリーを簡単に処理できます。

使用する上での注意点

mapオブジェクトのsizeは、IE11以前のブラウザではサポートされていません。
また、サイズを取得するためには、Object.keys()を使用する必要があります。

JavaScriptのmapオブジェクトのsizeと似た処理のJSメソッド、違い

Object.keys()とObject.values()と似ていますが、下記の違いがあります。

Object.keys()はオブジェクトのキーを取得
Object.values()はオブジェクトの値を取得
mapオブジェクトのsizeはオブジェクトのキーと値のペアの数を返します。

JavaScriptのmapオブジェクトのsizeを使ったサンプルコードの紹介

mapオブジェクトのsizeを使ったサンプルコード1

let myMap = new Map();
myMap.set('name', 'John');
myMap.set('age', 25);

console.log(myMap.size);

let myMap = new Map();

myMap.set('name', 'John');

myMap.set('age', 25);

console.log(myMap.size);

mapオブジェクトのsizeを使ったサンプルコード2

let myMap = new Map();
myMap.set('name', 'John');
myMap.set('age', 25);
myMap.set('location', 'New York');

console.log(myMap.size);

let myMap = new Map();

myMap.set('name', 'John');

myMap.set('age', 25);

myMap.set('location', 'New York');

console.log(myMap.size);

JavaScript mapオブジェクトの他メソッドについて

JavaScriptのmapオブジェクトの他メソッドについては、下記記事にもまとめていますので参考にしてみてください

メソッド名	機能	リンク
map new Map()	新しいマップオブジェクトを作成します	JavaScript mapオブジェクト newMapメソッドの使い方
map.prototype.set()	マップ内のキーの値を設定します	JavaScript mapオブジェクト setメソッドの使い方
map.prototype.get()	マップ内のキーの値を取得します	JavaScript mapオブジェクト getメソッドの使い方
map.prototype.clear()	マップからすべての要素を削除します	JavaScript mapオブジェクト clearメソッドの使い方
map.prototype.delete()	キーで指定されたマップ要素を削除します	JavaScript mapオブジェクト deleteメソッドの使い方
map.prototype.has()	キーがマップに存在する場合、trueを返します	JavaScript mapオブジェクト hasメソッドの使い方
map.prototype.forEach()	マップ内の各キー/値ペアのコールバックを呼び出す	JavaScript mapオブジェクト foreachメソッドの使い方
map.prototype.entries()	マップ内の[key、value]ペアを持つイテレーターオブジェクトを返します	JavaScript mapオブジェクト entriesメソッドの使い方
map.prototype.keys()	マップ内にキーを含むイテレーターオブジェクトを返します	JavaScript mapオブジェクト keysメソッドの使い方
map.prototype.values()	マップ内の値のイテレーターオブジェクトを返します	JavaScript mapオブジェクト valuesメソッドの使い方
map size property	マップ要素の数を返します	JavaScript mapオブジェクト sizeプロパティの使い方