Search by multiple values in object

Question

According to these answers, I should be able to search object by the multiple values.

How to find a value in a multidimensional object/array in Javascript?

Javascript: How to filter object array based on attributes?

Search multi-dimensional array JavaScript

Unfortunately filter() doesn't return anything. Same goes for jQuery's grep().

Google 5 pages, still can't find the solution.

Please help. Thanks

https://jsfiddle.net/4z90rvk3/

var itemPrices = {
        '1':  { 'catid': '1', 'typeid': '1', 'price': '1000' },
        '2':  { 'catid': '1', 'typeid': '2', 'price': '1000' },
        '3':  { 'catid': '1', 'typeid': '3', 'price': '1100' },
        '4':  { 'catid': '2', 'typeid': '1', 'price': '1000' },
        '5':  { 'catid': '2', 'typeid': '2', 'price': '1000' },
        '6':  { 'catid': '2', 'typeid': '3', 'price': '1100' },
        '7':  { 'catid': '3', 'typeid': '1', 'price': '1200' },
        '8':  { 'catid': '3', 'typeid': '2', 'price': '1200' },
        '9':  { 'catid': '3', 'typeid': '3', 'price': '1300' },
        '10':  { 'catid': '4', 'typeid': '1', 'price': '1200' },
        '11':  { 'catid': '4', 'typeid': '2', 'price': '1200' },
        '12':  { 'catid': '4', 'typeid': '3', 'price': '1300' },
    };

    var price = itemPrices.filter(function(item) { return item.typeid == 1 && item.catid == 2; });

    $('body').append(price);

`filter` is a function of `Array`. `itemPrices` is an object. — louisbros, Dec 07 '15 at 05:31
Possible duplicate of http://stackoverflow.com/questions/5072136/javascript-filter-for-objects You could try the method in the accepted answer. — David Fang, Dec 07 '15 at 05:34
you're not working with an array of objects.... just an object with objects. Check spec - https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter --- it expects an array — Brandt Solovij, Dec 07 '15 at 05:34
If you want it to work on object of objects u need to code a wrapper function, see the answer for the qn David Fang linked — softwarenewbie7331, Dec 07 '15 at 05:36
@softwarenewbie7331: Looks reasonable, could you provide an example with my case? — Alex G, Dec 07 '15 at 05:43
@Alex G is there a reason to keep the data structure you currently have? — louisbros, Dec 07 '15 at 05:46
@louisbros: yes, there are multiple sql tables dependent on this one — Alex G, Dec 07 '15 at 05:48
@AlexG If that's your only reason, do consider underscore and/or backbone to handle your sql objects. underscore notably provides useful functions like _.filter which does exactly what you want — softwarenewbie7331, Dec 07 '15 at 06:52

score 1 · Accepted Answer · edited May 23 '17 at 12:31

filter() function works only for array. So you need to make itemPrices an array. There are two ways to transform the object to an array:

The first one is, if you can change the object, add a length property to it and then use Array.prototype.slice.call(itemPrices) method to make it an array, check out the updated jsfiddle.

The second one is easier to understand:

var itemPrices = {
  '1':  { 'catid': '1', 'typeid': '1', 'price': '1000' },
  '2':  { 'catid': '1', 'typeid': '2', 'price': '1000' },
  '3':  { 'catid': '1', 'typeid': '3', 'price': '1100' },
  '4':  { 'catid': '2', 'typeid': '1', 'price': '1000' },
  '5':  { 'catid': '2', 'typeid': '2', 'price': '1000' },
  '6':  { 'catid': '2', 'typeid': '3', 'price': '1100' },
  '7':  { 'catid': '3', 'typeid': '1', 'price': '1200' },
  '8':  { 'catid': '3', 'typeid': '2', 'price': '1200' },
  '9':  { 'catid': '3', 'typeid': '3', 'price': '1300' },
  '10':  { 'catid': '4', 'typeid': '1', 'price': '1200' },
  '11':  { 'catid': '4', 'typeid': '2', 'price': '1200' },
  '12':  { 'catid': '4', 'typeid': '3', 'price': '1300' },
 };

var arr = [];

for (var item in itemPrices) {
  if (itemPrices.hasOwnProperty(item)) {
        arr.push(itemPrices[item])
  }
}

var price = arr.filter(function(item) { return item.typeid == 1 && item.catid == 2; });
 
console.log(price);

Reference:

Array.prototype.filter() - MDN

How does Array.prototype.slice.call work? - Stack Overflow

Sorry I don't understand you. Your object is not changed and a new array is created... Could you give me an example to make it clear? — iplus26, Dec 07 '15 at 05:57
Do I need to match `length: 12,` with the actual number of items in object? — Alex G, Dec 07 '15 at 06:00
@AlexG Yea... If you use the first way, you have to know the 'length' of the object to make it array-like. Or if you try the second one, you don't need to know the length. — iplus26, Dec 07 '15 at 06:02

score 0 · Answer 2 · answered Dec 07 '15 at 05:34

This might work. Filter function works on arrays only.

 var itemPrices = [
            { 'catid': '1', 'typeid': '1', 'price': '1000' },
            { 'catid': '1', 'typeid': '2', 'price': '1000' },
            { 'catid': '1', 'typeid': '3', 'price': '1100' },
            { 'catid': '2', 'typeid': '1', 'price': '1000' },
            { 'catid': '2', 'typeid': '2', 'price': '1000' },
            { 'catid': '2', 'typeid': '3', 'price': '1100' },
            { 'catid': '3', 'typeid': '1', 'price': '1200' },
            { 'catid': '3', 'typeid': '2', 'price': '1200' },
            { 'catid': '3', 'typeid': '3', 'price': '1300' },
            { 'catid': '4', 'typeid': '1', 'price': '1200' },
            { 'catid': '4', 'typeid': '2', 'price': '1200' },
            { 'catid': '4', 'typeid': '3', 'price': '1300' },
        ];

  var price = itemPrices.filter(function(item) { return item["typeid"] == 1 && item["catid"] == 2; });

I did it because array already has those keys. Hope that works for you. — FurkanO, Dec 07 '15 at 06:03

score 0 · Answer 3 · answered Jun 17 '20 at 03:54

I know its overkill but I like to do it this way suppose your object has two property's eg. type and title

var searchCategory = $('body .category-selector').val().toLowerCase().trim();
    var searchText = $('body #search-text').val().toLowerCase().trim();

    if (!searchText) {
        searchText = false;
    }
    if (searchCategory === 'all') {
        searchCategory = false;
    }

    var result = gamesData;

    if (searchText !== false) {
        result = result.filter(function(singleGame) {
            var current_title = singleGame.title.toLowerCase().trim();
            return current_title.indexOf(searchText) === -1 ? false : true;
        });
    }

    if (searchCategory !== false) {
        result = result.filter(function(singleGame) {
            var current_category = singleGame.type.toLowerCase().trim();

            return current_category == searchCategory;
        });
    }

    return result;

Search by multiple values in object

3 Answers3