[TypeScript]オブジェクト(Object)を配列に変換するには?

TypeScript

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

オブジェクト(Object)を配列(array)に変換する方法を紹介します。

スポンサーリンク

方法

インターフェース, インターネット, プログラム, ブラウザ, Www

オブジェクト(Object)を配列(array)に変換する方法は、3つあります。

key-valueペアの配列

1つ目は、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の配列

2つ目は、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の配列

3つ目は、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] 

まとめ

オブジェクト(Object)を配列(array)に変換する方法は、次の3つです。

  • key-valueペアの配列に変換する方法
    const pairs: [Tkey, TValue][] = Object.entries(obj)
  • keyの配列に変換する方法
    const keys: T[] = Object.keys(obj)
  • valueの配列に変換する方法
    const values: T[] = Object.values(obj)

コメント

タイトルとURLをコピーしました