在 ES7 中使用 Object.entries 方法遍历对象属性
ES7 中引入了 Object.entries 方法，该方法能够便捷地遍历对象的所有属性，返回一个由键值对组成的数组，数组中每个元素都是一个包含属性名称和对应属性值的数组。本文将详细介绍 Object.entries 方法的使用以及应用。
Object.entries 方法的语法如下：
-------------------
其中，obj 表示要遍历的对象。该方法返回一个包含键值对数组的数组，例如：
----- --- - - ---- ------ ---- -- -- --------------------------------- -- -- -------- ------- ------- ----
Object.entries 方法的返回值是一个二维数组，第一维数组中的每个元素是一个由属性名和属性值组成的一维数组。通过这种方式，我们可以快速遍历一个对象的所有属性。
接下来，我们将演示如何使用 Object.entries 方法。
遍历对象属性
假设我们要遍历一个对象：
----- ------ - - ---------- ------- --------- ------ ---- -- --
我们可以使用 Object.entries 方法遍历该对象的所有属性，示例如下：
------------------------------------- ------- -- - -------------------- ----------- ---
以上代码中，forEach 方法遍历 Object.entries 返回的数组，每个元素都是一个包含属性名和属性值的数组，我们用解构赋值将其拆解成 key 和 value 两个变量，然后打印出属性名和属性值。
该代码运行结果如下：
---------- ---- --------- --- ---- --
使用 Object.entries 方法过滤对象属性
我们还可以使用 Object.entries 方法结合数组的 filter 方法实现对对象属性的过滤，示例如下：
----- ------ - - ---------- ------- --------- ------ ---- -- -- ----- -------- - ------------------------------------ ------- -- --- --- ------------- ---------------------- -- -- -------------- --------
以上代码中，我们使用数组的 filter 方法过滤出属性名为 firstName 的键值对。
使用 Object.entries 方法将对象转为数组
Object.entries 方法还可以将一个对象转为数组，可以方便地对对象进行排序、过滤等操作。示例如下：
----- ------ - - ---------- ------- --------- ------ ---- -- -- ----- --- - ----------------------- ----------------- -- -- -------------- -------- ------------ ------- ------- ----
以上代码中，我们使用 Object.entries 方法将 person 对象转为一个键值对数组。
ES7 中 Object.entries 的兼容性
Object.entries 方法是在 ES2017 （ES7）中引入的，因此在不支持 ES7 的环境中无法使用该方法。
不过，可以使用 polyfill 实现对 Object.entries 方法的支持。polyfill 是一段代码，可以模拟浏览器对某个 API 的支持，实现对浏览器的兼容性解决方案。Object.entries 的 polyfill 代码如下：
-- ----------------- -
-------------- - ------------- -
----- -------- - -----------------
--- - - ----------------
----- -------- - --- --------- -- ----------- --- -----
----- ----- -
----------- - ------------- ------------------
-
------ ---------
--
-以上代码中，当浏览器不支持 Object.entries 方法时，我们使用 Object.keys 方法获取对象的所有属性名，用 for 循环遍历属性名数组，以键值对的形式存储到返回数组中，最终返回一个包含所有键值对的数组。
总结
本文介绍了 ES7 中引入的 Object.entries 方法的用法和应用，我们可以使用该方法快速遍历对象属性、过滤对象属性、将对象转为数组等。当浏览器不支持该方法时，我们可以使用 polyfill 实现对其的支持。在实际项目中，掌握 Object.entries 方法可以提高我们的开发效率，减少代码量。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/64d1e40cb5eee0b52593a519