How to convert an Object to an Array of key-value pairs in JavaScript

Question

I want to convert an object like this     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0    into an array of key-value pairs like this     1 5   2 7   3 0   4 0         How can I convert an Object to an Array of key-value pairs in JavaScript

User · Answer

Use Object entries to get each element of Object in key  amp  value format  then map through them like this                   x000D   x000D  var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0  x000D   x000D  var res   Object entries obj  map   k  v     gt    Number k   v     x000D   x000D  console log res   x000D   x000D   x000D    But  if you are certain that the keys will be in progressive order you can use Object values and Array map to do something like this                x000D   x000D  var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0    x000D   x000D                             idx is the index  you can use any logic to increment it  starts from 0  x000D  let result   Object values obj  map  e  idx    gt      idx  e     x000D   x000D  console log result   x000D   x000D   x000D

User · Answer

Object entries   returns an array whose elements are arrays corresponding to the enumerable property  key  value  pairs found directly upon object  The ordering of the properties is the same as that given by looping over the property values of the object manually       - https   developer mozilla org en-US docs Web JavaScript Reference Global Objects Object entries Description   The Object entries function returns almost the exact output you re asking for  except the keys are strings instead of numbers    x000D   x000D  const obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0   x000D   x000D  console log Object entries obj    x000D   x000D   x000D    If you need the keys to be numbers  you could map the result to a new array with a callback function that replaces the key in each pair with a number coerced from it     x000D   x000D  const obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0   x000D   x000D  const toNumericPairs   input   gt    x000D      const entries   Object entries input   x000D      return entries map entry   gt  Object assign entry    0   entry 0       x000D    x000D   x000D  console log toNumericPairs obj    x000D   x000D   x000D    I use an arrow function and Object assign for the map callback in the example above so that I can keep it in one instruction by leveraging the fact that Object assign returns the object being assigned to  and a single instruction arrow function s return value is the result of the instruction    This is equivalent to   entry   gt        entry 0     entry 0       return entry        As mentioned by  TravisClarke in the comments  the map function could be shortened to   entry   gt     entry 0   entry 1      However  that would create a new array for each key-value pair  instead of modifying the existing array in place  hence doubling the amount of key-value pair arrays created  While the original entries array is still accessible  it and its entries will not be garbage collected    Now  even though using our in-place method still uses two arrays that hold the key-value pairs  the input and the output arrays   the total number of arrays only changes by one  The input and output arrays aren t actually filled with arrays  but rather references to arrays and those references take up a negligible amount of space in memory     Modifying each key-value pair in-place results in a negligible amount of memory growth  but requires typing a few more characters  Creating a new array for each key-value pair results in doubling the amount of memory required  but requires typing a few less characters    You could go one step further and eliminate growth altogether by modifying the entries array in-place instead of mapping it to a new array    x000D   x000D  const obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0   x000D   x000D  const toNumericPairs   input   gt    x000D    const entries   Object entries obj   x000D    entries forEach entry   gt  entry 0     entry 0    x000D    return entries  x000D    x000D   x000D  console log toNumericPairs obj    x000D   x000D   x000D

User · Answer

To recap some of these answers now on 2018  where ES6 is the standard   Starting with the object   let const   1  9  2  8  3  7  4  6  5  5  6  4  7  3  8  2  9  1  10  0  12  5      Just blindly getting the values on an array  do not care of the keys     x000D   x000D  const obj   1  9  2  8  3  7  4  6  5  5  6  4  7  3  8  2  9  1  10  0  12  5   x000D  console log Object values obj    x000D     9 8 7 6 5 4 3 2 1 0 5  x000D   x000D   x000D     Simple getting the pairs on an array     x000D   x000D  const obj   1  9  2  8  3  7  4  6  5  5  6  4  7  3  8  2  9  1  10  0  12  5   x000D  console log Object entries obj    x000D       1  9    2  8    3  7    4  6    5  5    6  4    7  3    8  2    9  1    10  0    12  5   x000D   x000D   x000D     Same as previous  but with numeric keys on each pair     x000D   x000D  const obj   1  9  2  8  3  7  4  6  5  5  6  4  7  3  8  2  9  1  10  0  12  5   x000D  console log Object entries obj  map   k v    gt   k v     x000D      1 9   2 8   3 7   4 6   5 5   6 4   7 3   8 2   9 1   10 0   12 5   x000D   x000D   x000D     Using the object property as key for a new array  could create sparse arrays      x000D   x000D  const obj   1  9  2  8  3  7  4  6  5  5  6  4  7  3  8  2  9  1  10  0  12  5   x000D  console log Object entries obj  reduce  ini  k v    gt  ini k  v ini        x000D     undefined 9 8 7 6 5 4 3 2 1 0 undefined 5  x000D   x000D   x000D    This last method  it could also reorganize the array order depending the value of keys  Sometimes this could be the desired behaviour  sometimes don t   But the advantage now is that the values are indexed on the correct array slot  essential and trivial to do searches on it    Map instead of Array   Finally  not part of the original question  but for completeness   if you need to easy search using the key or the value  but you don t want sparse arrays  no duplicates and no reordering without the need to convert to numeric keys  even can access very complex keys   then array  or object  is not what you need  I will recommend Map instead   https   developer mozilla org en-US docs Web JavaScript Reference Global Objects Map  let r new Map Object entries obj    r get  4      6 r has 8     true

User · Answer

Use for in  var obj      10  5   2  7   3  0   4  0   5  0   6  0   7  0               8  0   9  0   10  0   11  0   12  0     var objectToArray   function obj        var  arr            for  var key in obj             arr push  key  obj key               return  arr     console log objectToArray obj

User · Answer

The best way is to do   var obj    1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10    0  11  0  12  0   Object entries obj     Calling entries  as shown here  will return  key  value  pairs  as the asker requested   Alternatively  you could call Object values obj   which would return only values

User · Answer

I would suggest this simplest solution to use Object entries     x000D   x000D  var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0  x000D  var result  Object entries obj  x000D   x000D  console log result   x000D   x000D   x000D

User · Answer

We can change Number to String type for Key like below     x000D   x000D  var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0  x000D  var result   Object keys obj  map function key    x000D    return  String key   obj key    x000D      x000D       x000D  console log result   x000D   x000D   x000D

User · Answer

Yet another solution if Object entries won t work for you    x000D   x000D  const obj     x000D         1   29  x000D         2   42 x000D         x000D  const arr   Array from Object keys obj   k  gt     k    obj k     x000D  console log arr   x000D   x000D   x000D

User · Answer

In Ecmascript 6   var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0    var res   Object entries obj    console log res     fiddle

User · Answer

If you are using lodash  it could be as simple as this   var arr     values obj

User · Answer

This is my solution  i have the same issue and its seems like this solution work for me      yourObj      concat yourObj

User · Answer

With lodash  in addition to the answer provided above  you can also have the key in the output array     Without the object keys in the output array  for   const array     values obj     If obj is the following        art       id  1   title     aaaa          fiction       id  22   title     7777         Then array will be       id  1  title     aaaa         id  22  title     7777          With the object keys in the output array  If you write instead   genre  is a string that you choose    const array    map obj   val  id    gt        return      val  genre  key            You will get          id  1  title     aaaa      genre     art           id  22  title     7777     genre     fiction

User · Answer

You can use Object keys   and map   to do this  x000D   x000D  var obj     1  5  2  7  3  0  4  0  5  0  6  0  7  0  8  0  9  0  10  0  11  0  12  0  var result   Object keys obj  map  key    gt   Number key   obj key      console log result   x000D   x000D   x000D

User · Answer

You can use Object values      you might need this polyfill if you don t already   const objectToValuesPolyfill    object    gt      return Object keys object  map key   gt  object key       Object values   Object values    objectToValuesPolyfill    https   stackoverflow com a 54822153 846348  Then you can just do   var object    1   hello   2   world    var array   Object values object     Just remember that arrays in js can only use numerical keys so if you used something else in the object then those will become  0 1 2   x    It can be useful to remove duplicates for example if you have a unique key   var obj       object uniqueKey

User · Answer

This is my simple barebone implementation    let obj        1   5     2   7     3   0     4   0     5   0     6   0     7   0     8   0     9   0     10   0     11   0     12   0         const objectToArray   obj   gt          let sol             for  key in obj            sol push  key  obj key                   return sol          objectToArray obj

User · Answer

Recursive convert object to array  function is object mixed var        if  mixed var instanceof Array            return false        else           return  mixed var     null   amp  amp   typeof  mixed var       object              function objectToArray obj        var array       tempObject      for  var key in obj             tempObject   obj key            if  is object obj key                  tempObject   objectToArray obj key                      array key    tempObject            return array

User · Answer

you can use   castArray obj    example     castArray    a   1          gt      a   1

User · Answer

Use Object keys and Array map methods    x000D   x000D  var obj     x000D     1   5  x000D     2   7  x000D     3   0  x000D     4   0  x000D     5   0  x000D     6   0  x000D     7   0  x000D     8   0  x000D     9   0  x000D     10   0  x000D     11   0  x000D     12   0 x000D     x000D     get all object property names x000D  var res   Object keys obj  x000D       iterate over them and generate the array x000D     map function k    x000D         generate the array element  x000D      return   k  obj k    x000D        x000D   x000D  console log res   x000D   x000D   x000D

[javascript] How to convert an Object {} to an Array [] of key-value pairs in JavaScript

Examples related to javascript

Examples related to arrays

Examples related to type-conversion