Разница между JSON.stringify и JSON.parse

453

Я был смущен, когда использовать эти два метода синтаксического анализа.

После того, как я передаю свои json_encoded данные и получаю их обратно через ajax, я часто путаюсь, когда мне следует использовать JSON.stringify и JSON.parse .

Я получаю [object,object]в моем console.log при разборе и JavaScript-объект при строковом преобразовании.

$.ajax({
url: "demo_test.txt",
success: function(data) {
         console.log(JSON.stringify(data))
                     /* OR */
         console.log(JSON.parse(data))
        //this is what I am unsure about?
    }
});
ХИРА ТАКУР
источник
1
Подводя итог ответам ниже: 1. Они обратны друг другу. 2. в сочетании помогает проверить данные или превратить человеческое читаемыми: json.stringify(json.parse(data)).
Хафенкранич

Ответы:

675

JSON.stringify превращает объект JavaScript в текст JSON и сохраняет этот текст JSON в строке, например:

var my_object = { key_1: "some text", key_2: true, key_3: 5 };

var object_as_string = JSON.stringify(my_object);  
// "{"key_1":"some text","key_2":true,"key_3":5}"  

typeof(object_as_string);  
// "string"  

JSON.parse превращает строку текста JSON в объект JavaScript, например:

var object_as_string_as_object = JSON.parse(object_as_string);  
// {key_1: "some text", key_2: true, key_3: 5} 

typeof(object_as_string_as_object);  
// "object" 
Quentin
источник
9
json.stringify (json.parse (data))? Я видел это в коде ... так что это в основном преобразование данных json в объект и затем снова преобразование их в данные json ..
HIRA THAKUR
29
@MESSIAH - Да. Это в значительной степени бессмысленно, но может служить валидатором JSON.
Квентин
11
Также может использоваться простая копия объекта для парных значений ключа объекта.
Hunterc
4
Я нашел это очень полезным для отладки в консоли - это делает его легко читаемым.
Кирги
2
@Quentin, не могли бы вы объяснить с помощью примера?
Пардип Джайн
58

JSON.parse()для "разбора" чего-то, что было получено как JSON.
JSON.stringify()это создать строку JSON из объекта / массива.

Бьорн 'Bjeaurn' S
источник
4
Точность: это может быть не объект.
Денис Сегюре
Правда, также может быть массивом или чем-то, что Javascript распознает как определенный тип. Нижняя граница; он берет его и преобразует в соответствующий эквивалент JSON.
Бьорн 'Bjeaurn' S
2
@dystroy - это должен быть объект (учитывая, что массивы являются объектами).
Квентин
2
@quentinJSON.stringify(3)
Денис Сегуре
@dystroy - да, не понимают , что они бы расширили его , чтобы иметь дело с JSON фрагментов . Это не интуитивно понятно.
Квентин
44

Они обратны друг другу. JSON.stringify()сериализует объект JS в строку JSON, тогда как JSON.parse()десериализует строку JSON в объект JS.

bluehallu
источник
26

Они противоположны друг другу.

JSON.stringify ()

JSON.stringify () сериализует объект или значение JS в строку JSON.

JSON.stringify({});                  // '{}'
JSON.stringify(true);                // 'true'
JSON.stringify('foo');               // '"foo"'
JSON.stringify([1, 'false', false]); // '[1,"false",false]'
JSON.stringify({ x: 5 });            // '{"x":5}'

JSON.stringify(new Date(2006, 0, 2, 15, 4, 5)) 
// '"2006-01-02T15:04:05.000Z"'

JSON.stringify({ x: 5, y: 6 });
// '{"x":5,"y":6}' or '{"y":6,"x":5}'
JSON.stringify([new Number(1), new String('false'), new Boolean(false)]);
// '[1,"false",false]'

JSON.parse ()

Метод JSON.parse () анализирует строку как JSON, дополнительно преобразовывая полученное значение.

JSON.parse('{}');              // {}
JSON.parse('true');            // true
JSON.parse('"foo"');           // "foo"
JSON.parse('[1, 5, "false"]'); // [1, 5, "false"]
JSON.parse('null');            // null
Бхушан Гадекар
источник
7
Лучшее название для parse()будет objectify()или jsonify().
Ню Эверест
Почему не JSON.toString () и JSON.toObject ()? Я бы предпочел эти имена (особенно полезно для новых программистов, которые используют intellisense).
Ричард Шассеро
2
у вас может быть сообщение developer.mozilla.org/en/docs/Web/JavaScript/Reference/… вместо копирования
Mahi
@nueverest jsonify()будет неоднозначным и вводит в заблуждение, так как parse()это не преобразовать Stringк JSONтипу (что jsonify()бы показывает), но parse()преобразует JSON-отформатированные String в любой из: Object, Array, Number, String, Booleanили null. Люди часто путают JSON со «строковым представлением» и Object(или dictв Python и т. Д.).
января
22

Во-первых, JSON.stringify()функция преобразует значение JavaScript в строку JavaScript Object Notation (JSON). JSON.parse()Функция преобразует строку JavaScript Object Notation (JSON) в объект. Для получения дополнительной информации об этих двух функциях, пожалуйста, обратитесь к следующим ссылкам.

https://msdn.microsoft.com/library/cc836459(v=vs.94).aspx https://msdn.microsoft.com/library/cc836466(v=vs.94).aspx

Во-вторых, следующий пример поможет вам понять эти две функции.

<form id="form1" runat="server">
    <div>
        <div id="result"></div>
    </div>
</form>

<script>
    $(function () {
        //define a json object
        var employee = { "name": "John Johnson", "street": "Oslo West 16", "phone": "555 1234567" };

        //use JSON.stringify to convert it to json string
        var jsonstring = JSON.stringify(employee);
        $("#result").append('<p>json string: ' + jsonstring + '</p>');

        //convert json string to json object using JSON.parse function
        var jsonobject = JSON.parse(jsonstring);
        var info = '<ul><li>Name:' + jsonobject.name + '</li><li>Street:' + jsonobject.street + '</li><li>Phone:' + jsonobject.phone + '</li></ul>';

        $("#result").append('<p>json object:</p>');
        $("#result").append(info);
    });
</script>
Моу
источник
15
var log = { "page": window.location.href, 
        "item": "item", 
        "action": "action" };

log = JSON.stringify(log);
console.log(log);
console.log(JSON.parse(log));

// Вывод будет:

// Для 1-й консоли есть строка типа:

'{ "page": window.location.href,"item": "item","action": "action" }'

// Для 2-й консоли это объект типа:

Object {
page   : window.location.href,  
item   : "item",
action : "action" }
король нео
источник
7

JSON.stringify() Преобразует объект в строку.

JSON.parse() Преобразует строку JSON в объект.

Хамед Камрава
источник
2
«Совершенство достигается не тогда, когда нечего добавить, а когда нечего убрать». Антуан де Сент-Экзюпери
Ронни Ройстон
7

Настоящая путаница здесь не в синтаксическом анализе против stringify, а в типе данных dataпараметра обратного вызова success.

data может быть или необработанным ответом, то есть строкой, или это может быть объект JavaScript, согласно документации:

успех

Тип: Function (Все данные, String textStatus, jqXHR jqXHR) Функция, вызываемая в случае успешного выполнения запроса. Функция получает три аргумента: данные, возвращаемые с сервера, отформатированные в соответствии с параметром dataType или функцией обратного вызова dataFilter, если она указана; <..>

И dataType по умолчанию установлен на «интеллектуальное предположение»

dataType (по умолчанию: Intelligent Guess (xml, json, script или html))

Тип: String Тип данных, которые вы ожидаете от сервера. Если ничего не указано, jQuery попытается вывести его на основе MIME-типа ответа (XML MIME-тип даст XML, в 1.4 JSON выдаст объект JavaScript, в 1.4 скрипт выполнит скрипт, а все остальное будет возвращается в виде строки).

Патрик
источник
2
Это очень полезное дополнение, потому что оно помогает понять, в чем суть путаницы!
rmcsharry
5

Они полная противоположность друг другу.

JSON.parse()используется для анализа данных, полученных как JSON ; он десериализует в строку JSON в объект JavaScript .

JSON.stringify()с другой стороны, используется для создания строки JSON из объекта или массива ; он упорядочивает на объект JavaScript в строку JSON .

nyedidikeke
источник
4

JavaScript Object <-> JSON String


JSON.stringify() <-> JSON.parse()

JSON.stringify (obj) - принимает любой сериализуемый объект и возвращает представление JSON в виде строки.

JSON.stringify() -> Object To String.

JSON.parse (string) - принимает правильно сформированную строку JSON и возвращает соответствующий объект JavaScript.

JSON.parse() -> String To Object.

Объяснение: JSON.stringify (obj [, replacer [, пробел]]);

Replacer / Space - необязательный или принимает целочисленное значение, или вы можете вызвать функцию возврата типа integer.

function replacer(key, value) {
    if (typeof value === 'number' && !isFinite(value)) {
        return String(value);
    }
    return value;
}
  • Replacer Just Используйте для замены не конечного нет на ноль.
  • Использование пространства для отступа строки Json
Zigri2612
источник
4

Они противостоят друг другу. JSON.Stringify()преобразует JSON в строку и JSON.Parse()анализирует строку в JSON.

Дэвид Кармона
источник
4

Я не знаю, упоминалось ли это, но одно из применений JSON.parse (JSON.stringify (myObject)) заключается в создании клона исходного объекта.

Это удобно, когда вы хотите связываться с некоторыми данными, не затрагивая исходный объект. Вероятно, не самый чистый / самый быстрый способ, но, конечно, самый простой для объектов, которые не очень сложны.

П. Браун
источник
3

JSON.stringify(obj [, replacer [, space]]) - берет любой сериализуемый объект и возвращает представление JSON в виде строки.

JSON.parse(string) - принимает правильно сформированную строку JSON и возвращает соответствующий объект JavaScript.

Глэдсон Робинсон
источник
1

JSON: Он в основном используется для обмена данными с сервером. Перед отправкой объекта JSON на сервер он должен быть строкой.

JSON.stringify() //Converts the JSON object into the string representation.
var jsonData={"Name":"ABC","Dept":"Software"};// It is a JSON object
var jsonString=JSON.stringify(jsonData);// It is a string representation of the object
// jsonString === '{"Name":"ABC","Dept":"Software"}'; is true

Он также преобразует массив Javascript в строку

var arrayObject=["ABC","Software"];// It is array object
var arrString=JSON.stringify(array);// It is string representation of the array (object)
// arrString === '["ABC","Software"]'; is true 

Когда мы получили данные JSON с сервера, данные были бы в формате строки. Поэтому мы конвертируем строку в объект JSON.

JSON.parse() //To convert the string into JSON object.
var data='{ "name":"ABC", "Dept":"Software"}'// it is a string (even though it looks like an object)
var JsonData= JSON.parse(data);// It is a JSON Object representation of the string.
// JsonData === { "name":"ABC", "Dept":"Software"}; is true
Шео Дайал Сингх
источник
1

JSON.parse()используется для преобразования String в Object.
JSON.stringify()используется для преобразования объекта в строку

Вы можете сослаться на это тоже ...

<script type="text/javascript">

function ajax_get_json(){

    var hr = new XMLHttpRequest();
    hr.open("GET", "JSON/mylist.json", true);
    hr.setRequestHeader("Content-type", "application/json",true);
    hr.onreadystatechange = function() {
        if(hr.readyState == 4 && hr.status == 200) {
           /*  var return_data = hr.responseText; */

           var data=JSON.parse(hr.responseText);
           var status=document.getElementById("status");
           status.innerHTML = "";
           /* status.innerHTML=data.u1.country;  */
           for(var obj in data)
               {
               status.innerHTML+=data[obj].uname+" is in "+data[obj].country+"<br/>";
               }

        }
    }
    hr.send(null);
    status.innerHTML = "requesting...";
}
</script>
Прия лог
источник
1

JSON.parse () принимает строку JSON и преобразует ее в объект JavaScript.

JSON.stringify () принимает объект JavaScript и преобразует его в строку JSON.

const myObj = {
      name: 'bipon',
      age: 25,
      favoriteFood: 'fish curry'
};

 const myObjStr = JSON.stringify(myObj);

console.log(myObjStr);
// "{"name":"bipon","age":26,"favoriteFood":"fish curry"}"

console.log(JSON.parse(myObjStr));
 // Object {name:"bipon",age:26,favoriteFood:"fish curry"}
И хотя методы обычно используются на объектах, они также могут использоваться на массивах:
const myArr = ['simon', 'gomez', 'john'];

const myArrStr = JSON.stringify(myArr);

console.log(myArrStr);
// "["simon","gomez","john"]"

console.log(JSON.parse(myArrStr));
// ["simon","gomez","john"]
Бипон Бисвас
источник