loop through nested object javascript

Question

I am trying to loop through a following nested object and get an output as below:

const preference = {
    "ethnicity": {
        "value": "Newar",
        "rank": 1
    },
    "occupation": {
        "value": "Banker",
        "rank": 2
    }
}

I tried following:

let preferenceRank = {};
preference.map(pref => {
  preferenceRank[pref.rank] = pref; 
});

console.log(preferenceRank);

I get this error:

"TypeError: preference.map is not a function"...

Output required:

{
  1: "ethnicity",
  2: "occupation",
}

Answer 1

You can use Object.entries to get keys and values at once (as array of arrays [key, value]):

const preference = {
    "ethnicity": {
        "value": "Gurung",
        "rank": 1
    },
    "occupation": {
        "value": "Banker",
        "rank": 2
    }
}

const preferenceRank = {}
for (const [key, { rank }] of Object.entries(preference)) {
    preferenceRank[rank] = key
}

console.log(preferenceRank)

(By the way, in your code it doesn't make any sense to use map there, since you are not mapping the array to anything, and you ignore the return value of map. You probably wanted forEach instead or, as I used now, a for loop.)

---

2021 Update

There is now an easier way widely available, using Object.fromEntries, which does the opposite of Object.entries, thereby allowing us to express the whole thing as a mapping operation:

const preferenceRank = Object.fromEntries(
  Object.entries(preference).map(([key, { rank }]) => [rank, key])
)

Answer 2

You can use the .entries() function to map over the object.

Object.entries(preference).reduce((out, [key, value]) => {
  out[value.rank] = key;
  return out;
},{});

Answer 3

Use Object.entries() to get an array of the keys and values of the object. You can then loop over that.

Use forEach if the loop is being done for side effect rather than using the values returned by the callback function.

const preference = {
    "ethnicity": {
        "value": "Gurung",
        "rank": 1
    },
    "occupation": {
        "value": "Banker",
        "rank": 2
    }
}

let preferenceRank = {};
Object.entries(preference).forEach(([pref, {rank}]) => {
  preferenceRank[rank] = pref; 
});

console.log(preferenceRank);

Answer 4

You could map the entries and build a new object.

const
    preference = { ethnicity: { value: "Gurung", rank: 1 }, occupation: { value: "Banker", rank: 2        } },
    result = Object.fromEntries(Object
        .entries(preference)
        .map(([k, { rank }]) => [rank, k])
    );

console.log(result);

Answer 5

This will work.

const preferenceRank = {};
Object.keys(preference).forEach((key) => {
  preferenceRank[preference[key]['rank']] = preference[key]['value'];
});

console.log(preferenceRank);

Answer 6

You could map over the keys and add to a result-object the rank/key-objects.

const preference = {
    "ethnicity": {
        "value": "Gurung",
        "rank": 1
    },
    "occupation": {
        "value": "Banker",
        "rank": 2
    }
}

let res= {};
Object.keys(preference).map((el,key) => {
    res[preference[el].rank] = el;
});

console.log(res);

Answer 7

map only works for arrays, you are dealing with an object, what you can is go through the keys of the objects by using

Object.keys(preference)

this will return to you the object keys in an array as the following ["ethnicity","occupation"]

then you can map through it if you want and do your code

Answer 8

const preference = {
    "ethnicity": {
        "value": "Gurung",
        "rank": 1
    },
    "occupation": {
        "value": "Banker",
        "rank": 2
    }
}
console.log({...Object.keys(preference)})