Object.entries
Object.entries
Object.entries()
方法返回一个给定对象自身可枚举属性的键值对数组,其排列与使用for...in
循环遍历该对象时返回的顺序一致(区别在于 for-in 循环也枚举原型链中的属性)。
语法
Object.entries(obj)
参数
obj
可以返回其可枚举属性的键值对的对象。
返回值
给定对象自身可枚举属性的键值对数组。
描述
Object.entries()
返回一个数组,其元素是与直接在object
上找到的可枚举属性键值对相对应的数组。属性的顺序与通过手动循环对象的属性值所给出的顺序相同。
示例
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
:
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。
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 |