Нині ми живемо в епоху інформації, де величезні об’єми даних передаються туди-сюди між різними системами, сервісами і додатками. Щоб спростити цей процес, було створено формати даних, які сприяють легкому обміну та зберіганню інформації. Один з найпопулярніших таких форматів – JSON, або JavaScript Object Notation.
JSON – це текстовий формат даних, що використовується для передачі структурованих даних через веб. Він був введений як частина мови JavaScript, але на сьогоднішній день підтримується та активно використовується в більшості мов програмування. Велика кількість веб-API використовує JSON як формат обміну даними.
Ця стаття спрямована на детальне вивчення JSON, включаючи його основні концепції, методи серіалізації та десеріалізації даних, а також його роль у взаємодії з веб-сервером. Ми розглянемо практичні приклади використання JSON в різних мовах програмування, зокрема в JavaScript та Python, а також подивимося на створення простого веб-застосунку, який використовує JSON для обміну даними.
Основи JSON
JSON, або JavaScript Object Notation, — це формат даних, що базується на тексті й широко використовується для передачі даних у мережі. Він був розроблений з метою забезпечення універсального методу для обміну даними між клієнтською та серверною частиною веб-додатка, але на сьогодні використовується в різноманітних сферах, від баз даних до конфігураційних файлів.
Основна структура JSON заснована на двох типах структур даних: об’єктах і масивах.
Об’єкти в JSON представлені у вигляді пар ключ-значення, де ключ — це рядок, а значення може бути рядком, числом, булевим значенням, об’єктом, масивом або null. Об’єкти в JSON розташовуються в фігурних дужках {}.
Масиви в JSON — це упорядковані набори значень. Масиви в JSON обмежуються квадратними дужками [] і можуть містити значення будь-якого типу.
Ось приклад JSON-об’єкта:
{
"name": "John Doe",
"age": 30,
"isEmployed": true,
"hobbies": ["reading", "gaming", "coding"],
"address": {
"street": "123 Main St",
"city": "Anytown",
"state": "Anystate",
"postalCode": "12345"
}
}
Цей JSON-об’єкт представляє людину з ім’ям John Doe, якій 30 років, вона працює (isEmployed), має три захоплення (reading, gaming, coding) та проживає за конкретною адресою.
Використання JSON дозволяє нам працювати з цими даними в структурованому і зрозумілому форматі.
Приклад 1: JSON об’єкт з товаром
{
"productId": "1234",
"productName": "Football",
"productCategory": "Sports",
"price": 15.50
}
У цьому прикладі ми маємо товар з унікальним ідентифікатором (productId), назвою (productName), категорією (productCategory) та ціною (price).
Приклад 2: JSON об’єкт з масивом
{
"students": [
{
"id": "1",
"name": "John Doe",
"age": 22,
"major": "Computer Science"
},
{
"id": "2",
"name": "Jane Smith",
"age": 23,
"major": "Mathematics"
}
]
}
У цьому прикладі ми маємо масив студентів, кожен з яких представлений у вигляді окремого JSON-об’єкта з інформацією про ідентифікатор (id), ім’я (name), вік (age) та основний предмет навчання (major).
Приклад 3: JSON об’єкт з вкладеними об’єктами
{
"company": "Tech Co.",
"address": {
"street": "123 Main St",
"city": "Anytown",
"state": "Anystate",
"postalCode": "12345",
"coordinates": {
"latitude": 35.6895,
"longitude": 139.6917
}
}
}
У цьому прикладі ми маємо об’єкт компанії, який включає в себе інформацію про адресу компанії, яка сама є JSON-об’єктом. Адреса також включає координати, які представлені окремим JSON-об’єктом.
Робота з JSON в JavaScript
JavaScript має вбудований об’єкт JSON, який надає методи для роботи з даними у форматі JSON. Два ключові методи цього об’єкта, які використовуються для серіалізації та десеріалізації JSON, це JSON.stringify() та JSON.parse().
JSON.stringify()
JSON.stringify() використовується для перетворення JavaScript об’єкта в рядок JSON. Це процес, відомий як “серіалізація” об’єкта.
Ось як це працює на прикладі:
let student = {
name: "John",
age: 30,
city: "New York"
};
let json = JSON.stringify(student);
console.log(json);
// виведе: {"name":"John","age":30,"city":"New York"}
У цьому прикладі об’єкт student перетворюється в рядок JSON за допомогою JSON.stringify(), і результат виводиться у консоль.
JSON.parse()
JSON.parse() використовується для перетворення рядка JSON назад в JavaScript об’єкт. Цей процес називається “десеріалізація”.
Ось як це працює:
let json = '{"name":"John","age":30,"city":"New York"}';
let student = JSON.parse(json);
console.log(student);
// виведе: { name: 'John', age: 30, city: 'New York' }
У цьому прикладі рядок JSON json перетворюється назад в JavaScript об’єкт за допомогою JSON.parse(), і результат виводиться у консоль.
Робота з JSON в Python
Python має вбудований модуль json, який надає методи для роботи з даними у форматі JSON. Два ключові методи цього модуля, які використовуються для серіалізації та десеріалізації JSON, це json.dumps() та json.loads().
json.dumps()
json.dumps() використовується для перетворення Python об’єкта в рядок JSON. Це процес, відомий як “серіалізація” об’єкта.
Ось як це працює на прикладі:
import json
student = {
"name": "John",
"age": 30,
"city": "New York"
}
json_str = json.dumps(student)
print(json_str)
# виведе: {"name": "John", "age": 30, "city": "New York"}
У цьому прикладі словник student перетворюється в рядок JSON за допомогою json.dumps(), і результат виводиться.
json.loads()
json.loads() використовується для перетворення рядка JSON назад в Python об’єкт. Цей процес називається “десеріалізація”.
Ось як це працює:
import json
json_str = '{"name": "John", "age": 30, "city": "New York"}'
student = json.loads(json_str)
print(student)
# виведе: {'name': 'John', 'age': 30, 'city': 'New York'}
У цьому прикладі рядок JSON json_str перетворюється назад в Python словник за допомогою json.loads(), і результат виводиться.
Практичний приклад: взаємодія з веб-сервером за допомогою JSON
Використання JSON для обміну даними з веб-сервером – це одна з найпоширеніших ситуацій в розробці веб-застосунків. Давайте розглянемо простий приклад такого застосунку, який використовує JavaScript на клієнтській стороні та Python на серверній.
На стороні клієнта ви можете використовувати вбудований об’єкт fetch в JavaScript для відправки HTTP-запиту до сервера. Запит може містити дані в форматі JSON, які потім можна обробити на сервері.
fetch('https://localhost:5000/data', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
name: 'John',
age: 30
}),
})
.then(response => response.json())
.then(data => console.log(data));
У цьому прикладі ми відправляємо POST-запит до сервера на адресу https://localhost:5000/data. У тілі запиту ми передаємо об’єкт JSON, який містить інформацію про користувача. Потім ми очікуємо відповідь від сервера в форматі JSON, яку обробляємо та виводимо в консоль.
На стороні сервера ви можете використовувати Python фреймворк Flask для обробки вхідних запитів та відправки відповіді. Дані JSON, які прийшли з клієнта, можна десеріалізувати за допомогою request.get_json().
from flask import Flask, request, jsonify
app = Flask(__name__)
@app.route('/data', methods=['POST'])
def handle_data():
data = request.get_json()
print(data) # виводить {'name': 'John', 'age': 30}
return jsonify({'message': 'Data received successfully'}), 200
if __name__ == "__main__":
app.run(port=5000)
У цьому прикладі ми створюємо Flask сервер, який слухає POST-запити на маршрут /data. Коли сервер отримує запит, він витягує дані JSON з запиту та виводить їх.
Підсумок
Ми докладно розглянули, що таке JSON, його основну структуру та призначення. Як ви могли помітити, JSON – це міцний фундамент для обміну даними в інтернеті. JSON об’єкти є легкими, гнучкими та легко зрозумілими, що робить їх ідеальним вибором для передачі даних між сервером та клієнтом.
Ми також розглянули, як використовувати JSON в таких популярних мовах програмування, як JavaScript і Python. Використання вбудованих функцій та методів для роботи з JSON дозволяє з легкістю серіалізувати та десеріалізувати дані, готові для передачі через мережу або зберігання на диску.
Ми взяли практичний приклад створення простого веб-застосунку, який використовує JSON для обміну даними між клієнтом та сервером. Цей приклад демонструє реальну ситуацію, з якою веб-розробники зустрічаються щодня, та показує, як знання JSON допомагає ефективно вирішувати ці задачі.
У сучасному світі веб-розробки неможливо переоцінити значення знання та вміння працювати з JSON. Будь-який веб-розробник, незалежно від його спеціалізації та досвіду, зіткнеться з необхідністю використовувати JSON на певному етапі своєї роботи. Тому поглиблене розуміння JSON і вміння ефективно з ним працювати є невід’ємною частиною набору навичок сучасного веб-розробника.
