作为前端开发者，我们都知道 JavaScript 是一门非常灵活的语言。从 ES6 开始我们已经看到了许多新的语言特性，这些特性让我们写出更加简洁且易读的代码。ES8 也不例外，在 ES8 中我们可以使用 Object.values 和 Object.entries 这两个方法来处理复杂的数据结构。在这篇文章中，我们将会学习如何使用这些方法，以及它们对前端领域的贡献。
Object.values 方法
ES8 中 Object.values 方法可以让我们将一个对象的所有值放到一个数组中。这个方法的语法如下所示：
Object.values(obj)
上述代码中，obj 是我们需要处理的对象。接下来，这个方法会返回一个由这个对象的所有值组成的数组。
这个方法的用处非常广泛。举个例子，我们可以使用 Object.values 来统计一个对象中某个值的出现次数：
-- -------------------- ---- -------
----- --- - - -- -- -- -- -- -- -- - -
----- --------- - ------------------
----- ----- - ---------------------- ----- -- -
-- ----------- -
-----------
- ---- -
--------- - -
-
------ ---
-- ---
------------------ -- --- -- -- -- -- --上述代码中，我们首先使用 Object.values 方法将 obj 的所有值放到一个数组中。然后我们使用 reduce 方法对这个数组进行处理，获得一个对象，该对象记录了每个值出现的次数。
需要注意的是，Object.values 方法只会遍历对象的 值，而不是键。
Object.entries方法
ES8 中 Object.entries 方法可以让我们将一个对象转化为一个由键值对组成的二维数组。这个方法的语法如下所示：
Object.entries(obj)
上述代码中，obj 是我们需要处理的对象。接下来，这个方法会返回一个二维数组，其中每个子数组的第一个元素代表一个键，第二个元素代表这个键对应的值。
我们同样可以举一个例子来说明这个方法的使用：
const obj = { a: 1, b: 2, c: 3 }
const entriesArr = Object.entries(obj)
console.log(entriesArr)
// [['a', 1], ['b', 2], ['c', 3]]上述代码中，Object.entries 方法返回了一个由子数组组成的二维数组，其中每个子数组的第一个元素代表一个键，第二个元素代表这个键对应的值。
需要注意的是，Object.entries 方法只会遍历对象的 键值对，而不是第一种 Object.values 遍历的值。
在实际开发中的使用
Object.values 和 Object.entries 这两个方法在实际开发中的使用非常广泛。举几个例子：
- 我们可以使用
Object.values方法来获得一个对象中所有值的数组表示，并进一步使用reduce方法处理这个数组。 Object.entries方法可以让我们非常方便地遍历一个数组，因为我们无需再使用for循环语句去遍历数组中的每个元素了。- 我们可以使用
Object.entries方法来将一个对象转化为一个 URL 查询字符串。
总之，Object.values 和 Object.entries 这两个方法非常方便实用，可以让我们更好地处理复杂的数据结构。
总结
在本文中，我们学习了 ES8 中的 Object.values 和 Object.entries 方法，并且详细讲解了它们的使用方法和实际应用场景。希望能对您在实际的开发工作中有所帮助。
-- -------------------- ---- -------
-- ------------- --
----- -------- - -
----- -------
---- ---
---- ---------
-------- ----
-
----- -------------- - -----------------------
--------------------------- -- -------- --- --------- -----
----- --- - - -- -- -- -- -- -- -- - -
----- --------- - ------------------
----- ----- - ---------------------- ----- -- -
-- ----------- -
-----------
- ---- -
--------- - -
-
------ ---
-- ---
------------------ -- --- -- -- -- -- --
-- -------------- --
----- -------- - -
----- -------
---- ---
---- ---------
-------- ----
-
----- --------------- - ------------------------
----------------------------
-- --------- -------- ------- ---- ------- ---------- ----------- ------
----- ----------- - -------------------------- ------- -- -
------ ---------------------------------------------------------
------------
------------------------
-- --------------------------------------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/647e927948841e9894e44a6c