JSON и обработка ошибок

В этом уроке ты узнаешь

Знать правила формата JSON и отличать его от объекта JavaScript
Преобразовывать данные с помощью JSON.stringify и JSON.parse
Управлять ошибками с помощью try, catch, finally и throw

Приложение погоды получает прогноз для Баку с сервера. Сервер присылает не объект, а текст — по сети можно передать только текст. А что, если текст придёт обрезанным или с ошибкой? Хорошая программа не падает: она перехватывает проблему и показывает пользователю понятное сообщение. В этом уроке ты освоишь оба навыка.

Что такое JSON?

JSON (JavaScript Object Notation) — формат для хранения и передачи данных в виде текста. Он очень похож на объекты JavaScript, но его понимают все языки: Python, Java, C# и другие. Сегодня сайты, мобильные приложения и серверы «общаются» друг с другом в основном через JSON.

JSON

{
  "city": "Baku",
  "temperature": 24,
  "sunny": true,
  "forecast": [25, 27, 22],
  "wind": { "speed": 5, "direction": "north" },
  "warning": null
}

В JSON ключи и строки всегда пишутся в двойных кавычках.

Признак	Объект JavaScript	JSON
Ключи	можно без кавычек	только в двойных кавычках
Строки	любые кавычки	только двойные кавычки
Функции, `undefined`	можно	нельзя
Комментарии, запятая в конце	можно	нельзя

JSON.stringify и JSON.parse

JSON.stringify превращает объект в JSON-строку — чтобы отправить или сохранить его. JSON.parse делает обратное: снова создаёт объект из JSON-строки. Если передать 2 третьим аргументом, stringify красиво оформит текст с отступами.

JavaScript· Измени код и запусти снова

const weather = { city: 'Baku', temperature: 24, sunny: true };

const text = JSON.stringify(weather);
console.log(text);
console.log(typeof text);

const back = JSON.parse(text);
console.log(back.city, typeof back);

console.log(JSON.stringify({ name: 'Leyla', level: 3 }, null, 2));

▸ Ожидаемый результат

{"city":"Baku","temperature":24,"sunny":true}
string
Baku object
{
  "name": "Leyla",
  "level": 3
}

JavaScript· Измени код и запусти снова

const profile = {
  name: 'Leyla',
  nickname: undefined,
  greet() { return 'Hi!'; },
  born: new Date('2010-05-28'),
};

console.log(JSON.stringify(profile));

▸ Ожидаемый результат

{"name":"Leyla","born":"2010-05-28T00:00:00.000Z"}

Ошибки и try...catch

Когда при выполнении программы что-то идёт не так, JavaScript создаёт ошибку (исключение). Неперехваченная ошибка останавливает программу. Самые частые виды: SyntaxError (неверный синтаксис, например испорченный JSON), TypeError (недопустимая для значения операция, например чтение свойства у null) и ReferenceError (несуществующая переменная).

Рискованный код помещают в блок try. Если там возникает ошибка, остаток try пропускается, и управление переходит в блок catch, который получает объект ошибки. Блок finally выполняется всегда — была ошибка или нет.

JavaScript· Измени код и запусти снова

const input = '{ city: Baku }';

try {
  const data = JSON.parse(input);
  console.log('City:', data.city);
} catch (error) {
  console.log('Could not read the data:', error.name);
} finally {
  console.log('Check finished');
}

try {
  const user = null;
  console.log(user.name);
} catch (error) {
  console.log('Problem:', error.name);
}

▸ Ожидаемый результат

Could not read the data: SyntaxError
Check finished
Problem: TypeError

В input ключ и значение без кавычек — это не JSON. Возьми city и Baku в двойные кавычки и запусти код снова.

Свои ошибки: throw

Иногда для JavaScript всё в порядке, но нарушается логика программы: например, хотят снять больше денег, чем есть на балансе. В таких случаях создают свою ошибку: throw new Error('...'). Код после throw не выполняется, а ошибка «летит» до ближайшего catch.

JavaScript· Измени код и запусти снова

function withdraw(balance, amount) {
  if (amount > balance) {
    throw new Error('Not enough money');
  }
  return balance - amount;
}

try {
  console.log(withdraw(100, 30));
  console.log(withdraw(100, 500));
  console.log('This line is never printed');
} catch (error) {
  console.log('Error:', error.message);
}

▸ Ожидаемый результат

70
Error: Not enough money

Безопасная функция разбора

Напиши функцию safeParse(text, fallback), которая возвращает объект, если JSON правильный, и запасное значение, если он испорчен.

Показать решение

Вызываем JSON.parse внутри try и возвращаем результат.
Если возникнет ошибка, блок catch вернёт fallback.
Такая функция защищает остальную программу от ошибок (смотри код).

JavaScript· Измени код и запусти снова

function safeParse(text, fallback) {
  try {
    return JSON.parse(text);
  } catch {
    return fallback;
  }
}

console.log(safeParse('[1, 2, 3]', []));
console.log(safeParse('oops', []));
console.log(safeParse('{"score": 90}', {}).score);

▸ Ожидаемый результат

[ 1, 2, 3 ]
[]
90

Задание

Допиши функцию readScore(text): она должна прочитать JSON-текст и вернуть значение score. Если текст — некорректный JSON, выброси ошибку с сообщением 'Invalid JSON', а если балл вне диапазона 0–100 — с сообщением 'Score out of range' (throw new Error(...)). Цикл ниже выводит каждый результат или сообщение об ошибке.

Задание · JavaScript· Измени код и запусти снова

function readScore(text) {
  // 1) JSON.parse inside try...catch → throw new Error('Invalid JSON')
  // 2) score outside 0–100 → throw new Error('Score out of range')
  // 3) return the score
}

const inputs = ['{"score": 92}', '{"score": 140}', '{score: 50}'];

for (const text of inputs) {
  try {
    console.log('Score:', readScore(text));
  } catch (error) {
    console.log('Error:', error.message);
  }
}

▸ Ожидаемый результат

Score: 92
Error: Score out of range
Error: Invalid JSON

Главное

JSON — универсальный текстовый формат для передачи данных; ключи и строки — в двойных кавычках.
JSON.stringify превращает объект в текст, JSON.parse — текст в объект.
try содержит рискованный код, catch перехватывает ошибку, finally выполняется всегда.
throw new Error('...') создаёт собственную ошибку; код после неё не выполняется.
У объекта ошибки есть name и message; не глотай ошибки молча.

Проверь себя

Вопросов: 10. Каждый правильный ответ приносит XP.

1 / 10

Какая строка — правильный JSON?