Filter and loop thru non-array flat JSON object in javascript

Question

I have the following JSON, which I use as some kind of enum equivalent for javascript:

const blah = {
    IV: {
        name: "dIV",
        value: 1
    },
    III: {
        name: "dIII",
        value: 2
    },
    II: {
        name: "dII",
        value: 3
    },
    I: {
        name: "dI",
        value: 4
    }
};

I would like to filter all the objects by value and then be able to loop through the result. I tried to do something like:

let result = blah.find(x => x.value > 2);
result.each(function () {
   console.log(this)
}

but this doesn't work and throws: blah.find is not a function. The expected output would contain two elements:

II: { name: "dII", value: 3},
I: { name: "dI", value: 4}

Most of the examples I've found on the Internet use arrays in the JSON structure. Is there any option to achieve what I want or I need to modify the JSON structure and use an array? Cheers

`.find` is part of `Array.prototype` so you can't use it in objects, like `blah` is — Calvin Nunes, Feb 24 '20 at 20:34
the expected output is an array of objects or another object with keys? — Calvin Nunes, Feb 24 '20 at 20:35
The output can be an array, I rly don't mind. I only need to loop thru the result — GoldenAge, Feb 24 '20 at 20:39

Calvin Nunes · Accepted Answer · 2020-02-24T20:50:58.433

You can iterate over your object (note, it is a javascript literal object, not a JSON) with a simple for...in that loops through each object key (enumerable properties), for me, this is the most controllable and readable way, but there is many more, as you would see in other people answers.

const blah = {IV: {name: "dIV", value: 1}, III: {name: "dIII", value: 2}, II: { name: "dII",    value: 3}, I: {name: "dI", value: 4}};

let result = []
for (let key in blah){
  let object = blah[key]
  if (object.value > 2){
    result.push(object)  
  }
}

console.log(result)

Another possibilty is using Object.values (that returns all values from an object into an array)
and an Array.filter (that the name says all), this is less code and more "elegant":

const blah = {IV: {name: "dIV", value: 1}, III: {name: "dIII", value: 2}, II: { name: "dII",    value: 3}, I: {name: "dI", value: 4}};

let result = Object.values(blah).filter(x => x.value > 2)
console.log(result)

Weird this is the selected answer since it does not match the "expected output" — epascarello, Feb 24 '20 at 21:10
I asked OP in comments the expect output format and OP said it doesn't matter, could be an array of object... So, I did an array of objects. But anyway, I'm going to upvote yours, since I liked your approach and I think it matches OP results as well — Calvin Nunes, Feb 24 '20 at 21:11

score 1 · Answer 2 · answered Feb 24 '20 at 20:51

I would use Object.entries and reduce.

const blah = {
    IV: {
        name: "dIV",
        value: 1
    },
    III: {
        name: "dIII",
        value: 2
    },
    II: {
        name: "dII",
        value: 3
    },
    I: {
        name: "dI",
        value: 4
    }
};



var result = Object.entries(blah).reduce((obj, [key, props]) => {
  if (props.value >= 3) {
    obj[key] = props
  }
  return obj
}, {})


console.log(result)

score 0 · Answer 3 · answered Feb 24 '20 at 20:39

try Object.keys(blah):

const blah = {
    IV: {
        name: "dIV",
        value: 1
    },
    III: {
        name: "dIII",
        value: 2
    },
    II: {
        name: "dII",
        value: 3
    },
    I: {
        name: "dI",
        value: 4
    }
};

var result = Object.keys(blah)
                   .filter(key => blah[key].value > 2)
                   .reduce((acc, key) => ({...acc, [key]: blah[key]}), {});

console.log(result)

score 0 · Answer 4 · answered Feb 24 '20 at 20:39

What you have provided in the example is not in fact JSON (Javascript Object Notion), but an actually Javascript object, the birthplace of the JSON serialisation format.

JavaScript objects are more like dictionaries, and provide fast key/value read/writes for structured data. You cannot sort a Javascript object because it is unordered, depending on the javascript engine's implementation (V8 for Chrome, Node.js, ...).

What you can do, is get a list of keys/values/key+values as an array, and iterate over the array, either using the array's values to construct a new object, or just as a reference for a list of keys that exist in the object.

See Object.keys, Object.values and Object.entries on Mozilla MDN. Arrays are ordered, can be sorted and iterated over.

After seeing Calvin Nunes's comment, I see there is a fairly new syntax for this with `for...in`, which I imagine is sugar-coating for `for ... of Object.keys(obj)` — Marcus Cemes, Feb 24 '20 at 20:41

Filter and loop thru non-array flat JSON object in javascript

4 Answers4