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

У цьому посібнику ми розберемо:

  • що таке JSON і чому він такий популярний
  • базовий синтаксис і типи даних
  • як створювати JSON-файли
  • приклади роботи з JSON у JavaScript та Python
  • поширені помилки
  • як JSON застосовується у реальних API

Що таке JSON

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

Основні переваги JSON:

  • Легкий та компактний – має просту структуру, без зайвих символів, що дозволяє швидко передавати дані через мережу.
  • Зрозумілий людині – його простіше читати і писати, ніж, наприклад, XML.
  • Підтримується більшістю мов програмування – JavaScript, Python, Java, Go та багато інших мають вбудовану роботу з JSON.
  • Універсальний – однаково добре підходить для API, конфігураційних файлів і збереження структурованих даних.

Синтаксис JSON

JSON складається з двох базових структур:

  • Об’єкти – зберігають дані у вигляді пар «ключ: значення», записуються у фігурних дужках {}.
  • Масиви – впорядковані списки значень, записуються у квадратних дужках [].

Основні правила:

  • ключі завжди беруться у подвійні лапки " "
  • рядки також у подвійних лапках
  • після останнього елемента кома не ставиться

Приклад JSON:

{
  "name": "Alice",
  "age": 25,
  "isStudent": false,
  "skills": ["Python", "JavaScript", "SQL"],
  "address": {
    "city": "Kyiv",
    "zip": "01001"
  }
}

У цьому прикладі:

  • є об’єкт з ключами name, age, isStudent, skills, address
  • масив skills у квадратних дужках містить кілька значень
  • вкладений об’єкт address описує адресу

Типи даних у JSON

JSON підтримує лише кілька базових типів:

String (рядок):

"Hello World"

Number (число):

43

Boolean (логічне значення):

true

Null (порожнє значення):

null

Array (масив):

[1, 2, "three", false]

Object (об’єкт):

{
  "name": "Alex",
  "age": 28,
  "isAdmin": true
}

Приклад JSON-файлу

JSON-файли зазвичай мають розширення .json.

Файл users.json:

[
  {
    "name": "Alex",
    "age": 28,
    "skills": ["Python", "JS", "Testing"]
  },
  {
    "name": "Olha",
    "age": 25,
    "skills": ["Design", "Figma", "CSS"]
  }
]

У цьому прикладі маємо масив з двох об’єктів, де кожен об’єкт описує користувача та містить поля:

  • name – рядок з ім’ям користувача
  • age – число (вік)
  • skills – масив рядків з переліком навичок

Використання JSON у JavaScript

Коли ви працюєте у браузері або Node.js, JSON зазвичай надходить у вигляді рядка. Щоб працювати з ним, потрібно або перетворити рядок у об’єкт, або навпаки – об’єкт у JSON.

Метод JSON.parse() перетворює JSON-рядок у JavaScript-об’єкт:

const userJson = '{"name": "Alex", "age": 28}';

const userObj = JSON.parse(userJson);
console.log(userObj.name); // Alex

Метод JSON.stringify() робить з об’єкта рядок у форматі JSON:

const jsonString = JSON.stringify(userObj);
console.log(jsonString); // {"name":"Alex","age":28}

Допис про роботу з форматом JSON у JavaScript

Використання JSON у Python

У Python для роботи з JSON використовується стандартний модуль json.

Метод json.loads() перетворює JSON-рядок у Python-словник:

import json

user_json = '{"name": "Alex", "age": 28}'
user_dict = json.loads(user_json)

print(user_dict['name'])  # Alex

Метод json.dumps() робить зі словника рядок у форматі JSON:

json_string = json.dumps(user_dict)
print(json_string)  # {"name": "Alex", "age": 28}

Допис про модуль json у Python

Поширені помилки при роботі з JSON

1. Зайва кома після останнього елемента

Неправильно:

{
  "name": "Alex",
  "age": 28,
}

Правильно:

{
  "name": "Alex",
  "age": 28
}

2. Одинарні лапки замість подвійних

Неправильно:

{'name': 'Alex'}

Правильно:

{ "name": "Alex" }

3. Ключі без лапок

Неправильно:

{ name: "Alex" }

Правильно:

{ "name": "Alex" }

4. Змішування типів у масиві

Не є помилкою, але може заплутати:

[1, "two", false, { "id": 3 }]

Хоча це допустимо в JSON, краще робити масиви однорідними.

5. Коментарі в JSON

JSON офіційно не підтримує коментарі.

Неправильно:

{
  "name": "Alex" // це ім'я користувача
}

Альтернатива: використовувати службове поле:

{
  "name": "Alex",
  "_comment": "це ім'я користувача"
}

6. Проблеми з кодуванням символів

JSON має бути у кодуванні UTF-8. Якщо файл збережено в іншому кодуванні, парсер може видати помилку.

JSON у реальних API

Одне з головних застосувань JSON – обмін даними між клієнтом та сервером через API.

Приклад отримання даних про користувача, запит GET:

GET https://jsonplaceholder.typicode.com/users/1

Відповідь сервера у JSON:

{
  "id": 1,
  "name": "Leanne Graham",
  "username": "Bret",
  "email": "Sincere@april.biz",
  "address": {
    "street": "Kulas Light",
    "suite": "Apt. 556",
    "city": "Gwenborough",
    "zipcode": "92998-3874",
    "geo": {
      "lat": "-37.3159",
      "lng": "81.1496"
    }
  },
  "phone": "1-770-736-8031 x56442",
  "website": "hildegard.org",
  "company": {
    "name": "Romaguera-Crona",
    "catchPhrase": "Multi-layered client-server neural-net",
    "bs": "harness real-time e-markets"
  }
}

Приклад створення нового користувача, запит POST:

POST https://jsonplaceholder.typicode.com/users
Content-Type: application/json

{
  "name": "Olha",
  "email": "olha@example.com"
}

Відповідь сервера у JSON:

{
  "id": 11,
  "name": "Olha",
  "email": "olha@example.com"
}

Як це може виглядати у коді:

JavaScript (fetch):

const response = await fetch('https://jsonplaceholder.typicode.com/users/1');
const data = await response.json();

console.log(data.name); // Leanne Graham

Детальніше: Fetch API у JavaScript

Python (requests):

import requests

response = requests.get('https://jsonplaceholder.typicode.com/users/1')
data = response.json()

print(data['name'])  # Leanne Graham

Детальніше: Requests Python

Підсумок

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


Мітки: