Javascript 按 X 值过滤答案

【问题标题】：Javascript filter by X valuesJavascript 按 X 值过滤
【发布时间】：2021-11-25 05:01:36
【问题描述】：

我有一个简单的 javascript 对象数组。

const obj = [ { id:1, color:'red' }, { id:2, color:'black' }, { id:3, color:'purple' }, { id:4, color:'grey' }, { id:5, color:'white' } ]

假设我有一个数组：colors = ['red','black']。

我想过滤 obj 但不喜欢这种方式 => obj.filter(o=>o.color==='black' || o.color==='red')。

这取决于颜色数组中有多少颜色...

【问题讨论】：

obj.filter(o => colors.includes(o.color))

标签： javascript arrays loops object javascript-objects

【解决方案1】：

您可以将filter() 与findIndex() 混合使用：

const obj = [ { id:1, color:'red' }, { id:2, color:'black' }, { id:3, color:'purple' }, { id:4, color:'grey' }, { id:5, color:'white' } ];

const colors = ['red','black'];


let ans = obj.filter(x => colors.indexOf(x.color) > -1);

console.log(ans);

let ans2 = obj.filter(x => colors.includes(x.color));

console.log(ans2);

【讨论】：

为什么不只是includes？
谢谢它对我有用
@JOo 当然。请考虑绿色勾选答案以接受它。考虑投票。
CherryDT 提到的你也可以使用includes

【解决方案2】：

这个可以处理多个条件。

const obj = [ { id:1, color:'red' }, { id:2, color:'black' }, { id:3, color:'purple' }, { id:4, color:'grey' }, { id:5, color:'white' } ]

document.getElementById("filter").addEventListener("click",function(){
  var terms=document.getElementById("term").value.split(' ');
  var filtered =[];
  obj.forEach(function(v){
    terms.forEach(function(t){
      if(v.color.includes(t)){
        filtered.push(v);
        return false;
      };
    });
  });
  
  console.log(filtered);
});

&lt;input type='text' id='term'&gt;&lt;button id='filter'&gt;Filter&lt;/button&gt;

【讨论】：

【解决方案3】：

将Array.includes 与Array.filter 一起使用

const obj = [ { id:1, color:'red' }, { id:2, color:'black' }, { id:3, color:'purple' }, { id:4, color:'grey' }, { id:5, color:'white' } ];
const colors = ['red','black'];
const output = obj.filter(node => colors.includes(node.color));
console.log(output);

【讨论】：