Object.entries() メソッドは、引数に与えたオブジェクトが所有する、列挙可能なプロパティの組 [key, value] からなる配列を返します。配列要素の順序は for...in ループによる順序と同じです (両者の違いとして、for-in ループではその上プロトタイプチェーン内のプロパティも列挙されます)。 Object.entries() で返される配列の順序は、オブジェクトがどのように定義されたかに依存しません。特定の順序にする必要があるのであれば、 Object.entries(obj).sort((a, b) => a[0] - b[0]); のようにして、まず配列を整列する必要があります。

構文

Object.entries(obj)

引数

obj
返されることになる列挙可能な所有プロパティの組 [key, value] を持つオブジェクト。

返値

引数に与えたオブジェクトが所有する、列挙可能なプロパティの組 [key, value] の配列。

説明

Object.entries() は、 object に直接存在する列挙可能プロパティの組 [key, value] が配列要素に対応した配列を返します。プロパティの順序はオブジェクト内のプロパティに対してループさせた時の順序と同じになります。

const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

// 配列様オブジェクト
const obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]

// ランダムなキー順序を持つ配列様オブジェクト
const anObj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.entries(anObj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]

// 列挙可能でないプロパティ getFoo がある
const myObj = Object.create({}, { getFoo: { value() { return this.foo; } } });
myObj.foo = 'bar';
console.log(Object.entries(myObj)); // [ ['foo', 'bar'] ]

// オブジェクトでない引数はオブジェクトへと型強制されます
console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]

// returns an empty array for any primitive type, since primitives have no own properties
console.log(Object.entries(100)); // [ ]

// iterate through key-value gracefully
const obj = { a: 5, b: 7, c: 9 };
for (const [key, value] of Object.entries(obj)) {
  console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
}

// Or, using array extras
Object.entries(obj).forEach(([key, value]) => {
console.log(`${key} ${value}`); // "a 5", "b 7", "c 9"
});

Object から Map への変換

new Map() コンストラクタは entries による反復処理に対応しています。Object.entries を使うと、Object から Map へと簡単に変換できます。:

const obj = { foo: 'bar', baz: 42 }; 
const map = new Map(Object.entries(obj));
console.log(map); // Map { foo: "bar", baz: 42 }

Object をループする

Array Destructuring を使って、objects を簡単にループできます。

const obj = { foo: 'bar', baz: 42 };
Object.entries(obj).forEach(([key, value]) => console.log(`${key}: ${value}`)); // "foo: bar", "baz: 42"

ポリフィル (Polyfill)

Object.entries に対応していない古い環境に互換性を持たせる場合は、tc39/proposal-object-values-entries (IE のサポートが不要な場合) や es-shims/Object.entries 内に Object.entries の実装のポリフィルがありますし、単純に、下記の配布可能なポリフィルを使うこともできます。

if (!Object.entries) {
  Object.entries = function( obj ){
    var ownProps = Object.keys( obj ),
        i = ownProps.length,
        resArray = new Array(i); // preallocate the Array
    while (i--)
      resArray[i] = [ownProps[i], obj[ownProps[i]]];
    
    return resArray;
  };
}

上記のポリフィルのコードスニペットで、IE < 9 の対応が必要な場合、 Object.keys の polyfill (Object.keys ページにあるようなもの) も必要となります。

仕様書

仕様書 状態 備考
ECMAScript Latest Draft (ECMA-262)
Object.entries の定義
ドラフト 初回定義
ECMAScript 2017 (ECMA-262)
Object.entries の定義
標準  

ブラウザーの対応

Update compatibility data on GitHub
デスクトップモバイルサーバー
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeEdge MobileAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung InternetNode.js
基本対応Chrome 完全対応 54Edge 完全対応 14Firefox 完全対応 47IE 未対応 なしOpera 完全対応 41Safari 完全対応 10.1WebView Android 完全対応 54Chrome Android 完全対応 54Edge Mobile 完全対応 ありFirefox Android 完全対応 47Opera Android 完全対応 41Safari iOS 完全対応 10.1Samsung Internet Android 完全対応 6.0nodejs 完全対応 7.0.0
完全対応 7.0.0
完全対応 6.5.0
無効
無効 From version 6.5.0: this feature is behind the --harmony runtime flag.

凡例

完全対応  
完全対応
未対応  
未対応
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。

関連情報

ドキュメントのタグと貢献者

このページの貢献者: mfuji09, Uemmra3, segayuu, YuichiNukiyama, lv7777, x2357
最終更新者: mfuji09,