[TypeScript]オブジェクト型を配列にする

一行で配列にする

一行でかけたのでこちらが良さそうです。
詳しくは、Object.entries() を使ってObject → 配列変換 - Qiita を参考にしてみてください。
2020/11/29更新

type Data = {
    a: string,
    b: string,
};
const data: Data = {
    a: 'A',
    b: 'B',
};

Object.entries(data).map(([key, value]) => ({key, value}));

console.log(Object.entries(data)); // [["a", "A"], ["b", "B"]] 
// mapメソッドは配列の全要素を呼び出して新たな配列を作る
// ([key, value])で、data[0]の場合は"a"をkey、"A"をvalueとして呼び出し
// ({key, value})で、{'key': key, 'value': value}として配列に格納する
console.log(Object.entries(data).map(([key, value]) => ({key, value})));
// [{
//  "key": "a",
//  "value": "A"
// }, {
//  "key": "b",
//  "value": "B"
// }] 

更新前はこちら。

オブジェクト型を配列として定義し直すのに簡単な方法を探していたところ
Object.keysの型がstring[]になってしまう問題の対策 - Qiita
を見つけました。
すごく助かりましたがTypeScript初心者として、どういう挙動か具体的に確かめたらなるほどとなったため記事にしました。

type Data = {
    a: string,
    b: string,
};
const data: Data = {
    a: 'A',
    b: 'B',
};

// オブジェクト型を配列にする
const rows = (Object.keys(data) as (keyof typeof data)[]).map((key) => {
    return { key, value: data[key] }
});

console.log(rows); 
// [{
//  "key": "a",
//  "value": "A"
// }, {
//  "key": "b",
//  "value": "B"
// }] 

// 挙動の確認
type dataType = keyof Data; // 'a'|'b'
console.log(Object.keys(data)); // ["a", "b"]
// キーの列挙型でキーの配列をキャストする
// typeof data は、Dataと同値
console.log(Object.keys(data) as (keyof typeof data)[]); // ["a", "b"]

// 普通は、キーを指定して出力する
console.log(data['a']); // 'A'
console.log(rows[0].value); // 'A'

keyof 演算子
オブジェクトの型からキーを抜き出す。

typeof 演算子
通常の式では渡された値の型の名前を文字列として返す。
型のコンテキストでは変数から型を抽出してくれる。