Різниця між JSON.stringify та JSON.parse


452

Мене збентежило використання цих двох методів розбору.

Після того, як я повторюю свої 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)).
Хафенкраніч

Відповіді:


674

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" 

9
json.stringify (json.parse (дані))? Я бачив це в коді ... так що це в основному перетворення даних json в об’єкт, а потім знову ревертування його в дані json ..
HIRA THAKUR

29
@MESSIAH - Так. Це багато в чому безглуздо, але може служити валідатором JSON.
Квентін

11
Також може бути використана проста копія об'єкта для парних значень об'єктних ключів.
hunterc

4
Я вважаю це дуже корисним для налагодження в консолі - це робить його легко читабельним.
kirgy

2
@Quentin ви могли б пояснити за допомогою прикладу?
Pardeep Jain

57

JSON.parse()є для "розбору" те, що було отримано як JSON.
JSON.stringify()полягає у створенні рядка JSON з об'єкта / масиву.


4
точність: це може бути не об’єкт.
Denys Séguret

Правда, також може бути масив або що-небудь, який Javascript визнає певним типом. Нижня лінія; він бере його і перетворює у відповідний еквівалент JSON.
Bjorn 'Bjeaurn' S

2
@dystroy - Це повинен бути об'єкт (зазначивши, що масиви - це об'єкти).
Квентін

2
@quentinJSON.stringify(3)
Denys Séguret

@dystroy - так, не зрозуміли, що вони розширили його для вирішення фрагментів JSON . Це неінтуїтивно.
Квентін

43

Вони зворотні один одному. JSON.stringify()серіалізує об'єкт JS в рядок JSON, тоді як JSON.parse()десеріалізує рядок JSON в об'єкт JS.


25

Вони є протилежностями один одного.

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().
nu everest

Чому б не 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 тощо).
jbmusso

21

По-перше, JSON.stringify()функція перетворює значення JavaScript в рядок нотації об'єкта JavaScript (JSON). JSON.parse()функція перетворює рядок нотації об'єкта JavaScript (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" }

6

JSON.stringify() Перетворює об’єкт у рядок.

JSON.parse() Перетворює рядок JSON в об'єкт.


2
"Досконалість досягається не тоді, коли більше нічого не можна додати, а коли не залишається нічого, щоб забрати". Антуан де Сент-Екзюпері
Ронні Ройстон

6

Справжня плутанина тут не в тому, щоб проаналізувати vs stringify, а про тип даних dataпараметра успішного зворотного виклику.

data може бути як необробленою відповіддю, тобто рядком, так і об’єктом JavaScript, відповідно до документації:

успіх

Тип: Функція (Будь-які дані, String textStatus, jqXHR jqXHR) Функція, яку потрібно викликати, якщо запит успішний. Функція передає три аргументи: дані, повернені з сервера, відформатовані відповідно до параметра dataType або функції зворотного виклику dataFilter, якщо вони вказані; <..>

А тип даних за замовчуванням налаштовується на "інтелектуальну здогадку"

dataType (за замовчуванням: Intelligent Guess (xml, json, script або html))

Тип: String Тип даних, які ви очікуєте від сервера. Якщо жоден не вказаний, jQuery спробує вивести його на основі типу відповіді MIME (тип XML MIME дасть XML, в 1.4 JSON дасть об’єкт JavaScript, в 1.4 сценарій виконає сценарій, і все інше буде повернуто як рядок).


2
Це дуже корисне доповнення, адже воно допомагає зрозуміти, в чому полягає плутанина!
rmcsharry

4

Об'єкт JavaScript <-> Рядок JSON


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 / Space - необов'язково або приймає ціле значення, або ви можете викликати функцію повернення типу interger.

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

4

Вони є цілковитою протилежністю один одному.

JSON.parse()використовується для розбору даних, отриманих як JSON ; він десеріалізует в рядок JSON в об'єкт JavaScript .

JSON.stringify()з іншого боку, використовується для створення рядка JSON з об'єкта чи масиву ; він серіалізує об’єкт JavaScript у рядок JSON .


4

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

Це зручно, коли ви хочете возитися з деякими даними, не впливаючи на оригінальний об’єкт. Напевно, не найчистіший / найшвидший спосіб, але, безумовно, найпростіший для об'єктів, які не є дуже складними.


3

JSON.stringify(obj [, replacer [, space]]) - Бере будь-який серіалізаційний об'єкт і повертає представлення JSON у вигляді рядка.

JSON.parse(string) - Бере добре сформований рядок JSON і повертає відповідний об’єкт JavaScript.


3

Вони протистоять один одному. JSON.Stringify()перетворює JSON у рядок і JSON.Parse()аналізує рядок у JSON.


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()використовується для перетворення Object в String.

Ви також можете посилатися на це ...

<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"]
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.