在前端开发中，我们经常需要操作对象。在处理对象属性时，有时候需要按照自定义的顺序枚举属性。ES2015 提供了 Object.getOwnPropertyNames 方法，可以返回某个对象的所有自身属性的属性名，但是它返回的属性名的顺序并不是我们期望的，我们无法自由控制属性的枚举顺序。ES9（ECMAScript 2018）引入了 Object.getOwnPropertyDescriptors 方法，该方法返回一个对象的所有自身属性的描述符，包括属性的值、是否可写、是否可枚举等信息，并且可以通过对象字面量的方式自由控制属性的枚举顺序。
Object.getOwnPropertyNames
Object.getOwnPropertyNames 方法返回一个数组，它包含了一个对象的所有自身属性的属性名，但是数组元素的顺序并不是我们期望的。我们可以通过以下例子来看看 Object.getOwnPropertyNames 方法的返回结果：
const obj = {
b: 1,
a: 2,
c: 3
};
console.log(Object.getOwnPropertyNames(obj)); // ["b", "a", "c"]我们期望的属性顺序为 a、b、c，但是 Object.getOwnPropertyNames 返回的顺序是 b、a、c，这是因为该方法返回的顺序是按照属性定义的顺序排列的。
Object.getOwnPropertyDescriptors
ES9 引入的 Object.getOwnPropertyDescriptors 方法，返回一个对象的所有自身属性的描述符，包括属性的值、是否可写、是否可枚举等信息。该方法返回的对象结构和 Object.create 方法创建的对象结构一样，可以通过对象字面量的方式自由控制属性的枚举顺序。
-- -------------------- ---- -------
----- --- - --------------------------- -
-- -
------ --
--------- -----
----------- -----
------------- ----
--
-- -
------ --
--------- -----
----------- -----
------------- ----
--
-- -
------ --
--------- -----
----------- -----
------------- ----
-
---
---------------------------------------------------
-- -
-- -- -
-- ------ --
-- --------- -----
-- ----------- -----
-- ------------- ----
-- --
-- -- -
-- ------ --
-- --------- -----
-- ----------- -----
-- ------------- ----
-- --
-- -- -
-- ------ --
-- --------- -----
-- ----------- -----
-- ------------- ----
-- -
-- -我们可以看到，Object.getOwnPropertyDescriptors 返回的对象结构和 Object.create 方法创建的对象结构一样，包括了属性的值、是否可写、是否可枚举等信息。在这个例子中，我们可以自由控制属性的枚举顺序，只需要按照自己的需要定义对象属性即可。
通过了解 Object.getOwnPropertyNames 和 Object.getOwnPropertyDescriptors 方法，我们可以自由控制对象属性的枚举顺序。
-- -------------------- ---- -------
----- --- - --------------------------- -
-- -
------ --
--------- -----
----------- -----
------------- ----
--
-- -
------ --
--------- -----
----------- -----
------------- ----
--
-- -
------ --
--------- -----
----------- -----
------------- ----
-
---
----- ---- - ----- ---- -----
----- ----------- - --------------------------------------
----- ------------------ - ---
--- ---- --- -- ----- -
----------------------- - -----------------
-
----- ---------- - --------------------------- --------------------
---------------------------------------------------- -- ----- ---- ----在这个例子中，我们先定义了一个对象 obj，包含了三个属性 a、b、c。然后，我们定义了一个数组 keys，这个数组按照自己的需要定义属性的枚举顺序。接着，通过 Object.getOwnPropertyDescriptors 方法获取了 obj 的所有属性描述符，并将它们存储在 descriptors 对象中。最后，我们使用 for 循环将 descriptors 对象按照 keys 数组的顺序保存在 orderedDescriptors 对象中，并使用 Object.defineProperties 方法将 orderedDescriptors 对象定义为一个新的对象 orderedObj。这个新的对象 orderedObj 的属性枚举顺序是我们期望的顺序，即 a、b、c。
总结
ES2015 的 Object.getOwnPropertyNames 方法和 ES9 的 Object.getOwnPropertyDescriptors 方法可以帮助我们自由控制对象属性的枚举顺序。通过对它们的使用，我们可以更加灵活地操作对象属性。在实际的开发中，我们可以根据自己的需求，灵活选择对应的方法，来操作对象属性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/654873117d4982a6eb2b6832