transform object to array with lodash

Question

How can I transform a big object to array with lodash   var obj       22   name  John   id 22  friends  5 31 55   works  books     films        12   name  Ivan   id 12  friends  2 44 12   works  books     films            transform to  var arr     name  John   id 22      name  Ivan   id 12

User · Answer

A modern native solution if anyone is interested:

const arr = Object.keys(obj).map(key => ({ key, value: obj[key] }));

or (not IE):

const arr = Object.entries(obj).map(([key, value]) => ({ key, value }));

User · Answer

var arr     map obj   You can use   map function  of both lodash and underscore  with object as well  it will internally handle that case  iterate over each value and key with your iteratee  and finally return an array  Infact  you can use it without any iteratee  just   map obj   if you just want a array of values  The good part is that  if you need any transformation in between  you can do it in one go   Example    x000D   x000D  var obj     x000D      key1   id  1  name   A    x000D      key2   id  2  name   B    x000D      key3   id  3  name   C   x000D     x000D   x000D  var array1     map obj  v  gt v   x000D  console log  Array 1     array1   x000D   x000D    Actually you don t need the callback v  gt v if you x000D  are not transforming anything in between  v  gt v is default   x000D   x000D    SO simply you can use x000D  var array2     map obj   x000D  console log  Array 2     array2   x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 4 lodash js  gt  lt  script gt  x000D   x000D   x000D    However  if you want to transform your object you can do so  even if you need to preserve the key  you can do that     map obj   v  k    gt         with additional argument in map and then use it how you want   However there are other Vanilla JS solution to this  as every lodash solution there should pure JS version of it  like    Object keys and then map them to values Object values  in ES-2017  Object entries and then map each key value pairs  in ES-2017  for   in loop and use each keys for feting values   And a lot more  But since this question is for lodash  and assuming someone already using it  then you don t need to think a lot about version  support of methods and error handling if those are not found    There are other lodash solutions like   values  more readable for specific perpose   or getting pairs and then map and so on  but in the case your code need flexibility that you can update it in future as you need to preserve keys or transforming values a bit  then the best solution is to use a single   map as addresed in this answer  That will bt not that difficult as per readability also

User · Answer

If you want some custom mapping  like original Array prototype map  of Object into an Array  you can just use   forEach    let myObject       key1   value1     key2   value2                let myNewArray          forEach myObject   value  key    gt      myNewArray push       someNewKey  key      someNewValue  value toUpperCase      just an example of new value based on original value               myNewArray   gt     someNewKey  key1  someNewValue   VALUE1              See lodash doc of   forEach https   lodash com docs  forEach

User · Answer

Object to Array  Of all the answers I think this one is the best   let arr   Object entries obj  map   key  val     gt     key     val       that transforms       a    p  1  q  2     b    p  3  q  4      to         key   a   p  1  q  2         key   b   p  3  q  4       Array to Object  To transform back   let obj   arr reduce  obj    key     val      gt    obj key         val    return obj           To transform back keeping the key in the value   let obj   arr reduce  obj    key     val      gt    obj key      key     val    return obj           Will give       a    key   a   p  1  q  2      b    key   b   p  3  q  4       For the last example you can also use lodash   keyBy arr   key   or   keyBy arr  i   gt  i key

User · Answer

For me  this worked     map   toPairs data   d   gt    fromPairs  d       It turns     a   b    c   d    e   f      into     a   b      c   d      e   f

User · Answer

If you want the key  id in this case  to be a preserved as a property of each array item you can do  const arr     obj    wrap object so that you can chain lodash methods              mapValues  value  id   gt   merge     value   id      attach id to object              values     get the values of the result              value     unwrap array of objects

User · Answer

You can do  var arr     values obj     For documentation see here

User · Answer

toArray obj     Outputs as              name    Ivan        id   12       friends           2        44        12             works            books              films                          name    John        id   22       friends           5        31        55             works            books              films

User · Answer

2017 update  Object values  lodash values and toArray do it  And to preserve keys map and spread operator play nice    x000D   x000D     import   toArray  map   from  lodash  x000D  const map     map x000D   x000D  const input     x000D    key    x000D      value   value  x000D      x000D    x000D   x000D  const output   map input   value  key    gt     x000D    key  x000D       value x000D      x000D   x000D  console log output  x000D      gt  gt    key   key   value   value     x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 4 lodash js  gt  lt  script gt  x000D   x000D   x000D

User · Answer

Transforming object to array with plain JavaScript s ECMAScript-2016  Object values              x000D   x000D  var obj     x000D      22   name  John   id 22  friends  5 31 55   works  books     films       x000D      12   name  Ivan   id 12  friends  2 44 12   works  books     films      x000D    x000D   x000D  var values   Object values obj  x000D   x000D  console log values   x000D   x000D   x000D    If you also want to keep the keys use Object entries and Array map like this                     x000D   x000D  var obj     x000D      22   name  John   id 22  friends  5 31 55   works  books     films       x000D      12   name  Ivan   id 12  friends  2 44 12   works  books     films      x000D    x000D   x000D  var values   Object entries obj  map   k  v     gt     k   v    x000D   x000D  console log values   x000D   x000D   x000D

User · Answer

There are quite a few ways to get the result you are after  Lets break them in categories   ES6 Values only   Main method for this is Object values  But using Object keys and Array map you could as well get to the expected result   Object values obj  Object keys obj  map k   gt  obj k      x000D   x000D  var obj     x000D    A    x000D      name   John  x000D       x000D    B    x000D      name   Ivan  x000D      x000D    x000D   x000D  console log  Object values    Object values obj   x000D  console log  Object keys    Object keys obj  map k   gt  obj k    x000D   x000D   x000D    ES6 Key  amp  Value   Using map and ES6 dynamic computed properties and destructuring you can retain the key and return an object from the map   Object keys obj  map k   gt     k   obj k     Object entries obj  map   k v     gt     k  v       x000D   x000D  var obj     x000D    A    x000D      name   John  x000D       x000D    B    x000D      name   Ivan  x000D      x000D    x000D   x000D  console log  Object keys    Object keys obj  map k   gt     x000D     k   obj k  x000D       x000D  console log  Object entries    Object entries obj  map   k  v     gt     x000D     k   v x000D       x000D   x000D   x000D    Lodash Values only   The method designed for this is   values however there are  shortcuts  like   map and the utility method   toArray which would also return an array containing only the values from the object  You could also   map though the   keys and get the values from the object by using the obj key  notation   Note    map when passed an object would use its baseMap handler which is basically forEach on the object properties     values obj    map obj    toArray obj    map   keys obj   k   gt  obj k      x000D   x000D  var obj     x000D    A    x000D      name   John  x000D       x000D    B    x000D      name   Ivan  x000D      x000D    x000D   x000D  console log  values      values obj   x000D  console log  map      map obj   x000D  console log  toArray      toArray obj   x000D  console log  keys      map   keys obj   k   gt  obj k    x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 10 lodash min js  gt  lt  script gt  x000D   x000D   x000D    Lodash Key  amp  Value      Outputs an array with   KEY  VALUE     entries obj    toPairs obj      Outputs array with objects containing the keys and values   map   entries obj     k v     gt     k  v      map   keys obj   k   gt     k   obj k       transform obj   r c k    gt  r push   k  c          reduce obj   r c k    gt   r push   k  c    r          x000D   x000D  var obj     x000D    A    x000D      name   John  x000D       x000D    B    x000D      name   Ivan  x000D      x000D    x000D   x000D     Outputs an array with  KEY  VALUE  x000D  console log  entries      entries obj   x000D  console log  toPairs      toPairs obj   x000D   x000D     Outputs array with objects containing the keys and values x000D  console log  entries      map   entries obj     k  v     gt     x000D     k   v x000D       x000D  console log  keys      map   keys obj   k   gt     x000D     k   obj k  x000D       x000D  console log  transform      transform obj   r  c  k    gt  r push   x000D     k   c x000D           x000D  console log  reduce      reduce obj   r  c  k    gt   r push   x000D     k   c x000D      r        x000D   lt script src  https   cdnjs cloudflare com ajax libs lodash js 4 17 10 lodash min js  gt  lt  script gt  x000D   x000D   x000D    Note that in the above examples ES6 is used  arrow functions and dynamic properties    You can use lodash   fromPairs and other methods to compose an object if ES6 is an issue

[javascript] transform object to array with lodash

Examples related to javascript

Examples related to arrays

Examples related to object

Examples related to lodash