JavaScript:如何迭代过滤数组?

标签 javascript

我希望能够使用一个或多个条件过滤数组。

考虑此示例数据和过滤条件:

var data = [
  {company: "Acme", fiscal_period: '01-2019', value: 10},
  {company: "Acme", fiscal_period: '02-2019', value: 15},
  {company: "Wonka", fiscal_period: '01-2019', value: 8},
  {company: "Wonka", fiscal_period: '02-2019', value: 11}
]

var filter = [{field: "company", value: "Acme"}]
console.log(myFilterFunction(data,filter));
// Desired output 
// [
//   {company: "Acme", fiscal_period: '01-2019', value: 10},
//   {company: "Acme", fiscal_period: '02-2019', value: 15}
// ]

// Now use two filters:
var filter = [{field: "company", value: "Acme"},{field: "fiscal_period", value: "01-2019"}]
console.log(myFilterFunction(data,filter);
// Desired output 
// [
//   {company: "Acme", fiscal_period: '01-2019', value: 10},
// ]

但是如何编写 myFilterFunction 呢?

我知道如何使其与静态过滤器一起使用:

myFilterFunction = function(data,filter){

  return data.filter(function(el){
    return el[filter.field] === filter.value;
  });

}

console.log(myFilterFunction(data,{field: "company", value: "Acme"});

但是如果我想要多个过滤器,如何使其动态工作?

最佳答案

将多个字段数据作为数组传递并使用 Array#every方法检查仅当所有返回值都为 true 时才返回 true 的所有过滤器。

myFilterFunction = function(data,filters){    
  return data.filter(function(el){
    return filters.every(filter => el[filter.field] === filter.value);
  });    
}

console.log(myFilterFunction(data,[{field: "company", value: "Acme"},{field: "value", value: 10}]));

var data = [{
    company: "Acme",
    fiscal_period: '01-2019',
    value: 10
  },
  {
    company: "Acme",
    fiscal_period: '02-2019',
    value: 15
  },
  {
    company: "Wonka",
    fiscal_period: '01-2019',
    value: 8
  },
  {
    company: "Wonka",
    fiscal_period: '01-2019',
    value: 11
  }
]

myFilterFunction = function(data, filters) {
  return data.filter(function(el) {
    return filters.every(filter => el[filter.field] === filter.value);
  });
}

console.log(myFilterFunction(data, [{
  field: "company",
  value: "Acme"
}, {
  field: "value",
  value: 10
}]));

使用 ES6 Destructuring parameterarrow function .

myFilterFunction = (data,filters) => {    
  return data.filter(el => filters.every(({ field, value }) => el[field] === value));    
}

var data = [{
    company: "Acme",
    fiscal_period: '01-2019',
    value: 10
  },
  {
    company: "Acme",
    fiscal_period: '02-2019',
    value: 15
  },
  {
    company: "Wonka",
    fiscal_period: '01-2019',
    value: 8
  },
  {
    company: "Wonka",
    fiscal_period: '01-2019',
    value: 11
  }
]


    myFilterFunction = (data,filters) => {    
      return data.filter(el => filters.every(({ field, value }) => el[field] === value));    
    }

console.log(myFilterFunction(data, [{
  field: "company",
  value: "Acme"
}, {
  field: "value",
  value: 10
}]));

关于JavaScript:如何迭代过滤数组?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55423459/

相关文章:

javascript - 如何让 jQuery UI 自动完成功能忽略标点符号,但显示它?

javascript - 完全禁用父元素的焦点

javascript - 使用 JQuery 悬停缩放 div

javascript - 我可以使用 JavaScript 字符串中的内容触发完整的网页重新加载吗?

javascript - ES6 : transfer nested array into array with objects using destructuring

javascript - 如何定位选择元素并应用自定义功能?

javascript - 在 Javascript/jQuery 中确定字符串的像素长度?

javascript - 在每个栏的右侧添加字符串文本。怎么做?

javascript - 管理多个JS文件的简单方法?

javascript - 单击时更改 li 元素上的背景