在 ES7 中,JavaScript 增加了两个新的 Object 方法,分别是 Object.values() 方法和 Object.entries() 方法。这两个方法都是用来获取对象中属性值的方法,但是它们有一些不同之处。本文将详细讲解这两个方法的异同点以及它们的使用方法和指导意义。
Object.values() 方法
Object.values() 方法用于返回一个对象中所有属性值的数组。它的语法如下:
Object.values(obj)
其中,obj 表示要获取属性值的对象。该方法返回的是一个数组,数组中包含了 obj 对象中所有属性的值。如果 obj 对象中没有任何属性,那么该方法将返回一个空数组。
下面是一个示例代码:
const obj = { a: 1, b: 2, c: 3 }; const values = Object.values(obj); console.log(values); // [1, 2, 3]
Object.entries() 方法
Object.entries() 方法用于返回一个对象中所有属性的键值对数组。它的语法如下:
Object.entries(obj)
其中,obj 表示要获取属性键值对的对象。该方法返回的是一个数组,数组中包含了 obj 对象中所有属性的键值对。每个键值对都是一个由两个元素组成的数组,第一个元素是属性名,第二个元素是属性值。如果 obj 对象中没有任何属性,那么该方法将返回一个空数组。
下面是一个示例代码:
const obj = { a: 1, b: 2, c: 3 }; const entries = Object.entries(obj); console.log(entries); // [['a', 1], ['b', 2], ['c', 3]]
异同点
Object.values() 方法和 Object.entries() 方法都是用来获取对象中属性值的方法,但它们有以下不同点:
- 返回值类型不同
Object.values() 方法返回的是一个包含属性值的数组,而 Object.entries() 方法返回的是一个包含键值对数组的数组。
- 数组元素类型不同
Object.values() 方法返回的数组元素是属性值,而 Object.entries() 方法返回的数组元素是键值对数组。
- 使用场景不同
Object.values() 方法适用于需要获取对象属性值的场景,而 Object.entries() 方法适用于需要获取对象属性键值对的场景。
指导意义
Object.values() 方法和 Object.entries() 方法可以帮助我们更方便地获取对象中的属性值和属性键值对。在实际开发中,我们可以根据具体的需求来选择使用哪个方法。
例如,在需要对对象属性值进行操作的场景中,我们可以使用 Object.values() 方法来获取属性值数组,然后对数组进行操作。而在需要对对象属性键值对进行操作的场景中,我们可以使用 Object.entries() 方法来获取键值对数组,然后对数组进行操作。
下面是一个使用 Object.entries() 方法的示例代码:
const obj = { a: 1, b: 2, c: 3 }; const entries = Object.entries(obj); for (const [key, value] of entries) { console.log(`${key}: ${value}`); } // a: 1 // b: 2 // c: 3
该代码通过 Object.entries() 方法获取了 obj 对象中的键值对数组,然后使用 for...of 循环遍历数组,输出了每个属性的键和值。
总结
Object.values() 方法和 Object.entries() 方法都是用来获取对象中属性值的方法,它们有一些不同之处,使用场景也不同。我们可以根据具体的需求来选择使用哪个方法。在实际开发中,我们可以通过这两个方法更方便地对对象进行操作。
来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/655186e2d2f5e1655db44994