您的位置:首页 » 分类: JavaScript & ES2015 (ES6) » 文章: ES2017 中 Object.entries() 和 Object.values()

ES2017 中 Object.entries() 和 Object.values()

小编推荐:掘金是一个高质量的技术社区,从 ECMAScript 6 到 Vue.js,性能优化到开源类库,让你不错过前端开发的每一个技术干货。各大应用市场搜索「掘金」即可下载APP,技术干货尽在掌握..

本章介绍了 ECMAScript 2017 的 Object.values/Object.entries 特性 。

概述

Object.entries()

let obj = { one: 1, two: 2 };
for (let [k,v] of Object.entries(obj)) {
    console.log(`${JSON.stringify(k)}: ${JSON.stringify(v)}`);
}
// Output:
// "one": 1
// "two": 2

Object.values()

> Object.values({ one: 1, two: 2 })
[ 1, 2 ]

Object.entries()

此方法签名如下:

Object.entries(value : any) : Array<[string,any]>

如果 JavaScript 数据结构具有键和值,条目是一个键值对,被编码为2元数组。Object.entries(x) 强制 x 为一个对象,并返回一个给定对象自己的可枚举属性[key,value]对的数组:

> Object.entries({ one: 1, two: 2 })
[ [ 'one', 1 ], [ 'two', 2 ] ]

其键为 symbols 的属性被忽略:

> Object.entries({ [Symbol()]: 123, foo: 'abc' });
[ [ 'foo', 'abc' ] ]

Object.entries() 最终给我们一种迭代对象属性的方法(读这里了解为什么对象默认情况下不可迭代):

let obj = { one: 1, two: 2 };
for (let [k,v] of Object.entries(obj)) {
    console.log(`${JSON.stringify(k)}: ${JSON.stringify(v)}`);
}
// Output:
// "one": 1
// "two": 2

通过 Object.entries() 设置为 Map 对象

Object.entries() 还允许你将一个对象设置为 Map 对象。这比使用2元数组的数组更简洁,但是键只能是字符串。

let map = new Map(Object.entries({
    one: 1,
    two: 2,
}));
console.log(JSON.stringify([...map]));
    // [["one",1],["two",2]]

常见问题

  • 为什么 Object.entries() 的返回值是一个数组而不是一个迭代器?

在这种情况下的相关先例是 Object.keys() ,而不是,例如 Map.prototype.entries()

  • 为什么 Object.entries() 只返回自己的可枚举的字符串键属性?

再次说明,这样做与 Object.keys() 一致。该方法也忽略其 symbols 键的属性。最终,可能会有一个返回所有属性的 Reflect.ownEntries() 方法。

Object.values()

此方法签名如下:

Object.values(value : any) : Array<any>

它的工作原理很像 Object.entries() ,但是,正如其名称所示,它只返回自己可枚举的字符串键属性的值:

> Object.values({ one: 1, two: 2 })
[ 1, 2 ]

Polyfill

为了兼容那些原生不支持 Object.entries() 和 Object.values() 方法的旧环境,你可以在 tc39/proposal-object-values-entrieses-shims/Object.entrieses-shims/Object.values找到一些解决方案。

原文地址:http://exploringjs.com/es2016-es2017/ch_object-entries-object-values.html

正文完。下面还有一个推广让最好的人才遇见更好的机会!

互联网行业的年轻人,他们面对着怎样的职业瓶颈、困惑与未来选择?过去,这鲜有人关心。资深的职场人,也多半优先选择熟人去推荐机会。

100offer致力于改变现状,帮互联网行业最好的人才发现更好的机会。使用 100offer.com 或 100offer App ,可以一周内获得中国、美国等数千家优质企业的工作机会。

马上去遇见更好的机会
推广结束

关注WEB前端开发官方公众号

关注国内外最新最好的前端开发技术干货,获取最新前端开发资讯,致力于打造高质量的前端技术分享公众号

发表评论

电子邮件地址不会被公开。 必填项已用*标注