JavaScript中根据一个数组对象过滤另一个数组对象

在写项目中遇到一个问题，就是根据一个对象数组去获取另一个对象数组中的值

假设现在有以下两个对象数组

let arr1 = [
    { id: 1, name: '张三', age: 20, hobby: ['吃饭', '睡觉', '打豆豆'] },
    { id: 2, name: '李四', age: 21, hobby: ['吃饭', '睡觉', '打豆豆'] },
    { id: 3, name: '王五', age: 22, hobby: ['吃饭', '睡觉', '打豆豆'] },
    { id: 4, name: '赵六', age: 23, hobby: ['吃饭', '睡觉', '打豆豆'] }
]
let arr2 = [
    { id: 3, name: '王五' },
    { id: 4, name: '赵六' }
]

预期的输出应该是下面这样

[
    { id: 3, name: '王五', age: 22, hobby: ['吃饭', '睡觉', '打豆豆'] },
    { id: 4, name: '赵六', age: 23, hobby: ['吃饭', '睡觉', '打豆豆'] }
]

示例

一、根据arr2中的 id 获取arr1相同 id 的信息

let arr = arr1.filter( item => {
    return arr2.find( prop => {
        return prop.id == item.id
    })
})

console.log(arr)
// 输出结果
[
  { id: 3, name: '王五', age: 22, hobby: [ '吃饭', '睡觉', '打豆豆' ] },
  { id: 4, name: '赵六', age: 23, hobby: [ '吃饭', '睡觉', '打豆豆' ] }
]

可以看出输出结果和我们预期的是一样的

二、获取arr1中不包含arr2的 id 字段的信息

let arr = arr1.filter( item => {
    return !arr2.find( prop => {
        return prop.id == item.id
    })
})

console.log(arr)
// 输出结果
[
  { id: 1, name: '张三', age: 20, hobby: [ '吃饭', '睡觉', '打豆豆' ] },
  { id: 2, name: '李四', age: 21, hobby: [ '吃饭', '睡觉', '打豆豆' ] }
]

可以看出示例二与示例一的结果刚好相反

以上就是对象数组的过滤方法，简单记录下~

于2022/4/19 23:50