どうも、ちょげ(@chogetarou)です。
連想配列を通常の配列(Array)に変換する方法を紹介します。
方法
連想配列を通常の配列(Array)に変換する方法は、オブジェクトとMapで異なります。
オブジェクトの場合
オブジェクト(Object)を配列(array)に変換する方法は、３つあります。
key-valueペアの配列
１つ目は、key-valueペアの配列に変換する方法です。
まず、Object.entries()を呼び出します。
そして、Object.values()の引数に、対象のオブジェクトを指定します。
//TKey=キーの型、TValue=値の型、obj=オブジェクト
const pairs: [Tkey, TValue][] = Object.entries(obj)上記のObject.entries()は、引数に指定したオブジェクトをキーと値のペアを持つ配列に変換します。
使用例
const nums = {
"one": 1,
"two": 2,
"three": 3,
"four": 4,
"five": 5,
}
const pairs: [string, number][] = Object.entries(nums)
console.log(pairs)出力：
[["one", 1], ["two", 2], ["three", 3], ["four", 4], ["five", 5]] keyの配列
２つ目は、keyの配列に変換する方法です。
まず、Object.keys()を呼び出します。
そして、Object.keys()の引数に、対象のオブジェクトを指定します。
//T=キーの型、obj=オブジェクト
const keys: T[] = Object.keys(obj)上記のObject.keys()は、引数に指定したオブジェクトの全てのキーを持つ配列を取得します。
使用例
const nums = {
"one": 1,
"two": 2,
"three": 3,
"four": 4,
"five": 5,
}
const keys: string[] = Object.keys(nums)
console.log(keys)出力：
["one", "two", "three", "four", "five"] valueの配列
３つ目は、valueの配列に変換する方法です。
まず、Object.values()を呼び出します。
そして、Object.values()の引数に、対象のオブジェクトを指定します。
//T=値の型、obj=オブジェクト
const values: T[] = Object.values(obj)上記のObject.values()は、引数に指定したオブジェクトの全ての値を持つ配列を取得します。
使用例
const nums = {
"one": 1,
"two": 2,
"three": 3,
"four": 4,
"five": 5,
}
const values: number[] = Object.values(nums)
console.log(values)出力：
[1, 2, 3, 4, 5] Map(マップ)の場合
Map(マップ)を配列(array)に変換する方法は、３つあります。
key-valueペアの配列
１つ目は、key-valueペアの配列に変換する方法です。
スプレッド構文
まず、[...]を記述します。
そして、「...」の右辺で、Mapからentries()を呼び出します。
////TKey=キーの型、TValue=値の型、map=マップ
const pairs: [TKey, TValue][] = [...map.entries()]上記のスプレッド構文は、entries()を呼び出したMapをkey-valueペアの配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const pairs: [string, number][] = [...nums.entries()]
console.log(pairs)出力：
[["one", 1], ["two", 2], ["three", 3], ["four", 4], ["five", 5]] Array.from()
まず、Array.from()を呼び出します。
そして、Array.from()の引数で、Mapからentries()を呼び出します。
////TKey=キーの型、TValue=値の型、map=マップ
const pairs: [TKey, TValue][] = Array.from(map.entries())上記のArray.from()は、entries()を呼び出したMapをkey-valueペアの配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const pairs: [string, number][] = Array.from(nums.entries())
console.log(pairs)出力：
[["one", 1], ["two", 2], ["three", 3], ["four", 4], ["five", 5]] keyの配列
２つ目は、keyの配列に変換する方法です。
Mapをkeyの配列に変換するには、スプレッド構文もしくはArray.from()を使います。
スプレッド構文
まず、[...]を記述します。
そして、「...」の右辺で、Mapからkeys()を呼び出します。
//T=キーの型、map=マップ
const keys: T[] = [...map.keys()]上記のスプレッド構文は、keys()を呼び出したMapから全てのキーを配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const keys: string[] = [...nums.keys()]
console.log(keys)出力：
["one", "two", "three", "four", "five"] Array.from()
まず、Array.from()を呼び出します。
そして、Array.from()の引数で、Mapからkeys()を呼び出します。
//T=キーの型、map=マップ
const keys: T[] = Array.from(map.keys())上記のArray.from()は、keys()を呼び出したMapから全てのキーを配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const keys: string[] = Array.from(nums.keys())
console.log(keys)出力：
["one", "two", "three", "four", "five"] valueの配列
３つ目は、valueの配列に変換する方法です。
Mapをkeyの配列に変換するには、スプレッド構文もしくはArray.from()を使います。
スプレッド構文
まず、[...]を記述します。
そして、「...」の右辺で、Mapからvalues()を呼び出します。
//T=値の型、map=マップ
const values: T[] = [...map.values()]上記のスプレッド構文は、values()を呼び出したMapから全ての値(value)を配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const values: number[] = [...nums.values()]
console.log(values)出力：
[1, 2, 3, 4, 5] Array.from()
まず、Array.from()を呼び出します。
そして、Array.from()の引数で、Mapからvalues()を呼び出します。
//T=値の型、map=マップ
const values: T[] = Array.from(map.values())上記のArray.from()は、values()を呼び出したMapから全ての値(value)を配列に変換します。
使用例
const nums: Map<string, number> = new Map();
nums.set("one", 1)
nums.set("two", 2)
nums.set("three", 3)
nums.set("four", 4)
nums.set("five", 5)
const values: number[] = Array.from(nums.values())
console.log(values)出力：
[1, 2, 3, 4, 5] まとめ
連想配列を通常の配列(Array)に変換する方法は、オブジェクトとMapで異なります。
オブジェクト(Object)を配列(array)に変換する方法は、次の３つです。
- key-valueペアの配列に変換する方法
const pairs: [Tkey, TValue][] = Object.entries(obj) - keyの配列に変換する方法
const keys: T[] = Object.keys(obj) - valueの配列に変換する方法
const values: T[] = Object.values(obj)
Map(マップ)を配列(array)に変換する方法は、次の３つです。
- key-valueペアの配列に変換する方法
const pairs: [TKey, TValue][] = [...map.entries()]const pairs: [TKey, TValue][] = Array.from(map.entries())
- keyの配列に変換する方法
const keys: T[] = [...map.keys()]- const keys: T[] = Array.from(map.keys())
- valueの配列に変換する方法
const values: T[] = [...map.values()]- const values: T[] = Array.from(map.values())
コメント