如何在JavaScript中过滤一个对象

2,033 阅读3分钟

简介

ObjectJavaScript的对象不像数组或字符串那样可以迭代,所以我们不能直接在一个filter() 方法。filter() 允许我们在一个数组中迭代,只返回该数组中符合特定条件的项目,并将其放入一个新的数组中。

在这篇文章中,我们将探讨如何利用JavaScript中的键来过滤一个对象。

一个对象本质上是一个属性和它们的值的映射。这个键值对集合就是一个对象内容。我们自然可以单独提取键和值。

键是用Object.keys() ,而值是用Object.values() 。要同时提取键和值,你可以选择使用Object.entries() 。在这篇文章中,我们只关注键值,以便根据某些标准过滤键值。

使用*Object.keys()*来过滤一个对象

Object.keys() 方法被用来生成一个数组,其元素是包含对象属性**名称(key)**的字符串。该对象被作为参数传给Object.keys()

Object.keys(objectName);

例如,假设我们有一个用户在不同科目中得分的对象。

const userScores = {
    chemistry: 60,
    mathematics: 70,
    physics: 80,
    english: 98
};

我们可以循环浏览该对象并获取键值,对于这个例子来说,键值就是科目。

const names = Object.keys(userScores);
console.log(names); // ["chemistry","mathematics","physics","english"]

在你生成了键之后,你可以使用filter() ,在现有的值中循环,只返回那些符合指定标准的值。最后,你可以使用reduce() ,将过滤后的键和它们的值收集到一个新的对象中,比如说。

注意: filter() 是很好的与其他函数式方法连锁的方法!

假设我们有一个对象,并且我们想只返回键值中含有 "name "的键值对。

const user = {
    firstName: "John",
    lastName: "Doe",
    userName: "johndoe12",
    email: "johndoe@stackabuse.com",
    age: 37,
    hobby: "Singing"
};

我们可以通过使用Objects的键来进行过滤。

const names = Object.keys(user)
    .filter((key) => key.includes("Name"))
    .reduce((obj, key) => {
        return Object.assign(obj, {
          [key]: user[key]
        });
  }, {});

console.log(names);

我们利用Object.keys(user) ,将所有的键生成为一个数组,从而得到一个数组。

["firstName","lastName","userName","email","age","hobby"]

然后,我们使用数组函数includes() 作为标准,在filter() 方法中,翻阅数组中的每个元素,以确定是否有任何键包含 "姓名 "一词。

["firstName","lastName","userName"]

然后,我们使用reduce() ,将数组缩小为一个对象。

注意: reduce() 函数接受两个参数:一个对象作为第一个参数(身份),当前迭代值作为第二个参数。

我们正在使用Object.assign() ,将源对象合并到正在生成的新对象中的一个目标对象。Object.assign() 函数接收正在构建的Object ,并添加我们传递给它的当前键值对。

而在这个结束时--我们有一个新的对象,通过键值过滤。

{ firstName: 'John', lastName: 'Doe', userName: 'johndoe12' }

按键过滤对象阵列

通常情况下,我们要处理的对象是以数组的形式排序的。过滤每个对象和过滤一个对象一样简单--我们只需在数组中迭代并应用相同的步骤。

const users = {
    John: { username: 'johncam112', age:19 },
    Daniel: { key: 'Dandandel1', age:21 },
    Ruth: { key: 'rutie01', age:24 },
    Joe: { key: 'Joemathuel', age:28 }
};

const selectedUsers = ['Ruth', 'Daniel'];

const filteredUsers = Object.keys(users)
    .filter(key => selectedUsers.includes(key))
    .reduce((obj, key) => {
        obj[key] = users[key];
        return obj;
  }, {});

console.log(filteredUsers);

在上面的例子中,我们过滤了Users对象,只返回selectedUsers 的对象,按键过滤。

{
    Daniel: {
        key:"Dandandel1",
        age:21
},
    Ruth: {
        key:"rutie01",
        age:24
    }
}

结论

在这篇短文中--我们看了一下按值过滤对象,使用Object.keys() 方法,通过filter() 方法进行过滤。