在 ECMAScript 2017 中，新增了 Object.entries 和 Object.values 方法，这两个方法都是用来操作对象的。本文将详细介绍这两个方法的使用及其在前端开发中的应用。
Object.entries 方法
Object.entries 方法返回一个给定对象自身可枚举属性键值对的数组。数组中的每个元素都是一个数组，第一个元素是属性的键名，第二个元素是属性的键值。这个方法的语法如下：
Object.entries(obj)
其中，obj 是一个对象。
下面是一个例子：
const obj = { foo: 'bar', baz: 42 };
console.log(Object.entries(obj)); // [['foo', 'bar'], ['baz', 42]]在上面的例子中，Object.entries 方法返回了一个数组，其中包含了 obj 对象的所有可枚举属性的键值对。
Object.entries 方法还可以用于遍历对象。例如：
const obj = { foo: 'bar', baz: 42 };
for (const [key, value] of Object.entries(obj)) {
console.log(`${key}: ${value}`);
}
// 输出：
// foo: bar
// baz: 42在上面的例子中，我们使用了解构赋值来获取 Object.entries 方法返回的数组中的每个元素的第一个和第二个值，即属性的键名和键值。然后我们使用这些值来输出属性的键名和键值。
Object.values 方法
Object.values 方法返回一个给定对象自身可枚举属性的所有值的数组。这个方法的语法如下：
Object.values(obj)
其中，obj 是一个对象。
下面是一个例子：
const obj = { foo: 'bar', baz: 42 };
console.log(Object.values(obj)); // ['bar', 42]在上面的例子中，Object.values 方法返回了一个数组，其中包含了 obj 对象的所有可枚举属性的值。
Object.values 方法也可以用于遍历对象。例如：
const obj = { foo: 'bar', baz: 42 };
for (const value of Object.values(obj)) {
console.log(value);
}
// 输出：
// bar
// 42在上面的例子中，我们使用了 for...of 循环来遍历 Object.values 方法返回的数组中的每个元素，即属性的值。然后我们使用这些值来输出属性的值。
应用
Object.entries 和 Object.values 方法在前端开发中有很多应用场景。下面是一些例子：
遍历对象
我们可以使用 Object.entries 方法来遍历对象的属性，使用 Object.values 方法来遍历对象的属性值。
-- -------------------- ---- ------- ----- --- - - ---- ------ ---- -- -- --- ------ ----- ------ -- -------------------- - -------------------- ----------- - -- --- -- ---- --- -- ---- -- --- ------ ----- -- ------------------- - ------------------- - -- --- -- --- -- --
判断对象是否为空
我们可以使用 Object.entries 方法来判断一个对象是否为空。如果 Object.entries 方法返回的数组的长度为 0，那么这个对象就是空的。
function isEmpty(obj) {
return Object.entries(obj).length === 0;
}
const obj1 = {};
const obj2 = { foo: 'bar', baz: 42 };
console.log(isEmpty(obj1)); // true
console.log(isEmpty(obj2)); // false在上面的例子中，我们定义了一个 isEmpty 函数，这个函数接受一个对象作为参数，如果这个对象为空，就返回 true，否则返回 false。我们使用 Object.entries 方法来判断对象是否为空。
将对象转换为 Map
我们可以使用 Object.entries 方法将一个对象转换为 Map。Map 是一种键值对的集合，可以用来存储任意类型的值。
const obj = { foo: 'bar', baz: 42 };
const map = new Map(Object.entries(obj));
console.log(map); // Map { 'foo' => 'bar', 'baz' => 42 }在上面的例子中，我们使用 Object.entries 方法将 obj 对象转换为一个数组，然后将这个数组作为参数传递给 Map 构造函数，从而将 obj 对象转换为 Map。
结论
Object.entries 和 Object.values 方法是 ECMAScript 2017 中新增的两个方法，用来操作对象。它们可以用于遍历对象、判断对象是否为空、将对象转换为 Map 等场景。在前端开发中，我们可以灵活地应用这两个方法来提高效率和代码质量。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/674134aad40a3cb159e9b473