具有多个条件的数组内的Javascript过滤数组答案

【问题标题】：Javascript filter array whitin array with multiple conditions具有多个条件的数组内的Javascript过滤数组
【发布时间】：2021-07-09 12:46:20
【问题描述】：

这是我从服务器得到的结果。

arrays= 
      [ 0: 
        { Id: 1
        , name: 'test1'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'disk_init_role',    type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 1: 
        { Id: 2
        , name: 'test2'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'disk_init',         type: 'generic' } 
          , { name: 'application_role',     value: 'initial',           type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 2:
        { Id: 3
        , name: 'test3'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'initial',           type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 3: 
        { Id: 4
        , name: 'test4'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'disk_init_role',    type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 5:
        { Id: 5
        , name: 'test5'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial_disk_init', type: 'generic' } 
          , { name: 'application_role',     value: 'disk_initial',      type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
          ] 
         } 
      ]

我需要用多个条件过滤它。

filters = {
  application_name: 'initial',
  application_role: 'disk_init_role'
}

我做了一个函数来过滤数据，但这仅适用于一个条件

  filterArray (array, filters) {
    for (var [key, value] of Object.entries(filters)) {
      const res = Object.values(array).filter(
        item => item.parameters.some(param => param.name === `${key}` && param.value === `${value}`)
      )

      return results

    }
}

循环遍历数组以便满足两个条件（过滤器）的最佳方法是什么？结果需要只有 id 1 和 4，并且需要在返回结果数组中。

【问题讨论】：

“这只适用于一个条件”是什么意思？如果只需要检查“名称”和“键”属性，我认为您的过滤功能没有任何问题

标签： javascript arrays loops

【解决方案1】：

这会将所有过滤器应用于每个数组元素。只有满足所有过滤条件时，才会将数组元素添加到结果数组中。

const arrays= [
  {
    "0": {
      "Id": 1,
      "name": "test1",
      "parameters": [
        {
          "name": "application_instance",
          "value": "home",
          "type": "generic"
        },
        {
          "name": "application_name",
          "value": "initial",
          "type": "generic"
        },
        {
          "name": "application_role",
          "value": "disk_init_role",
          "type": "generic"
        },
        {
          "name": "customer_environment",
          "value": "development",
          "type": "generic"
        },
        {
          "name": "customer_name",
          "value": "guest",
          "type": "generic"
        }
      ]
    }
  },
  {
    "1": {
      "Id": 2,
      "name": "test2",
      "parameters": [
        {
          "name": "application_instance",
          "value": "home",
          "type": "generic"
        },
        {
          "name": "application_name",
          "value": "disk_init",
          "type": "generic"
        },
        {
          "name": "application_role",
          "value": "initial",
          "type": "generic"
        },
        {
          "name": "customer_environment",
          "value": "development",
          "type": "generic"
        },
        {
          "name": "customer_name",
          "value": "guest",
          "type": "generic"
        }
      ]
    }
  },
  {
    "2": {
      "Id": 3,
      "name": "test3",
      "parameters": [
        {
          "name": "application_instance",
          "value": "home",
          "type": "generic"
        },
        {
          "name": "application_name",
          "value": "initial",
          "type": "generic"
        },
        {
          "name": "application_role",
          "value": "initial",
          "type": "generic"
        },
        {
          "name": "customer_environment",
          "value": "development",
          "type": "generic"
        },
        {
          "name": "customer_name",
          "value": "guest",
          "type": "generic"
        }
      ]
    }
  },
  {
    "3": {
      "Id": 4,
      "name": "test4",
      "parameters": [
        {
          "name": "application_instance",
          "value": "home",
          "type": "generic"
        },
        {
          "name": "application_name",
          "value": "initial",
          "type": "generic"
        },
        {
          "name": "application_role",
          "value": "disk_init_role",
          "type": "generic"
        },
        {
          "name": "customer_environment",
          "value": "development",
          "type": "generic"
        },
        {
          "name": "customer_name",
          "value": "guest",
          "type": "generic"
        }
      ]
    }
  },
  {
    "5": {
      "Id": 5,
      "name": "test5",
      "parameters": [
        {
          "name": "application_instance",
          "value": "home",
          "type": "generic"
        },
        {
          "name": "application_name",
          "value": "initial_disk_init",
          "type": "generic"
        },
        {
          "name": "application_role",
          "value": "disk_initial",
          "type": "generic"
        },
        {
          "name": "customer_environment",
          "value": "development",
          "type": "generic"
        },
        {
          "name": "customer_name",
          "value": "guest",
          "type": "generic"
        }
      ]
    }
  }
];
const filters = {
  application_name: 'initial',
  application_role: 'disk_init_role'
};

const result = arrays.filter((e) => {
  const parameters = e[Object.keys(e)[0]].parameters;
  let match = true;
  Object.keys(filters).forEach((f) => {
    const parameter = parameters.find((g) => g.name === f);
    match = match && parameter.value === filters[f];
  });
  return match;
});

console.log(result);

【讨论】：

【解决方案2】：

基本上，您正在寻找arrays 中的每个项目，每个项目都与您的filters 包含的内容相匹配。

为此，您可以在filters 上使用every 方法并尝试将find 与name 匹配并匹配value

const result = arrays.filter(item => {
   return Object.entries(filters)
                .every( ([key,value]) => item.parameters.find(p => p.name == key).value == value)
});

活生生的例子：

const arrays= 
      [  
        { Id: 1
        , name: 'test1'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'disk_init_role',    type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      ,  
        { Id: 2
        , name: 'test2'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'disk_init',         type: 'generic' } 
          , { name: 'application_role',     value: 'initial',           type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 
        { Id: 3
        , name: 'test3'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'initial',           type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      ,  
        { Id: 4
        , name: 'test4'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial',           type: 'generic' } 
          , { name: 'application_role',     value: 'disk_init_role',    type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
        ] } 
      , 
        { Id: 5
        , name: 'test5'
        , parameters: 
          [ { name: 'application_instance', value: 'home',              type: 'generic' } 
          , { name: 'application_name',     value: 'initial_disk_init', type: 'generic' } 
          , { name: 'application_role',     value: 'disk_initial',      type: 'generic' } 
          , { name: 'customer_environment', value: 'development',       type: 'generic' } 
          , { name: 'customer_name',        value: 'guest',             type: 'generic' } 
          ] 
         } 
      ]

const filters = {
  application_name: 'initial',
  application_role: 'disk_init_role'
}


const result = arrays.filter(item => {
   return Object.entries(filters).every( ([key,value]) => item.parameters.find(p => p.name == key).value == value)
});

console.log(result);

【讨论】：

感谢您的帮助，这似乎可行。 :-)

【解决方案3】：

如果您希望任何过滤条件匹配，请使用此代码

arr.filter(el => {
    const res = el.parameters.find(perameter => { 
        return filters[perameter.name] == perameter.value;
    });
    return !!res;
});

如果您希望所有过滤条件都匹配，请使用此代码。

arr.filter(el => {
    const res = el.parameters.filter(perameter => { 
        return filters[perameter.name] == perameter.value;
    });
    return res.length === Object.keys(filters).length;
});

【讨论】：

为什么不使用 some 和 every - 这就是它们的用途。
因为如果我们用some 和every 方法实现它，那么我们就使用了一个额外的循环，比如你的代码有3个循环，而我的代码有2个循环，我认为这效率不高。