¿Cómo puedo convertir un string JSON a un objeto en JavaScript?

Question

Si tengo una variable string con el siguiente valor:

var myString = "{'nombre':'juan'}";

¿Cómo puedo convertir un string a un objeto JSON en JavaScript?

Answer 1

Asumiendo que escribimos bien la sintaxis de JSON, tu string:

var s = '{"nombre":"juan"}';

¡Ya es JSON!, no necesita ninguna conversión.

La notación JSON es una manera de serializar un objeto JavaScript dentro de un string, por lo que ya tienes un JSON.

Nota: Puedes escribirlo (sin la variable s y sin las comillas simples: {"nombre":"juan"}) en esta página: Json Parser Online para validarlo.

Ahora si lo que quieres es convertirlo a un objeto JavaScript.

var o = JSON.parse(s);

y devolverlo a JSON:

var json = JSON.stringify(o);

Finalmente como menciona @ratlab si tu navegador no soporta el objeto JSON puedes utilizar una librería como json2.js o JSON 3

O utilizar este polyfill de MDN directamente en tu código:

if (!window.JSON) {
    window.JSON = {
        parse: function(sJSON) { return eval('(' + sJSON + ')'); },
        stringify: (function () {
            var toString = Object.prototype.toString;
            var isArray = Array.isArray || function (a) { return toString.call(a) === '[object Array]'; };
            var escMap = {'"': '\\"', '\\': '\\\\', '\b': '\\b', '\f': '\\f', '\n': '\\n', '\r': '\\r', '\t': '\\t'};
            var escFunc = function (m) { return escMap[m] || '\\u' + (m.charCodeAt(0) + 0x10000).toString(16).substr(1); };
            var escRE = /[\\"\u0000-\u001F\u2028\u2029]/g;
            return function stringify(value) {
                if (value == null) {
                    return 'null';
                } else if (typeof value === 'number') {
                    return isFinite(value) ? value.toString() : 'null';
                } else if (typeof value === 'boolean') {
                    return value.toString();
                } else if (typeof value === 'object') {
                    if (typeof value.toJSON === 'function') {
                        return stringify(value.toJSON());
                    } else if (isArray(value)) {
                        var res = '[';
                        for (var i = 0; i < value.length; i++)
                            res += (i ? ', ' : '') + stringify(value[i]);
                        return res + ']';
                    } else if (toString.call(value) === '[object Object]') {
                        var tmp = [];
                        for (var k in value) {
                            if (value.hasOwnProperty(k))
                                tmp.push(stringify(k) + ': ' + stringify(value[k]));
                        }
                        return '{' + tmp.join(', ') + '}';
                    }
                }
                return '"' + value.toString().replace(escRE, escFunc) + '"';
            };
        })()
    };
}

Nota: Ahora que investigo un poco más, de las 3 librerias antes mencionadas, json2.js, JSON 3 y el pollyfill sólo recomiendo JSON 3. El motivo es que el pollyfill es sólo un ejemplo de código probablemente sin soporte y json2.js a pesar de ser la librería original, es una librería antigua, con algunos errores y no coincide con el estándar actual. Más información en la sección Changes from JSON 2 de la documentación de JSON 3

Answer 2

En JavaScript existen 2 métodos para convertir de string con notación JSON a objeto y viceversa JSON.parse y JSON.stringify:

var obj1 = 'null';
var obj2 = '1';
var obj3 = '"string"';
var obj4 = '[1,2,3]';
var obj5 = '{"double_quote": "any object"}'

console.log(JSON.parse(obj1)); => null
console.log(JSON.parse(obj2)); => 1
console.log(JSON.parse(obj3)); => "string"
console.log(JSON.parse(obj4)); => [1,2,3]
console.log(JSON.parse(obj5)); => {"double_quote": "any object"}

console.log(JSON.stringify(obj3)) => "\"string\""

Debes tener en cuenta que null, true, false también son valores JSON válidos y que las cadenas de caracteres deben incluir una doble comilla al principio y al final de la cadena para ser consideradas como tal, de otra forma se intentará interpretarlas como otro tipo de datos. Expresiones regulares y funciones no lo son ya que JSON es un formato de intercambio de datos y esos últimos son considerados "código".

Puedes encontrar la especificación completa del formato aquí y también en la propia página json.org

Estas funciones están soportadas en la mayoría de los navegadores Chrome, Firefox 3.5+, Internet Explorer 8+, Opera 10.5+ y Safari 4.0+.

En caso de no encontrarse presente se puede emplear la librería JSON2 hecha por el mismo Douglas Crockford el creador de este formato basándose en las estructuras JavaScript existentes.

Answer 3

Javascript cuenta con métodos para convertir de string a JSON y viceversa.

var a = '{"nombre":"juan"}';
var b = JSON.parse(a); // devuelve el string como JSON
JSON.stringify(b); // devuelve el JSON en string

Answer 4

Sumar a la respuesta de @dabbbb.

que navegadores como:

• ie8 hacia adelante.
• Firefox
• Chrome

tienen soporte nativo para JSON, en caso de que necesites hacer esto en navegadores mas viejos necesitaras de incluir JSON2

Answer 5

Tomando en cuenta tu código de inicialización:

var myString = "{'nombre':'juan'}";

Solución

Uso de herramientas intrínsecas del lenguaje: JSON.parse()

var objeto = JSON.parse(myString);

La documentación de la MDN nos dice que:

JSON.parse(text[, reviver]): El método JSON.parse() analiza una cadena de texto como JSON, transformando opcionalmente el valor producido por el análisis.

---

Usar la palabra "objeto JSON" y "texto JSON" quizá sea un pleonasmo pero en realidad es algo tan común que cuando se expresa de esa manera da todo un contexto al receptor del mensaje distinto al que sólo usa JSON.

Esto se puede constatar en la página: JSON in JavaScript.

var myJSONObject ... To convert a JSON text into an object ...