JavaScript过滤对象数组

Question

我有一个对象数组，想知道最佳的搜索方法。给定下面的例子，如何搜索name = "Joe"和age < 30？jQuery是否有帮助，还是我必须自己暴力搜索？

var names = new Array();

var object = { name : "Joe", age:20, email: "[e-mail]"};
names.push(object);

object = { name : "Mike", age:50, email: "[e-mail]"};
names.push(object);

object = { name : "Joe", age:45, email: "[e-mail]"};
names.push(object);

- user441521

---

你的意思是搜索还是筛选？ - joragupra

搜索（search）和过滤（filter）不同，您需要哪一个？ - T.J. Crowder

Answer 1

使用Array.prototype.filter()的现代解决方案：

const found_names = names.filter(v => v.name === "Joe" && v.age < 30);

或者，如果您仍在使用jQuery，则可以使用jQuery.grep()：

var found_names = $.grep(names, function(v) {
    return v.name === "Joe" && v.age < 30;
});

- VisioN

Answer 2

使用[].filter方法非常容易实现：

var filterednames = names.filter(function(obj) {
    return (obj.name === "Joe") && (obj.age < 30);
});

您可以在此 MDN 页面上了解更多相关信息。

- lonesomeday

Answer 3

var nameList = [
{name:'x', age:20, email:'[e-mail]'},
{name:'y', age:60, email:'[e-mail]'},
{name:'Joe', age:22, email:'[e-mail]'},
{name:'Abc', age:40, email:'[e-mail]'}
];

var filteredValue = nameList.filter(function (item) {
      return item.name == "Joe" && item.age < 30;
});

//To See Output Result as Array
console.log(JSON.stringify(filteredValue));

你可以简单地使用JavaScript :)

- Fakhrul Hasan

Answer 4

您可以使用jQuery.filter()函数从匹配元素的子集中返回元素。

var names = [
    { name : "Joe", age:20, email: "[e-mail]"},
    { name : "Mike", age:50, email: "[e-mail]"},
    { name : "Joe", age:45, email: "[e-mail]"}
   ];
   
   
var filteredNames = $(names).filter(function( idx ) {
    return names[idx].name === "Joe" && names[idx].age < 30;
}); 

$(filteredNames).each(function(){
     $('#output').append(this.name);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="output"/>

- Vadim Gremyachev

Answer 5

针对希望使用任何键过滤对象数组的人：

function filterItems(items, searchVal) {
  return items.filter((item) => Object.values(item).includes(searchVal));
}
let data = [
  { "name": "apple", "type": "fruit", "id": 123234 },
  { "name": "cat", "type": "animal", "id": 98989 },
  { "name": "something", "type": "other", "id": 656565 }]


console.log("Filtered by name: ", filterItems(data, "apple"));
console.log("Filtered by type: ", filterItems(data, "animal"));
console.log("Filtered by id: ", filterItems(data, 656565));

从一个JSON对象数组中筛选：

- Arun Saini

Answer 6

var names = [{
        name: "Joe",
        age: 20,
        email: "[e-mail]"
    },
    {
        name: "Mike",
        age: 50,
        email: "[e-mail]"
    },
    {
        name: "Joe",
        age: 45,
        email: "[e-mail]"
    }
];
const res = _.filter(names, (name) => {
    return name.name == "Joe" && name.age < 30;

});
console.log(res);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.js"></script>

- Parth Raval

Answer 7

快速问题。如果您有两个对象数组，并且希望'对齐'这些对象数组，以便确保每个数组的对象与另一个数组的顺序相同，该怎么办？如果您不知道数组中任何对象包含的键和值...更不用说它们甚至是什么顺序了？

因此，您需要为 [].filter ， [].map 等获取'通配符表达式'。如何获取通配符表达式？

var jux = (function(){
    'use strict';

    function wildExp(obj){
        var keysCrude = Object.keys(obj),
            keysA = ('a["' + keysCrude.join('"], a["') + '"]').split(', '),
            keysB = ('b["' + keysCrude.join('"], b["') + '"]').split(', '),
            keys = [].concat(keysA, keysB)
                .sort(function(a, b){  return a.substring(1, a.length) > b.substring(1, b.length); });
        var exp = keys.join('').split(']b').join('] > b').split(']a').join('] || a');
        return exp;
    }

    return {
        sort: wildExp
    };

})();

var sortKeys = {
    k: 'v',
    key: 'val',
    n: 'p',
    name: 'param'
};
var objArray = [
    {
        k: 'z',
        key: 'g',
        n: 'a',
        name: 'b'
    },
    {
        k: 'y',
        key: 'h',
        n: 'b',
        name: 't'
    },
    {
        k: 'x',
        key: 'o',
        n: 'a',
        name: 'c'
    }
];
var exp = jux.sort(sortKeys);

console.log('@juxSort Expression:', exp);
console.log('@juxSort:', objArray.sort(function(a, b){
    return eval(exp);
}));

你也可以对每个对象进行迭代来使用此函数，为每个对象的所有键创建更好的集合表达式，然后以此方式过滤数组。

这是API Juxtapose中的一个小片段，我几乎已经完成了。它实现了对象等价性（带例外），对象联合和数组压缩。如果你的项目需要或想要这些功能，请在评论中提出，我会尽快使库可用。

希望这有所帮助！ Happy coding :)

- Cody

Answer 8

最简单和易读的方法是使用本地JavaScript过滤器方法。

本地JavaScript过滤器采用声明性方法来过滤数组元素。由于它是在Array.prototype上定义的方法，因此它会遍历提供的数组并调用回调函数。这个回调函数充当我们的过滤函数，它有三个参数：

element-正在迭代的数组中的当前项

index-正在迭代的数组中当前元素的索引或位置

array-应用了过滤器方法的原始数组

让我们在一个例子中使用这个过滤器方法。请注意，过滤器可以应用于任何类型的数组。在这个例子中，我们将根据对象属性过滤对象数组。

基于对象属性过滤对象数组的示例可能如下所示：

// Please do not hate me for bashing on pizza and burgers.
// and FYI, I totally made up the healthMetric param :)
let foods = [
  { type: "pizza", healthMetric: 25 },
  { type: "burger", healthMetric: 10 },
  { type: "salad", healthMetric: 60 },
  { type: "apple", healthMetric: 82 }
];
let isHealthy = food => food.healthMetric >= 50;

const result = foods.filter(isHealthy);

console.log(result.map(food => food.type));
// Result: ['salad', 'apple']

想要了解如何在函数中过滤数组并构建自己的过滤器，请查看此文章： https://medium.com/better-programming/build-your-own-filter-e88ba0dcbfae

- Kasra Khosravi