Istoriya.v.ua

Припустимо, ми маємо складний об'єкт, і ми хотіли б перетворити його в рядок, щоб відправити по мережі або просто вивести для логування.

Звичайно, такий рядок повинен включати всі важливі властивості.

Ми могли б реалізувати перетворення таким чином:

let user = < name: "John", age: 30, toString() < return `", age: $>`; > >;alert(user); //

…Але в процесі розробки додаються нові властивості, старі властивості перейменовуються та видаляються. Оновлення такого доString щоразу може стати проблемою. Ми могли б спробувати перебрати властивості в ньому, але що якщо об'єкт складний, і в його властивостях є вкладені об'єкти? Ми повинні були б здійснити їхнє перетворення теж.

На щастя, немає потреби писати код для обробки всього цього. Завдання має просте рішення.

JSON.stringify

JSON (JavaScript Object Notation) – це загальний формат для представлення значень та об'єктів. Його опис задокументований у стандарті RFC 4627. Спочатку він був створений для JavaScript, але багато інших мов також мають бібліотеки, які можуть працювати з ним. Таким чином, JSON легко використовувати для обміну даними, коли клієнт використовує JavaScript, а сервер написаний Ruby/PHP/Java або будь-якою іншою мовою.

JavaScript надає методи:

• JSON.stringify для перетворення об'єктів у JSON.
• JSON.parse для перетворення JSON назад на об'єкт.

Наприклад, тут ми перетворимо через JSON.stringify дані студента:

let student = < name: 'John', age: 30, isAdmin: false, курси: ['html', 'css', 'js'], wife: null >; let json = JSON.stringify(student); alert(typeof json); // Ми отримали рядок! alert(json); /* виведе об'єкт у форматі JSON: <"name": "John", "age": 30, "isAdmin": false, "courses": ["html", "css", "js"], "wife" : null >*/

Метод JSON.stringify(student) бере об'єкт і перетворює його на рядок.

Отриманий рядок json називається JSON-форматованим або серіалізованим об'єктом. Ми можемо відправити його через мережу або помістити у звичайне сховище даних.

Зверніть увагу, що об'єкт у форматі JSON має кілька важливих відмінностей від об'єктного літералу:

• Рядки використовують подвійні лапки. Жодних одинарних лапок або зворотних лапок у JSON. Так 'John' стає "John".
• Імена властивостей об'єкта також полягають у подвійні лапки. Це неодмінно. Так age:30 стає "age":30.

JSON.stringify може бути застосований і до примітивів.

JSON підтримує такі типи даних:

• Об'єкти
• Масиви [ . ]
• Примітиви:
  • рядки,
  • числа,
  • логічні значення true/false ,
  • null.

  // число в JSON залишається числом alert( JSON.stringify(1) ) // 1 // рядок у JSON, як і раніше, залишається рядком, але в подвійних лапках alert( JSON.stringify('test') ) // "test" alert(JSON.stringify(true)); // true alert( JSON.stringify([1, 2, 3]) ); // [1,2,3]

  JSON є незалежною від мови специфікацією даних, тому JSON.stringify пропускає деякі специфічні властивості об'єктів JavaScript.

  • Властивості-функції (методи).
  • Символьні ключі та значення.
  • Властивості, що містять undefined.

  let user = < sayHi() < // буде пропущено alert("Hello"); >, [Symbol("id")]: 123, // також буде пропущено something: undefined // як і це - пропущено >; alert(JSON.stringify(user)); // (порожній об'єкт)

  Зазвичай, це нормально. Якщо це не те, чого ми хочемо, то незабаром побачимо, як можна налаштувати цей процес.

  Найпрекрасніше, що вкладені об'єкти підтримуються та конвертуються автоматично.

  let meetup = < title: "Conference", room: < number: 23, participants: ["john", "ann"] >>; alert(JSON.stringify(meetup)); /* вся структура перетворена на рядок: < "title":"Conference", "room":, > */

  Важливе обмеження: не повинно бути циклічних посилань.

  let room = < number: 23 >; let meetup = <title: "Conference", participants: ["john", "ann"]>; meetup.place=room; // meetup посилається на room room.occupiedBy = meetup; // room посилається на meetup JSON. stringify (meetup); // Помилка: Перетворення циклічної структури на JSON

  Тут перетворення завершується невдало через циклічне посилання: room.occupiedBy посилається на meetup , і meetup.place посилається на room :

  Виключаємо та перетворюємо: replacer

  Повний синтаксис JSON.stringify:

  let json = JSON.stringify(value[, replacer, space])

  value Значення кодування. replacer Масив властивостей кодування або функція відповідності function(key, value) . space Додатковий простір (відступи) для форматування.

  Найчастіше JSON.stringify використовується лише з першим аргументом. Але якщо нам потрібно налаштувати процес заміни, наприклад, відфільтрувати циклічні посилання, можна використовувати другий аргумент JSON.stringify .

  Якщо ми передамо йому масив властивостей, буде закодовано лише ці властивості.

  let room = < number: 23 >; let meetup = <title: "Conference", participants: [, ], place: room // meetup посилається на room>; room.occupiedBy = meetup; // room посилається на meetup alert( JSON.stringify(meetup, ['title', 'participants']))); // <"title":"Conference","participants":[<>,<>]>

  Тут ми, напевно, надто суворі. Список властивостей застосовується до структури об'єкта. Тож усередині participants – порожні об'єкти, тому що name немає у списку.

  Давайте включимо до списку всі властивості, крім room.occupiedBy , через який з'являється циклічне посилання:

  let room = < number: 23 >; let meetup = <title: "Conference", participants: [, ], place: room // meetup посилається на room>; room.occupiedBy = meetup; // room посилається на meetup alert( JSON.stringify(meetup, ['title', 'participants', 'place', 'name', 'number']) ); /* < "title":"Conference", "participants":[,], "place": > */

  Тепер все, крім задіяних, серіалізовано. Але перелік властивостей досить довгий.

  На щастя, як replacer ми можемо використовувати функцію, а не масив.

  Функція буде викликатись для кожної пари (key, value), і вона повинна повертати замінене значення, яке використовуватиметься замість вихідного. Або undefined , щоб пропустити значення.

  У нашому випадку ми можемо повернути value «як є» для всього, крім occupiedBy . Щоб ігнорувати occupiedBy , код нижче повертає undefined :

  let room = < number: 23 >; let meetup = <title: "Conference", participants: [, ], place: room // meetup посилається на room>; room.occupiedBy = meetup; // room посилається на meetup alert( JSON.stringify(meetup, function replacer(key, value) < alert(`$: $`); return (key == 'occupiedBy') ? undefined : value; >)); /* пари ключ: значення, які приходять у replacer: : [object Object] title: Conference participants: [object Object],[object Object] 0: [object Object] name: John 1: [object Object] name: Alice place : [object Object] number: 23 occupiedBy: [object Object] */

  Зверніть увагу, що функція replacer отримує кожну пару ключ/значення, включаючи вкладені об'єкти та елементи масиву. І вона застосовується рекурсивно. Значення this всередині replacer – це об'єкт, що містить поточну властивість.

  Перший виклик – особливий. Йому передається спеціальний «об'єкт-обгортка»: . Іншими словами, перша (key, value) пара має порожній ключ, а значенням є цільовий об'єкт загалом. Ось чому перший рядок із прикладу вище буде ": [object Object]".

  Ідея полягає в тому, щоб дати якомога більше можливостей replacer – він має можливість проаналізувати та замінити/пропустити навіть весь об'єкт цілком, якщо це необхідно.

  Форматування: space

  Третій аргумент у JSON.stringify(value, replacer, space) – це кількість пробілів, які використовуються для зручного форматування.

  Раніше всі JSON-форматовані об'єкти не мали відступів та зайвих прогалин. Це нормально, якщо ми хочемо відправити об'єкт через мережу. Аргумент space використовується виключно для виведення в легкочитаному вигляді.

  Нижче space = 2 вказує JavaScript відображати вкладені об'єкти в кілька рядків з відступом 2 пробіли всередині об'єкта:

  let user = < name: "John", age: 25, roles: < isAdmin: false, isEditor: true >>; alert(JSON.stringify(user, null, 2)); /* відступ у 2 пробіли: < "name": "John", "age": 25, "roles": < "isAdmin": false, "isEditor": true >> */ /* для JSON.stringify(user , null, 4) результат містить більше відступів: < "name": "John", "age": 25, "roles": < "isAdmin": false, "isEditor": true >> */

  Третім аргументом може бути рядок. У цьому випадку рядок буде використовуватися для відступу замість ряду пробілів.

  Параметр space застосовується виключно для логування та гарного виведення.

  Користувальницький «toJSON»

  Як і toString для перетворення рядків, об'єкт може надавати метод toJSON для перетворення на JSON. JSON.stringify автоматично викликає його, якщо він є.

  let room = < number: 23 >; let meetup = <title: "Conference", date: new Date(Date.UTC(2017, 0, 1)), room>; alert(JSON.stringify(meetup)); /* < "title":"Conference", "date":"2017-01-01T00:00:00.000Z", // (1) "room": // (2) > */

  Як бачимо, date(1) став рядком. Це тому, що всі об'єкти типу Date мають вбудований метод toJSON, який повертає такий рядок.

  Тепер давайте додамо власну реалізацію методу toJSON у наш об'єкт room (2) :

  let room = < number: 23, toJSON() < return this.number; >>; let meetup = <title: "Conference", room>; alert(JSON.stringify(room)); // 23 alert(JSON.stringify(meetup)); /* < "title":"Conference", "room": 23 >*/

  Як бачите, toJSON використовується як при прямому виклику JSON.stringify(room) , так і коли room вкладений в інший об'єкт, що серіалізується.

  JSON.parse

  Щоб декодувати JSON-рядок, нам потрібен інший метод під назвою JSON.parse.

  let value = JSON.parse(str[, reviver]);

  str JSON для перетворення на об'єкт. reviver Необов'язкова функція, яка буде викликатись для кожної пари (ключ, значення) і може перетворювати значення.

  // рядковий масив let numbers = "[0, 1, 2, 3]"; numbers = JSON.parse(numbers); alert(numbers[1]); // 1

  Або для вкладених об'єктів:

  let user = '< "name": "John", "age": 35, "isAdmin": false, "friends": [0,1,2,3] >'; user = JSON.parse(user); alert(user.friends[1]); // 1

  JSON може бути настільки складним, наскільки це необхідно, об'єкти та масиви можуть включати інші об'єкти та масиви. Але вони мають бути у тому ж JSON-форматі.

  Ось типові помилки в написаному від руки JSON (іноді доводиться писати його для налагодження):

  Крім того, JSON не підтримує коментарів. Додавання коментаря до JSON робить його недійсним.

  Існує ще один формат JSON5, який підтримує ключі без лапок, коментарі та ін. Але це самостійна бібліотека, а чи не специфікація мови.

  Звичайний JSON настільки суворий не тому, що його розробники ліниві, а тому, що дозволяє легко, надійно та дуже швидко реалізовувати алгоритм кодування та читання.

  Використання reviver

  Уявіть, що ми отримали об'єкт meetup із сервера у вигляді рядка даних.

  // title: (meetup title), date: (meetup date) let str = '';

  …А тепер нам потрібно десеріалізувати її, тобто. знову перетворити на об'єкт JavaScript.

  Давайте зробимо це, викликавши JSON.parse :

  let str = ''; let meetup = JSON.parse(str); alert(meetup.date.getDate()); // Помилка!

  Значенням meetup.date є рядок, а не об'єкт Date. Як JSON.parse міг знати, що він повинен був перетворити цей рядок на Date ?

  Давайте передамо JSON.parse функцію відновлення другим аргументом, яка повертає всі значення "як є", але date стане Date :

  let str = ''; let meetup = JSON.parse(str, function(key, value) < if (key == 'date') return new Date(value); return value; >); alert(meetup.date.getDate()); // 30 – тепер працює!

  До речі, це працює і для вкладених об'єктів:

  let schedule = `< "meetups": [ , ] >`; schedule = JSON.parse(schedule, function(key, value) < if (key == 'date') return new Date(value); return value; >); alert( schedule.meetups[1].date.getDate() ); // 18 - чудово!

  Разом

  • JSON – це формат даних, який має власний незалежний стандарт та бібліотеки для більшості мов програмування.
  • JSON підтримує прості об'єкти, масиви, рядки, числа, логічні значення та null.
  • JavaScript надає методи JSON.stringify для серіалізації в JSON та JSON.parse для читання з JSON.
  • Обидва методи підтримують функції перетворення інтелектуального читання/запису.
  • Якщо об'єкт має метод toJSON, він викликається через JSON.stringify.

  Завдання

  Перетворіть об'єкт на JSON, а потім назад на звичайний об'єкт

  Перетворіть user на JSON, потім прочитайте цей JSON на іншу змінну.

  Зазвичай JSON використовується для обміну даними із сервером.

  При надсиланні на сервер дані завжди передаються у вигляді рядка.

  Для перетворення об'єкта JavaScript на рядок використовується функція JSON.stringify().

  Перетворення об'єкта JavaScript на рядок

  Припустимо, що у нас є наступний об'єкт JavaScript:

  Скористаємося JavaScript функцією JSON.stringify() і перетворимо його на рядок:

   var myJSON = JSON.stringify(obj); 

  В результаті у нас буде рядок, записаний за правилами JSON.

  Тепер myJSON готовий до відправки на сервер рядок:

   var obj = <"name":"John", "age":30, "city":"New York">; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON; 

  Перетворення JavaScript в рядок

  Також, ми можемо перетворити масиви JavaScript в рядок JSON.

  Припустимо, що у нас є наступний об'єкт JavaScript:

   var arr = ["John", "Peter", "Sally", "Jane"]; 

  Скористаємося JavaScript функцією JSON.stringify() і перетворимо його на рядок:

   var myJSON = JSON.stringify(arr); 

  В результаті у нас буде рядок, записаний за правилами JSON.

  Тепер myJSON готовий до відправки на сервер рядок:

   var arr = ["John", "Peter", "Sally", "Jane"]; var myJSON = JSON.stringify(arr); document.getElementById("demo").innerHTML = myJSON; 

  Перетворення дат на рядок

  Об'єкти дати та часу (тип Date) не можна використовувати в JSON. Функція JSON.stringify() дозволяє перетворити будь-який об'єкт дати в рядок JSON.

   var obj = <"name":"John", "today":new Date(), "city":"New York">; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON; 

  При отриманні даних із сервера ви зможете перетворити рядок на об'єкт дати назад.

  Перетворення функцій на рядок

  Функції не можна використовувати у JSON.

  Функція JSON.stringify() видалить будь-яку функцію з об'єкта JavaScript, і ключ, і значення:

   var obj = <"name":"John", "age":function(), "city":"New York">; var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON; 

  Цього можна уникнути, якщо перетворити функцію на рядок до того, як використовувати функцію JSON.stringify().

   var obj = <"name":"John", "age":function(), "city":"New York">; obj.age = obj.age.toString(); var myJSON = JSON.stringify(obj); document.getElementById("demo").innerHTML = myJSON; 

  Увага! Слід уникати використання функцій у JSON, тому що в цьому випадку втрачається їхня область видимості, а для зворотного перетворення доводиться використовувати функцію eval(), що небажано.

  Підтримка браузерами

  Функція JSON.stringify() включена у всі основні браузери та останній стандарт ECMAScript (JavaScript).

  Конвертер String в JSON – це веб-інструмент, який миттєво перетворює ваш неправильно структурований рядок на зрозумілий JSON і відображає код у вигляді дерева, звичайного тексту та форми. Вам не потрібно виконувати будь-які непотрібні процедури для перетворення рядків на JSON.

  Як використовувати наш конвертер рядків у JSON?

  Ви можете виконати такі кроки, щоб перетворити рядок на JSON за допомогою нашого інструменту.

  Після доступу до цього конвертера рядка в JSON введіть або вставте рядок у поле.

  Крім цього, користувачі також можуть завантажити файл, що зберігається на їх пристрої, або отримати рядок, ввівши URL-адресу, яка містить її.

  Після цього натисніть кнопку «Перетворити на JSON», щоб розпочати процес.

  Ви можете завантажити рядковий файл, натиснувши кнопку «Завантажити».

  Приклад JSON

  Розуміння синтаксису JSON необхідно, якщо ви хочете ефективно знати логіку та роботу JSON. Ви можете познайомитись зі структурою JSON, розглянувши наступний приклад.

  Click here to copy code

  Ключові особливості нашого конвертера рядків у JSON

  Наш онлайн інструмент String to JSON надає видатні функції для всіх без будь-яких витрат. Деякі веб-сайти надають послуги перетворення String в JSON JavaScript, але більшість з них можуть не відповідати нашому інструменту. Деякі з основних функцій нашого інструменту перетворення рядка JSON обговорюються нижче.

  Зручний інтерфейс

  Супер-зручний інтерфейс користувача і чіткі інструкції нашого онлайн-інструменту дозволяють користувачам без проблем конвертувати великі і неоднозначні рядки в JSON. Ви не зіткнетеся з будь-якими складнощами при використанні нашого онлайн-конвертера рядків у JSON через його простий для розуміння структури.

  Перетворення рядка на JSON одним клацанням миші

  Процес перетворення рядка в JSON за допомогою нашого онлайн-конвертера не потребує жодних складнощів. Ви можете перетворити свої рядки в JSON одним клацанням миші на кнопку «Конвертувати в JSON».

  Підтримка кількох варіантів завантаження коду

  Як згадувалося раніше, це не звичайний інструмент, який дозволяє користувачам просто копіювати та вставляти рядки. Ви також можете завантажити файл, збережений на вашому пристрої, або отримати рядки, просто ввівши URL-адресу.

  Немає необхідності в установці програмного забезпечення

  Багато людей можуть сумніватися, що їм доведеться встановити на свій пристрій спеціальне програмне забезпечення для перетворення рядкових файлів на JSON. Наш інструмент дозволяє перетворити довгий рядок на JSON без встановлення будь-якого програмного забезпечення.

  Сумісність з усіма операційними системами

  Звичайна проблема, з якою стикаються люди, які користуються онлайн-інструментами, полягає в тому, що вони можуть використовувати їх у певній операційній системі. Але наш онлайн-конвертер рядків в JSON доступний будь-якого пристрою, будь то Android, iOS, Windows, Linux або Mac.

  Завантажити дані JSON

  Після завершення процесу перетворення вам не потрібно копіювати код JSON і вставляти його у файл, оскільки наш інструмент надає можливість завантаження. Всього одним клацанням на кнопку «Завантажити» файл буде збережено на вашому пристрої.

  Швидке та безпечне перетворення

  Немає необхідності чекати годинами, щоб отримати перетворений файл JSON, як це може знадобитися під час використання інших онлайн-інструментів JSON. Наш інструмент забезпечує найбезпечніше та швидке перетворення ваших рядків у файли JSON.

  Легкий доступ із будь-якого місця

  Якщо ви думаєте, що вам потрібно сидіти в своєму офісі, класі або іншому місці, щоб отримати допомогу від нашого інструменту JSON, то це зовсім не так. До нашого інструменту можна отримати доступ із будь-якого куточка планети за наявності надійного підключення до Інтернету.

  Перетворення рядка на JSON – механізм у розпізнаний

  Рядок є життєво важливим елементом для веб-розробників, оскільки він допомагає їм з'єднувати або обмінюватися даними між двома або більше серверами/комп'ютерами. Рядок містить масив значень, і кожен масив укладений у квадратні дужки. Список значень у рядку розділяється комою.

  Однак інтерпретація рядків стає незручною для людей, коли вони є складовою структурою даних.Тут ви можете використовувати наш інструмент перетворення рядка в JSON для перетворення складних рядків в JSON, який є легким і простим для розуміння формату обміну даними.

  Більше того, якщо ви включитеся в ручний процес перетворення рядка в JSON, це вимагатиме багато часу та зусиль. Крім того, ви не можете бути впевнені, що перетворення буде на 100% точним, оскільки людський фактор – часте явище. Отже, простий вихід – конвертувати String в JSON онлайн за допомогою нашого конвертера. Просто завантаживши рядок і натиснувши кнопку, ви можете перетворити рядок на об'єкти JSON за лічені секунди.

  Розуміння методу JSON.stringify()

  Як програміст, ви могли подумати, що JSON.stringify () – це процес у JavaScript, який представляє об'єкт JSON як аргумент і повертає дані JSON у рядковому форматі.

  Що робить спосіб JSON.stringify?

  Основна причина перетворення рядка у формат JSON полягає в тому, щоб його можна було легко передати в Інтернеті. Однак тут важливо розуміти, що інформація має бути в рядку, щоб надсилати або отримувати її через веб-сервер.

  Метод JSON.stringify () дозволяє перетворити ваш об'єкт JSON на текст JSON, який зберігається в рядку. Ви можете легко передати ці перетворені дані на веб-сервер без будь-яких вагань.

  Синтаксис JSON.stringify()

  Синтаксис JSON.stringify () наступний:

  JSON.stringify (значення, замінник, космос)

  Параметри JSON.stringify()

  Значення: Це значення, яке буде перетворено на рядок JSON.

  Замінник (необов'язково): Це функція, яка змінює поведінку всього процесу створення рядка або масиву рядків та чисел, яка працює як контрольний список для вибору атрибутів об'єкта значення, який буде додано у форматі JSON. Якщо значення дорівнює нулю, всі атрибути об'єкта будуть додані в результуючий рядок JSON.

  Пробіл (необов'язково): Об'єкт String, який можна використовувати для додавання пробілів до результуючого рядка JSON для розуміння. Якщо це число, воно вказує кількість прогалин, які будуть використовуватися як пробіли; це число покривається цифрою 10. Значення менше 1 означають, що простір не може бути використаний.

  JSON.stringify() Examples

  Бібліотеки для перетворення рядків на об'єкти JSON

  Наведені нижче бібліотеки найчастіше використовуються для перетворення String на об'єкти JSON.

  Бібліотека Джексона

  Бібліотека Джексона – ефективна бібліотека Java для перетворення об'єктів Java на JSON. Підтримка високопродуктивної потокової передачі робить цю бібліотеку Джексона найкращою бібліотекою для використання. Ця бібліотека може аналізувати великий висновок JSON із веб-застосунків, не завантажуючи його повністю.

  Проста бібліотека JSON

  Це ще одна безкоштовна бібліотека Java, яку цінують за перетворення рядка JSON на об'єкт JSON. Основна причина використання цієї бібліотеки JSON – її компактний розмір.

  Бібліотека Gson

  Gson також є ще однією корисною бібліотекою Java з відкритим вихідним кодом, представленої Google. Він широко використовується для швидкого перетворення JSON String на JSON Object і подальшого JSON Object на JSON String.

  Про перетворювач рядка в JSON

  Конвертер рядків у JSON, доступний на jsononline.net, – це ефективний інструмент, який дозволяє перетворювати текст JSON, логічні та числові значення на код JSON. Інструмент також автоматично виправляє ненавмисне включення розділових знаків і дозволяє усувати помилки, які важко виявити за допомогою ручних процедур.

  Як ви знаєте, рядок – це послідовність символів у правильному порядку; Було виявлено кілька правил розпізнавання складових утворень даних рядків. JSON – одна з тих мов або синтаксисів, які можуть описувати масиви, рядки, об'єкти, числа, логічні значення та значення NULL. Ці рядки можуть бути передані іншим аналогічним програмам для декодування та відображення інформації користувачеві.

  Наш інструмент розроблений, щоб надати вам максимальну зручність при кодуванні, виправленні та перетворенні рядків у JSON одним натисканням кнопки. Ви можете перетворити свій заплутаний код на акуратний разом з кількома властивостями перегляду, щоб спростити його читання. Крім того, ми також пропонуємо безкоштовний інструмент форматування JSON, який дозволяє швидко відформатувати код JSON за лічені секунди.