使用ES新特性过滤JS对象中不需要的属性

在一些场景需要过滤 js 对象中的属性，以前我的处理方式是使用Object.keys、filter等一些方法配合处理，代码比较蠢，大概是这样的：let course = {math: 89,chinese: 68,english: 82}需要过滤分数大于80分的属性let arr = []let obj = {}arr = Object.keys(course).filter(key=> c

烂不烂問厨房

6497人浏览 · 2021-12-30 10:09:47

烂不烂問厨房 · 2021-12-30 10:09:47 发布

在一些场景需要过滤 js 对象中的属性，以前我的处理方式是使用Object.keys、filter等一些方法配合处理，代码比较蠢，大概是这样的：

let course = {
	math: 89,
	chinese: 68,
	english: 82
}

需要过滤分数大于80分的属性

let arr = []
let obj = {}
arr = Object.keys(course).filter(key=> course[key] > 80)
arr.forEach(key=> {
	obj[key] = course[key]
})
console.log(obj) //{math: 89, english: 82}

接下来介绍另一种解决方案，相对来说更加的便捷且稳定
使用ES8的Object.entries()以及ES10的Object.fromEntries()

Object.entries()：返回一个数组，成员是参数对象自身所有可遍历属性的键值对数组
个人理解：就是二维数组，里面的每一项都是由对象的key、value组成的数组

const obj = {
	name: '张三',
	age: 18
}
console.log(Object.entries(obj))
// [['name', '张三'], ['age', 18]]

Object.fromEntries(): 就是把键值对列表转换为对象，这个键值对就是Object.entries()生成的

Object.fromEntries([['name', '张三'], ['age', 18]])
// {name: '张三', age: 18}

有了这两个方法就可以更便捷的实现对象过滤了，具体实现如下：

const res = Object.entries(course).filter(([key, val]) => val > 80)
const objRes = Object.fromEntries(res)
console.log(objRes)
// {math: 89, english: 82}