Що таке JSON?

JavaScriptJunior~2 хв читання

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

JSON (JavaScript Object Notation) - це текстовий формат для зберігання та обміну даними, зрозумілий як людям, так і комп'ютерам.

Приклад JSON

javascript

{
  "name": "Oleh",
  "age": 25,
  "isAdmin": false,
  "skills": ["JavaScript", "React", "Node.js"],
  "address": {
    "city": "Kyiv",
    "zip": 123456
  }
}

Це звичайний JSON-документ. По суті, це рядок, у якому зберігаються структуровані дані. Такі дані легко читати і передавати мережею.

Де використовується JSON

Обмін даними між клієнтом і сервером Сервер надсилає JSON, браузер його читає:

javascript

fetch('/api/user')
  .then(res => res.json())
  .then(data => console.log(data.name));

Зберігання даних у localStorage

javascript

const user = { name: 'Oleh', age: 25 };
localStorage.setItem('user', JSON.stringify(user));

Налаштування і конфігурації (наприклад, package.json у Node.js-проєктах):

javascript

{
  "name": "my-project",
  "version": "1.0.0",
  "scripts": {
    "start": "node index.js"
  }
}

Правила синтаксису JSON

Правило	Опис
Ключі - завжди в подвійних лапках	`"name": "Oleh"`
Рядки - теж у подвійних лапках	`"city": "Kyiv"`
Підтримуються лише прості типи	`string`, `number`, `boolean`, `null`, `object`, `array`
Немає функцій	`function() {}` → помилка
Немає `undefined` і `Symbol`	вони ігноруються
Кома між елементами	але не після останнього елемента

Основні типи даних JSON

Тип	Приклад
string	`"Oleh"`
number	`25`
boolean	`true`, `false`
null	`null`
object	`{ "a": 1, "b": 2 }`
array	`[1, 2, 3]`

Відмінність JSON від об'єктів JavaScript

Особливість	JSON	Об'єкт JavaScript
Ключі	Лише в `"подвійних лапках"`	Можна без лапок
Рядки	Лише `"подвійні"`	`'одинарні'` або `"подвійні"`
Типи	Лише прості (`string`, `number` тощо)	Будь-які (`function`, `undefined`, `symbol`)
Призначення	Зберігання/обмін даними	Робота в коді JS

Перетворення між об'єктом і JSON

javascript

const obj = { name: 'Oleh', age: 25 };

// об'єкт → JSON
const json = JSON.stringify(obj);
console.log(json);
// '{"name":"Oleh","age":25}'

// JSON → об'єкт
const parsed = JSON.parse(json);
console.log(parsed.name); // 'Oleh'

Підсумок

Параметр	JSON
Повна назва	JavaScript Object Notation
Формат	Текстовий
Використовується для	Зберігання та обміну даними
Типові операції	`JSON.stringify()` і `JSON.parse()`
Заснований на	Синтаксисі JavaScript
Підтримується	В усіх мовах (Python, Java, C#, Go тощо)

Коротко

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

Коротка відповідь

Для співбесіди

Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.