Search code examples
javascriptobjectfilterinclude

Javascript filter object using includes


I'm trying to filter an object using the filter() function in javascript .

I want to filter againts an array like this: [1615, 1616]. It's referenced in the code as value.verdier.

Dataset is a large array holding objects that have several properties, parsed from a JSON string. Each object in the array has a property named kat_id.

The goal is to reduce the array so that it only holds objects where kat_id=1615 or kat_id=1616. Or any other value that I have in value.verdier.

My code is like this:

dataset = dataset.filter(function (el) 
     {
        return value.verdier.includes(el.kat_id );
     });

I'm problably missing something really obvious.


Solution

  • The goal is to reduce the array so that it only holds objects where kat_id=1615 or kat_id=1616. Or any other value that I have in value.verdier.

    The code in your question will do that, if the kat_id values and the values in value.verdier are all numbers or all strings. That's because includes does a === between the thing you pass into it and the entries in the array you call it on. So [1, 2, 3].includes("2") is false, as is ["1", "2", "3"].includes(2).

    I assume you wouldn't be posting the question if it were working, though, so I assume the type of the values of kat_id and the type of the values in value.verdier are different — one of them is a number, the other is a string.

    If the kat_id values are strings and the value.verdier values are numbers, you need to parse kat_id to number before using includes:

    return value.verdier.includes(parseInt(el.kat_id, 10));
    

    Live Example:

    var value = {
        verdier: [1615, 1616]
    };
    
    var dataset = [
        {kat_id: "1", expected: "omit"},
        {kat_id: "2", expected: "omit"},
        {kat_id: "1615", expected: "retain"},
        {kat_id: "3", expected: "omit"},
        {kat_id: "1616", expected: "retain"},
        {kat_id: "4", expected: "omit"},
        {kat_id: "5", expected: "omit"},
    ];
    dataset = dataset.filter(function (el) 
    {
        return value.verdier.includes(parseInt(el.kat_id, 10));
    });
    console.log(dataset);

    Or if the kat_id values are numbers and the value.verdier values are strings, you need to convert the kat_id numbers to strings before using includes:

    return value.verdier.includes(String(el.kat_id));
    

    Live Example:

    var value = {
        verdier: ["1615", "1616"]
    };
    
    var dataset = [
        {kat_id: 1, expected: "omit"},
        {kat_id: 2, expected: "omit"},
        {kat_id: 1615, expected: "retain"},
        {kat_id: 3, expected: "omit"},
        {kat_id: 1616, expected: "retain"},
        {kat_id: 4, expected: "omit"},
        {kat_id: 5, expected: "omit"},
    ];
    dataset = dataset.filter(function (el) 
    {
        return value.verdier.includes(String(el.kat_id));
    });
    console.log(dataset);

    If the values vary (some kat_ids are strings and others are numbers, and/or some value.verdier values are strings and others are numbers), you probably need some rather than includes and a type-insensitive comparison:

    return value.verdier.some(function(val) { return String(val) === String(el.kat_id); });
    

    Live Example:

    var value = {
        verdier: [1615, "1616"]
    };
    
    var dataset = [
        {kat_id: "1", expected: "omit"},
        {kat_id: 2, expected: "omit"},
        {kat_id: "1615", expected: "retain"},
        {kat_id: "3", expected: "omit"},
        {kat_id: 1616, expected: "retain"},
        {kat_id: "4", expected: "omit"},
        {kat_id: 5, expected: "omit"},
    ];
    dataset = dataset.filter(function (el) 
    {
        return value.verdier.some(function(val) { return String(val) === String(el.kat_id); });
    });
    console.log(dataset);


    I've stuck with ES5-level code above because your question seemed to be using ES5-level code only. But here are those examples using ES2015+:

    dataset = dataset.filter(el => value.verdier.includes(parseInt(el.kat_id, 10)));
    

    const value = {
        verdier: [1615, 1616]
    };
    
    let dataset = [
        {kat_id: "1", expected: "omit"},
        {kat_id: "2", expected: "omit"},
        {kat_id: "1615", expected: "retain"},
        {kat_id: "3", expected: "omit"},
        {kat_id: "1616", expected: "retain"},
        {kat_id: "4", expected: "omit"},
        {kat_id: "5", expected: "omit"},
    ];
    dataset = dataset.filter(el => value.verdier.includes(parseInt(el.kat_id, 10)));
    console.log(dataset);

    dataset = dataset.filter(el => value.verdier.includes(String(el.kat_id)));
    

    const value = {
        verdier: ["1615", "1616"]
    };
    
    let dataset = [
        {kat_id: 1, expected: "omit"},
        {kat_id: 2, expected: "omit"},
        {kat_id: 1615, expected: "retain"},
        {kat_id: 3, expected: "omit"},
        {kat_id: 1616, expected: "retain"},
        {kat_id: 4, expected: "omit"},
        {kat_id: 5, expected: "omit"},
    ];
    dataset = dataset.filter(el => value.verdier.includes(String(el.kat_id)));
    console.log(dataset);

    dataset = dataset.filter(el => value.verdier.some(val => String(val) === String(el.kat_id)));
    

    const value = {
        verdier: [1615, "1616"]
    };
    
    let dataset = [
        {kat_id: "1", expected: "omit"},
        {kat_id: 2, expected: "omit"},
        {kat_id: "1615", expected: "retain"},
        {kat_id: "3", expected: "omit"},
        {kat_id: 1616, expected: "retain"},
        {kat_id: "4", expected: "omit"},
        {kat_id: 5, expected: "omit"},
    ];
    dataset = dataset.filter(el => value.verdier.some(val => String(val) === String(el.kat_id)));
    console.log(dataset);