JavaScriptでオブジェクトを配列に変換したい場合、`Object.entries()`メソッドを使用すると簡単に実現できます。このメソッドは、オブジェクトのキーと値のペアを配列として返す便利な機能を提供します。

Object.entries()の基本的な使い方

const user = {
  name: "John",
  age: 30,
  email: "john@example.com"
};

const entries = Object.entries(user);
console.log(entries);
// 出力:
// [
//   ["name", "John"],
//   ["age", 30],
//   ["email", "john@example.com"]
// ]

主な特徴

  • オブジェクトのプロパティを`[key, value]`のペアの配列に変換
  • 返される配列は、各要素が2つの要素(キーと値)を持つ配列
  • ES2017以降のモダンなJavaScriptで使用可能

実践的な使用例

1. オブジェクトの繰り返し処理

const prices = {
  apple: 100,
  banana: 80,
  orange: 120
};

Object.entries(prices).forEach(([fruit, price]) => {
  console.log(`${fruit}: ${price}円`);
});
// 出力:
// apple: 100円
// banana: 80円
// orange: 120円

2. Map オブジェクトへの変換

const user = {
  name: "Jane",
  age: 25
};

const userMap = new Map(Object.entries(user));
console.log(userMap.get("name")); // "Jane"

3. オブジェクトのフィルタリング

const data = {
  item1: 10,
  item2: 20,
  item3: 30
};

const filtered = Object.fromEntries(
  Object.entries(data).filter(([_, value]) => value > 20)
);
console.log(filtered); // { item3: 30 }

ブラウザ対応状況

`Object.entries()`は以下のブラウザバージョンから対応しています:

  • Chrome 54以降
  • Firefox 47以降
  • Safari 10.1以降
  • Edge 14以降

注意点

1. プロトタイプチェーン上のプロパティは含まれません

2. Symbol型のプロパティは無視されます

3. 列挙可能なプロパティのみが対象となります

代替手段

古いブラウザをサポートする必要がある場合は、以下のようなポリフィルを使用できます:

if (!Object.entries) {
  Object.entries = function(obj) {
    return Object.keys(obj).map(key => [key, obj[key]]);
  };
}

まとめ

`Object.entries()`は、オブジェクトを配列に変換する強力なメソッドです。モダンなJavaScriptプログラミングにおいて、データ操作やオブジェクトの処理を効率的に行うための重要なツールとなっています。特に、配列メソッドと組み合わせることで、オブジェクトの柔軟な操作が可能になります。