ES12（ECMAScript 2021）是 JavaScript 的最新标准，它为开发者提供了更多方便快捷的 API 和语言特性。其中，Object.keys()、Object.values() 与 Object.entries() 是开发过程中非常常用的三个方法。在本文中，我们将详细讲解它们的用法和功能，帮助读者深入理解和掌握这些方法，以及如何更好地运用它们来提升开发效率。
基本函数
Object.keys()、Object.values() 与 Object.entries() 是 JavaScript 中针对对象的三个内建函数。它们的作用分别是：
- Object.keys()：返回一个由对象键组成的数组。
- Object.values()：返回一个由对象值组成的数组。
- Object.entries()：返回一个由对象键值对组成的二维数组。
这三个方法都可以应用于普通对象（plain objects）和类数组对象（array-like objects）。例如：
-- -------------------- ---- ------- ----- --- - - -- -- -- -- -- - -- ------------------------------ -- ----- ---- ---- -------------------------------- -- --- -- -- --------------------------------- -- ------ --- ----- --- ----- --- -- ------- ----- ---------- - - -- ---- -- ---- -- ---- ------- - -- ------------------------------------- -- ----- ---- ---- --------- --------------------------------------- -- ----- ---- ---- -- ---------------------------------------- -- ------ ----- ----- ----- ----- ----- ---------- ---展开代码
可见，这三个函数的返回值都相应地转换为数组。
用法
Object.keys()
Object.keys() 返回一个由给定对象的所有可枚举属性键组成的数组，不包括继承来的属性。
可枚举属性是指对象的属性（包括自有属性和从原型链中继承来的属性），且它们的 enumerable 属性值为 true。当我们在定义一个属性时没有明确指定 enumerable 属性，其默认值为 true。
以下是 Object.keys() 的用法示例：
-- -------------------- ---- ------- ----- ---- - - -- -- -- -- -- - -- ------------------------------- -- ----- ---- ---- ----- ---- - ------------------- - -- - ------ -- ----------- ---- -- ------ ----- - --- ------------------------------- -- -----展开代码
上面的代码中，obj2 继承了 obj1 的属性，但它仅有一个可枚举属性 d。
Object.values()
Object.values() 返回一个由给定对象的所有可枚举属性值组成的数组，不包括继承来的属性值。
以下是 Object.values() 的用法示例：
-- -------------------- ---- ------- ----- ---- - - -- -- -- -- -- - -- --------------------------------- -- --- -- -- ----- ---- - ------------------- - -- - ------ -- ----------- ---- - --- --------------------------------- -- ---展开代码
Object.entries()
Object.entries() 返回一个由给定对象的所有可枚举属性键值对组成的数组，不包括继承来的属性键值对。
以下是 Object.entries() 的用法示例：
-- -------------------- ---- ------- ----- ---- - - -- -- -- -- -- - -- ---------------------------------- -- ------ --- ----- --- ----- --- ----- ---- - ------------------- - -- - ------ -- ----------- ---- - --- ---------------------------------- -- ------ ---展开代码
与 Object.values() 类似，Object.entries() 的返回数组中的元素也是有序的。
稳定性
Object.keys()、Object.values() 与 Object.entries() 的方法默认情况下是不稳定的，即它们返回的顺序是随机的，而不一定跟定义时的顺序相同。
ES12 中，这三个函数的稳定性得到了改善。Object.keys()、Object.values() 与 Object.entries() 后跟着排序符的调用，它们的返回值将会按照正常的字符串排序规则进行排序。这个排序符可以是 String.prototype.localeCompare() 或其它排序算法。
以下是按照字母顺序排列的 Object.keys() 的用法示例：
const obj = { c: 1, a: 2, b: 3 }; console.log(Object.keys(obj).sort()); // ["a", "b", "c"]
总结
Object.keys()、Object.values() 与 Object.entries() 是 JavaScript 中非常常用的三个方法。它们对于对象的属性遍历和数据处理都非常有用。在开发过程中，可以运用它们提高代码的效率。
值得注意的是，ES12 中，这三个函数默认情况下的返回值是不稳定的，但是在加入排序符之后就能保证稳定性。因此，在开发过程中，我们应该尽可能引入排序符，以防止因为非稳定排序产生的 bug。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6533e43f7d4982a6eb795b48
