Convert object array to hash map indexed by an attribute value of the Object

Question

Use Case  The use case is to convert an array of objects into a hash map based on string or function provided to evaluate and use as the key in the hash map and value as an object itself  A common case of using this is converting an array of objects into a hash map of objects   Code  The following is a small snippet in JavaScript to convert an array of objects to a hash map  indexed by the attribute value of object  You can provide a function to evaluate the key of hash map dynamically  run time   Hope this helps someone in future   function isFunction func        return Object prototype toString call func        object Function              This function converts an array to hash map     param  String   function  key describes the key to be evaluated in each object to use as key for hashmap     returns Object     Example            id 123  name  naveen     id 345  name  kumar    toHashMap  id           Returns  - Object  123  Object  345  Object               id 123  name  naveen     id 345  name  kumar    toHashMap function obj  return obj id 1           Returns  - Object  124  Object  346  Object      Array prototype toHashMap   function key        var  hashMap       getKey   isFunction key  key  function  obj  return  obj key         this forEach function  obj            hashMap getKey obj     obj              return  hashMap       You can find the gist here  Converts Array of Objects to HashMap

User · Answer

You can use Array prototype reduce   and actual JavaScript Map instead just a JavaScript Object    let keyValueObjArray         key   key1   val   val1         key   key2   val   val2         key   key3   val   val3        let keyValueMap   keyValueObjArray reduce  mapAccumulator  obj    gt         either one of the following syntax works      mapAccumulator obj key    obj val    mapAccumulator set obj key  obj val      return mapAccumulator     new Map      console log keyValueMap   console log keyValueMap size     What is different between Map And Object  Previously  before Map was implemented in JavaScript  Object has been used as a Map because of their similar structure  Depending on your use case  if u need to need to have ordered keys  need to access the size of the map or have frequent addition and removal from the map  a Map is preferable      Quote from MDN document  Objects are similar to Maps in that both let you set keys to values  retrieve those values  delete keys  and detect whether something is stored at a key  Because of this  and because there were no built-in alternatives   Objects have been used as Maps historically  however  there are important differences that make using a Map preferable in certain cases    The keys of an Object are Strings and Symbols  whereas they can be any value for a Map  including functions  objects  and any primitive  The keys in Map are ordered while keys added to object are not  Thus  when iterating over it  a Map object returns keys in order of insertion  You can get the size of a Map easily with the size property  while the number of properties in an Object must be determined manually  A Map is an iterable and can thus be directly iterated  whereas iterating over an Object requires obtaining its keys in some fashion and iterating over them  An Object has a prototype  so there are default keys in the map that could collide with your keys if you re not careful  As of ES5 this can be bypassed by using map   Object create null   but this is seldom done  A Map may perform better in scenarios involving frequent addition and removal of key pairs

User · Answer

A small improvement on the reduce usage   var arr           key   foo   val   bar           key   hello   val   world        var result   arr reduce  map  obj    gt            map       obj key    obj val           console log result        foo   bar   hello   world

User · Answer

Using ES6 spread   Object assign    array     key   a   value   b   redundant   aaa     key   x   value   y   redundant   zzz     const hash   Object assign        array map s   gt     s key   s value       console log hash      a  b  x  y

User · Answer

Using ES6 Map  pretty well supported   you can try this    x000D   x000D  var arr     x000D        key   foo   val   bar     x000D        key   hello   val   world    x000D     x000D   x000D  var result   new Map arr map i   gt   i key  i val     x000D   x000D     When using TypeScript  need to specify type  x000D     var result   arr map  i    string  string    gt   i key  i val   x000D   x000D     Unfortunately maps don t stringify well   This is the contents in array form  x000D  console log  Result is      JSON stringify     result      x000D     Map   foo    gt   bar    hello    gt   world   x000D   x000D   x000D

User · Answer

There are better ways to do this as explained by other posters  But if I want to stick to pure JS and ol  fashioned way then here it is   var arr           key   foo   val   bar           key   hello   val   world           key   hello   val   universe        var map       for  var i   0  i  lt  arr length  i          var key   arr i  key      var value   arr i  val       if  key in map            map key  push value         else           map key     value            console log map

User · Answer

try  let toHashMap    a f    gt  a reduce  a c   gt   a f c   c a          x000D   x000D  let arr   x000D     id 123  name  naveen     x000D     id 345  name  kumar   x000D     x000D   x000D  let fkey   o   gt  o id     function changing object to string  key  x000D   x000D  let toHashMap    a f    gt  a reduce  a c   gt   a f c   c a       x000D   x000D  console log  toHashMap arr fkey     x000D   x000D     Adding to prototype is NOT recommented  x000D     x000D     Array prototype toHashMap   function f    return toHashMap this f     x000D     console log  arr toHashMap fkey     x000D   x000D   x000D

User · Answer

This is fairly trivial to do with Array prototype reduce    x000D   x000D  var arr     x000D        key   foo   val   bar     x000D        key   hello   val   world    x000D     x000D   x000D  var result   arr reduce function map  obj    x000D      map obj key    obj val  x000D      return map  x000D          x000D   x000D  console log result   x000D       foo  bar   hello  world    x000D   x000D   x000D    Note  Array prototype reduce   is IE9   so if you need to support older browsers you will need to polyfill it

User · Answer

Using the spread operator   const result   arr reduce       accumulator  target    gt        accumulator   target key   target val                Demonstration of the code snippet on jsFiddle

User · Answer

You can use the new Object fromEntries   method   Example    x000D   x000D  const array     x000D      key   a   value   b   redundant   aaa    x000D      key   x   value   y   redundant   zzz   x000D    x000D   x000D  const hash   Object fromEntries  x000D     array map e   gt   e key  e value   x000D    x000D   x000D  console log hash      a  b  x  y  x000D   x000D   x000D

User · Answer

This is what I m doing in TypeScript I have a little utils library where I put things like this  export const arrayToHash    array  any    id  string    id     gt            array reduce  obj  item    gt    obj item id     item   obj         usage   const hash   arrayToHash   id 1 data  data    id 2 data  data       or if you have a identifier other than  id   const hash   arrayToHash   key 1 data  data    key 2 data  data      key

User · Answer

If you want to convert to the new ES6 Map do this   var kvArray      key1    value1      key2    value2     var myMap   new Map kvArray     Why should you use this type of Map  Well that is up to you  Take a look at this

User · Answer

With lodash  this can be done using keyBy   var arr           key   foo   val   bar           key   hello   val   world        var result     keyBy arr  o   gt  o key    console log result      Object  foo  Object  hello  Object

User · Answer

Using simple Javascript   var createMapFromList   function objectList  property        var objMap           objectList forEach function obj          objMap obj property     obj              return objMap          objectList - the array     property - property as the key

User · Answer

Following is small snippet i ve created in javascript to convert array of objects to hash map  indexed by attribute value of object  You can provide a function to evaluate the key of hash map dynamically  run time    function isFunction func       return Object prototype toString call func        object Function              This function converts an array to hash map     param  String   function  key describes the key to be evaluated in each object to use as key for hasmap     returns Object     Example            id 123  name  naveen     id 345  name  kumar    toHashMap  id           Returns  - Object  123  Object  345  Object             id 123  name  naveen     id 345  name  kumar    toHashMap function obj  return obj id 1           Returns  - Object  124  Object  346  Object      Array prototype toHashMap   function key       var  hashMap       getKey   isFunction key  key  function  obj  return  obj key         this forEach function  obj            hashMap getKey obj     obj              return  hashMap       You can find the gist here   https   gist github com naveen-ithappu c7cd5026f6002131c1fa

User · Answer

es2015 version   const myMap   new Map objArray map obj   gt    obj key  obj val

User · Answer

With lodash  const items           key   foo   value   bar           key   hello   value   world        const map     fromPairs items map item   gt   item key  item val         OR  if you want to index the whole item by key     const map     fromPairs items map item   gt   item key  item      The lodash fromPairs function reminds me about zip function in Python Link to lodash

[javascript] Convert object array to hash map, indexed by an attribute value of the Object

Examples related to javascript

Examples related to arrays

Examples related to hashmap