首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Object.entries

Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用for...in 循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)。

语法

代码语言:javascript
复制
Object.entries(obj)

参数

obj可以返回其可枚举属性的键值对的对象。

返回值

给定对象自身可枚举属性的键值对数组。

描述

Object.entries()返回一个数组,其元素是与直接在object上找到的可枚举属性键值对相对应的数组。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。

示例

代码语言:javascript
复制
var obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [ ['foo', 'bar'], ['baz', 42] ]

// array like object
var obj = { 0: 'a', 1: 'b', 2: 'c' };
console.log(Object.entries(obj)); // [ ['0', 'a'], ['1', 'b'], ['2', 'c'] ]

// array like object with random key ordering
var an_obj = { 100: 'a', 2: 'b', 7: 'c' };
console.log(Object.entries(an_obj)); // [ ['2', 'b'], ['7', 'c'], ['100', 'a'] ]

// getFoo is property which isn't enumerable
var my_obj = Object.create({}, { getFoo: { value: function() { return this.foo; } } });
my_obj.foo = 'bar';
console.log(Object.entries(my_obj)); // [ ['foo', 'bar'] ]

// non-object argument will be coerced to an object
console.log(Object.entries('foo')); // [ ['0', 'f'], ['1', 'o'], ['2', 'o'] ]

// iterate through key-value gracefully
var obj = {a: 5, b: 7, c: 9};
for (var [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:

代码语言:javascript
复制
var obj = { foo: 'bar', baz: 42 }; 
var map = new Map(Object.entries(obj));
console.log(map); // Map { foo: "bar", baz: 42 }

Polyfill

要在较旧环境中添加兼容的Object.entries支持,你可以在 tc39/proposal-object-values-entries 中找到Object.entries的示例(如果你不需要任何对IE的支持),在 es-shims/Object.entries 资料库中的一个polyfill,或者你可以使用下面列出的简易 polyfill。

代码语言:javascript
复制
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;
  };

对于上述 polyfill 代码片段,如果你需要 IE <9 的支持,那么你还需要一个 Object.keys polyfill(如 Object.keys 页面上的)。

规范

Specification

Status

Comment

ECMAScript Latest Draft (ECMA-262)The definition of 'Object.entries' in that specification.

Living Standard

Initial definition.

ECMAScript 2017 (ECMA-262)The definition of 'Object.entries' in that specification.

Standard

浏览器兼容

Feature

Chrome

Edge

Firefox

Internet Explorer

Opera

Safari

Basic Support

54

(Yes)

47

No

No

10.1

Feature

Android

Chrome for Android

Edge mobile

Firefox for Android

IE mobile

Opera Android

iOS Safari

Basic Support

54

54

(Yes)

47

No

No

No

扫码关注腾讯云开发者

领取腾讯云代金券