JS ES10 | Object.fromEntries() 和 Object.entries() 崭露头角

JS ES10 | Object.fromEntries() 和 Object.entries() 崭露头角

在JS ES10中，有两个非常实用的新函数 Object.fromEntries() 和 Object.entries()，分别用于将对象转化为一个包含键-值对的数组和将一个键-值对的数组转化为一个对象。这两个函数的使用不仅简化了操作，而且可以帮助我们更好地管理和处理数据。

Object.entries()

Object.entries() 函数可以将一个对象转化为一个包含所有键值对的二维数组，键名将变为数组中的第一项，键值将变为数组中的第二项。例如：

const person = { name: 'Jay', age: 21, gender: 'male' };
const entries = Object.entries(person);
console.log(entries);

上述代码输出结果为：

[ ['name', 'Jay'], ['age', 21], ['gender', 'male'] ]

可以看出，Object.entries()将person转化为一个包含三个数组的二维数组，并按照键名-键值的顺序排列，可以轻松地遍历和处理数据。

Object.fromEntries()

Object.fromEntries() 则相反，它可以将一个二维数组转化为对象。它接受的参数必须是一个键值对的数组，其中每个元素为一个长度为2的数组，第一个元素代表键名，第二个元素代表键值。例如：

const entries = [ ['name', 'Jay'], ['age', 21], ['gender', 'male'] ];
const person = Object.fromEntries(entries);
console.log(person);

上述代码输出结果为：

{ name: 'Jay', age: 21, gender: 'male' }

可以看出，Object.fromEntries() 将一个二维数组转化为一个对象，方便操作和管理数据。

Object.entries() 和 Object.fromEntries() 的运用

Object.entries() 和 Object.fromEntries() 可以一起使用，将一个对象的键值对按照某种规则重新排序并生成新的对象。例如，下面的示例将一个对象的键值对中的键名转化为小写字母，并按照键名排序生成新的对象：

const person = { Name: 'Jay', Age: 21, Gender: 'male' };
const entries = Object.entries(person).sort(([a], [b]) => a.localeCompare(b)).map(([key, value]) => [key.toLowerCase(), value]);
const newPerson = Object.fromEntries(entries);

console.log(newPerson);

上述代码输出结果为：

{ age: 21, gender: 'Male', name: 'Jay' }

可以看出，Object.entries() 将 person 对象转化为一个键值对的二维数组，然后使用 Array.sort() 函数按照键名排序，最后使用 map() 函数将键名转化为小写字母，并将排序后的键值对转化为一个新的数组。最后利用 Object.fromEntries() 将数组转化为新的对象。

总结

Object.entries() 和 Object.fromEntries() 是新的 ES10 函数，提供了强大的功能，可用于将对象转化为数组、将数组转化为对象、重新排序对象的键值对等。它们的使用简单清晰，且有深度，可以帮助我们更好地管理和处理数据。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6453049b968c7c53b0778c71