[JavaScript]Mapの連想配列のキーを配列と取得するには？

どうも、ちょげ(@chogetarou)です。

Mapの連想配列のキー(key)を配列として取得する方法を紹介します。

方法

Mapの連想配列のキー(key)を配列として取得する方法は、２つあります。

Array.from()

１つは、Array.from()を使う方法です。

まず、Array.from()を呼び出します。

そして、Array.from()の引数で、Mapの連想配列からkeys()を呼び出します。

const keys = Array.from(map.keys());

上記のArray.from()は、keys()を呼び出したMapの連想配列のキーの配列を生成します。

使用例

const numbers = new Map([[ "one", 1], ["two", 2], ["three", 3], ["four", 4], ["five", 5 ]]);

const keys = Array.from(numbers.keys());

console.log(keys);

出力：
[ 'one', 'two', 'three', 'four', 'five' ]

スプレッド構文

もう１つは、スプレッド構文を使う方法です。

まず、[]を記述します。

そして、[…map.keys()]のように、[]内で連想配列から呼び出したkeys()の戻り値を「…」で展開します。

const keys = [...map.keys()];

上記の[]は、keys()を呼び出したMapの連想配列のキーの配列を生成します。

使用例

const numbers = new Map([[ "one", 1], ["two", 2], ["three", 3], ["four", 4], ["five", 5 ]]);

const keys = [...numbers.keys()];

console.log(keys);

出力：
[ 'one', 'two', 'three', 'four', 'five' ]

まとめ

Mapの連想配列のキー(key)を配列として取得する方法は、次の２つです。

• Array.from()を使う方法
  const keys = Array.from(map.keys());
• スプレッド構文を使う方法
  const keys = [...map.keys()];

[JavaScript]文字列の文字数を取得するには？

文字列(string)の文字数を取得する方法を紹介します。

www.choge-blog.com

2022.07.31

[JavaScript]配列(Array)の最大値を取得するには？

配列(Array)の最大値を取得する方法を紹介します。

www.choge-blog.com

2022.07.30

[JavaScript]文字列に変数を埋め込むには？

文字列に変数を埋め込む方法を紹介します。

www.choge-blog.com

2022.02.13