在 ES8 中,新增了两个非常实用的方法,分别是 Object.values()
和 Object.entries()
。这两个方法可以帮助我们更加方便地操作对象。在本篇文章中,我们将会深入探究这两个方法的用途、特性以及使用方法。
Object.values()
Object.values()
方法返回一个数组,包含了对象中所有可枚举属性的值。这个数组的顺序与 for...in
循环遍历时的顺序相同。这个方法可以很方便地帮助我们获取一个对象中的所有属性值,而不需要手动遍历对象。
示例代码:
const obj = { a: 1, b: 2, c: 3} const values = Object.values(obj) console.log(values) // [1, 2, 3]
在上面的代码中,Object.values(obj)
返回了一个数组 [1, 2, 3]
,包含了对象中所有可枚举属性的值。
在实际开发中,Object.values()
方法经常被用于过滤对象中的属性值。例如,我们可以通过一下代码来获取对象中所有值为 true
的属性:
const obj = { a: true, b: false, c: true } const trueValues = Object.values(obj).filter(value => value === true) console.log(trueValues) // [true, true]
在上面的代码中,Object.values(obj)
返回一个数组 [true, false, true]
。我们使用 Array.prototype.filter()
方法来过滤数组中所有为 true
的元素,最终得到了一个值为 [true, true]
的数组,其中只包含了对象中值为 true
的属性。
Object.entries()
Object.entries()
方法返回一个数组,包含了对象中所有可枚举属性的键值对数组。这个数组中每个元素都是一个包含两个元素的数组,第一个元素是属性名,第二个元素是属性值。
示例代码:
const obj = { a: 1, b: 2, c: 3 } const entries = Object.entries(obj) console.log(entries) // [ ["a", 1], ["b", 2], ["c", 3] ]
在上面的代码中,Object.entries(obj)
返回了一个数组 [ ["a", 1], ["b", 2], ["c", 3] ]
,包含了对象中所有可枚举属性的键值对数组。
在实际开发中,Object.entries()
方法经常被用于对象的拷贝。我们可以通过一下代码实现对象的浅拷贝:
const obj = { a: 1, b: 2, c: 3 } const copy = Object.fromEntries(Object.entries(obj)) console.log(copy) // { a: 1, b: 2, c: 3 }
在上面的代码中,我们通过 Object.entries(obj)
获取对象的键值对数组,再通过 Object.fromEntries()
方法将其转换成一个新的对象,从而实现了对象的浅拷贝。
总结
Object.values()
和 Object.entries()
方法可以帮助我们更加方便地操作对象。Object.values()
方法返回一个数组,包含了对象中所有可枚举属性的值;Object.entries()
方法返回一个数组,包含了对象中所有可枚举属性的键值对数组。在实际开发中,这两个方法有着广泛的应用场景,可以帮助我们更加高效地操作对象,提高代码的可读性和可维护性。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/64e3635ff6b2d6eab3ed884c