Skip to content
Related Articles

Related Articles

How to convert Object’s array to an array using JavaScript ?
  • Last Updated : 27 Apr, 2020
GeeksforGeeks - Summer Carnival Banner

Given an array of objects and the task is to convert the object values to an array with the help of JavaScript. There are two approaches that are discussed below:

Approach 1: We can use the map() method and return the values of each object which makes the array.

  • Example:




    <!DOCTYPE HTML>
    <html>
      
    <head>
        <title>
            Convert a JS object to
            an array using JQuery
        </title>
      
        <script src=
        </script>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
      
        <p id="GFG_UP"></p>
      
        <button onclick="myGFG()">
            Click Here
        </button>
          
        <p id="GFG_DOWN"></p>
      
        <script>
            var up = document.getElementById("GFG_UP");
      
            var JS_Obj = {
                1: ['gfg', 'Gfg', 'gFG'],
                2: ['geek', 'Geek', 'gEEK']
            };
      
            up.innerHTML = "Object - [" 
                    + JSON.stringify(JS_Obj) + "]";
              
            var down = document.getElementById("GFG_DOWN");
              
            function myGFG() {
                var array = $.map(JS_Obj, function (val, ind) {
                    return [val];
                });
                down.innerHTML = array;
            }
        </script>
    </body>
      
    </html>
  • Output:

Approach 2: The Object.keys() method is used to get the keys of object and then those keys are used to get the values of the objects from the array.

  • Example:




    <!DOCTYPE HTML>
    <html>
      
    <head>
        <title>
            Convert a JS object to
            an array using JQuery
        </title>
      
        <script src=
        </script>
    </head>
      
    <body style="text-align:center;">
      
        <h1 style="color:green;">
            GeeksForGeeks
        </h1>
          
        <p id="GFG_UP"></p>
      
        <button onclick="myGFG()">
            Click Here
        </button>
        <p id="GFG_DOWN"></p>
      
        <script>
            var up = document.getElementById("GFG_UP");
              
            var JS_Obj = {
                1: ['gfg', 'Gfg', 'gFG'],
                2: ['geek', 'Geek', 'gEEK']
            };
              
            up.innerHTML = "Object - [" 
                + JSON.stringify(JS_Obj) + "]";
      
            var down = document.getElementById("GFG_DOWN");
              
            function myGFG() {
                var arr = Object.keys(JS_Obj)
                    .map(function (key) 
                    { return JS_Obj[key]; });
                      
                down.innerHTML = arr;
            }
        </script>
    </body>
      
    </html>
  • Output:

full-stack-img




My Personal Notes arrow_drop_up
Recommended Articles
Page :