How to loop/process Javascript Key:Value pairs?

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP



How to loop/process Javascript Key:Value pairs?



Consider the following code:


a = ;
a['a'] = 1;
a['b'] = 3;
a['c'] = 5;
a['d'] = 2;

b = ;
b['a'] = 1;
b['b'] = 3;
b['c'] = 5;
b['d'] = 2;

console.log(typeof a, typeof b);
console.log(a);
console.log(b);



And the output console.log is as follow:


console.log


object object
a: 1, b: 3, c: 5, d: 2
[ a: 1, b: 3, c: 5, d: 2 ]



Granted that they are of both type object, to my understanding, a is an object of key:value pairs, where as b is an array of [key:value] pairs. Is that the right assumption?


object


a


key:value


b


[key:value]



And aside from a for(index in array) pattern of looping, where I have to use the iterator index to grab the value (array[index]), is there a better, more simple method of looping through these key/value pairs to grab the index/value or to just process the data at each index, sort of like map or reduce for arrays?


for(index in array)


array[index]


map


reduce



One such problem I ran into was, if I wanted to grab the key with the least count (in the above examples, it would be 'a'), is there a way to do it without using the for( index in array) pattern?


for( index in array)




1 Answer
1



In Javascript arrays are objects, so you can add keys like you are doing in your example above, but this is not the normal way to use arrays and will probably confuse a lot of people looking at your code. There are occasional when it's useful to add a property to an array, but using them just as key stores definitely not the norm.



If you want an ordered collections with numeric indexes, use an array:




let arr =
arr.push(10)
arr.push(20)
console.log(arr)
console.log(arr[0])



If you want properties where order isn't important and you will have string keys, use an object. In the above example you are using both types like objects — there's no reason to use an array like that.



Having said that if you want an iterator of values from an object, you can use Object.values(). This delivers an array of values from an object if you only want to process the values:


Object.values()




a = ;
a['a'] = 1;
a['b'] = 3;
a['c'] = 5;
a['d'] = 2;

console.log(Object.values(a))

// process them
let newArr = Object.values(a).map(n => n * 10)
console.log(newArr)



Object.entries is also useful — it returns an array of key/value pairs, which, with reduce() makes a nice way to find the minimum:


Object.entries


reduce()




a =
a: 1,
b: 3,
c: 5,
d: 2
;

// current will be an array of the form [key, value]
let [minKey, minValue] = Object.entries(a).reduce((min, current) => min[1] < current[1] ? min : current)
console.log(minKey, minValue)






By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Popular posts from this blog

Firebase Auth - with Email and Password - Check user already registered

Dynamically update html content plain JS

Creating a leaderboard in HTML/JS