¿Cómo convertir una string JSON en una array de objetos JSON usando JavaScript?

Dada una string JSON y la tarea es convertir la string JSON en la array de objetos JSON. Esta array contiene los valores del objeto JavaScript obtenidos de la string JSON con la ayuda de JavaScript. Hay dos enfoques para resolver este problema que se discuten a continuación: 

Enfoque 1: primero convierta la string JSON en el objeto JavaScript usando el método JSON.Parse() y luego extraiga los valores del objeto e introdúzcalos en la array usando el método push() .

  • Ejemplo: 

html

<!DOCTYPE HTML> 
<html> 
  
<head> 
    <title> 
        How to convert JSON string to array
        of JSON objects using JavaScript?
    </title>
</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 = 
        '{"prop_1":"val_1", "prop_2":"val_2", "prop_3" : "val_3"}';
          
        up.innerHTML = "JSON string - '" + JS_Obj + "'";
          
        var down = document.getElementById("GFG_DOWN");
          
        function myGFG() {
            var obj = JSON.parse(JS_Obj);
            var res = [];
              
            for(var i in obj)
                res.push(obj[i]);
              
            down.innerHTML = "Array of values - ["
                            + res + "]";
        }
    </script> 
</body> 
  
</html>
  • Producción:

                                                                                           

 

Enfoque 2: Este enfoque también es el mismo pero utiliza un método diferente. Convierta la string JSON en el objeto JavaScript usando el método eval() y luego extraiga los valores del objeto y envíelos a la array usando el método push() .

  • Ejemplo: 

html

<!DOCTYPE HTML> 
<html> 
  
<head> 
    <title> 
        How to convert JSON string to array
        of JSON objects using JavaScript?
    </title>
</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 = 
        '{"prop_1":"val_1", "prop_2":"val_2", "prop_3" : "val_3"}';
          
        up.innerHTML = "JSON string - '" + JS_Obj + "'";
          
        var down = document.getElementById("GFG_DOWN");
          
        function myGFG() {
            var obj = eval('(' + JS_Obj + ')');
            var res = [];
              
            for(var i in obj)
                res.push(obj[i]);
              
            down.innerHTML = "Array of values - ["
                            + res + "]";
        }
    </script> 
</body> 
  
</html>
  • Producción:

 

JavaScript es mejor conocido por el desarrollo de páginas web, pero también se usa en una variedad de entornos que no son de navegador. Puede aprender JavaScript desde cero siguiendo este tutorial de JavaScript y ejemplos de JavaScript.

  • Tutorial de JavaScript y ejemplos de JavaScript
  • Publicación traducida automáticamente

    Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

    Deja una respuesta

    Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *