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プログラミングにおいて、データ操作やオブジェクトの処理を効率的に行うための重要なツールとなっています。特に、配列メソッドと組み合わせることで、オブジェクトの柔軟な操作が可能になります。