在ES6和ES8中，Javascript世界已经引入了Object.entries()和Object.values()方法来帮助前端开发人员处理对象的键值对。现在，ES10中又新增了一个新方法，叫做Object.fromEntries()。本文将详细介绍它们的用法和区别，以及深入探究它们的学习和指导意义。
Object.entries()和Object.values()
在介绍Object.fromEntries()之前，我们先来看看它的前身Object.entries()和Object.values()。这两个方法在ES6中被引入，用来获取对象的键值对和对应的值。例如：
-- -------------------- ---- -------
----- --- - -
----- --------
---- ---
------- --------
--
---------------------------------
-- ------- --------- --------- ------- ---- ---------- ----------
--------------------------------
-- ------- --------- --- ---------你会发现Object.entries()可以返回一个数组，其中包含对象的每个属性的键值对，而Object.values()只返回对象所有属性的值。这两个方法可以帮助我们更加方便快捷地获取对象的内容，而不必再写出一堆循环语句。
Object.fromEntries()
Object.fromEntries()是ES10中新增的方法，它可以将由键值对数组组成的二维数组转换为一个对象。例如：
const arr = [['name', 'Alice'], ['age', 25], ['gender', 'female']];
console.log(Object.fromEntries(arr));
// output: {name: "Alice", age: 25, gender: "female"}与Object.entries()互为补充，当我们需要将二维数组转换为对象时，可以用Object.fromEntries()方法，而不必再采用手动构建对象的方式。
Object.fromEntries()的指导意义
从上面的例子我们可以发现，如果我们想要对一个对象进行深度拷贝并赋值另给一个变量名，那么原本顶层对象深度引用的属性（对象属性）在普通对象里的使用会遇到赋值一改全局的问题.也就是说，下面的代码是有“问题”的，并不符合我们的期望：
let obj = {name:'hello'}
let newObj = obj
newObj.name = 'world'
console.log(obj) // {name:'world'}用spread operator可以进行浅拷贝：
let obj = {name:'hello'}
let newObj = {...obj}
newObj.name = 'world'
console.log(obj) // {name:'hello'}
console.log(newObj) // {name:'world'}但是spread operator也拷贝不了对象属性。所以如下情况还是“改了一处，全局改了”：
let obj = {name:{lastname:'hello', firstname:'world'}}
let newObj = {...obj}
newObj.name.lastname = 'pig'
console.log(obj) // {name:{lastname:'pig', firstname:'world'}}
console.log(newObj) // {name:{lastname:'pig', firstname:'world'}}有了Object.fromEntries()：
let obj = {name:{lastname:'hello', firstname:'world'}}
let newObj = JSON.parse(JSON.stringify(Object.fromEntries(Object.entries(obj))))
newObj.name.lastname = 'pig'
console.log(obj) // {name:{lastname:'hello', firstname:'world'}}
console.log(newObj) // {name:{lastname:'pig', firstname:'world'}}也可以使用更深入的库帮助我们实现深拷贝的功能，例如lodash、immer等. 但是，当我们不想引入过多的库时，使用Object.fromEntries()可以高效、简便地实现对象的深度拷贝。
总结
- Object.entries()和Object.values()方法已经在ES6中引入，并成为了我们处理对象键值对和值的重要工具。
- Object.fromEntries()方法是ES10中新增的方法，可以将由键值对数组组成的二维数组转换为一个对象，从而实现对象的深度拷贝。
如果你对深入理解和学习ES6和ES10有兴趣，可以参考我写的笔记。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6451d6b8675af4061b59578e