Виды ошибок и объект Error

Ошибка в JavaScript — такой же объект, как массив или дата. Его создаёт конструктор Error (или один из его наследников), и у него есть три поля, которые вы будете читать постоянно: name — вид ошибки, message — описание для человека, stack — след из вызовов, приведших к поломке.

const err = new Error("Нет соединения");
console.log(err.name);
console.log(err.message);
console.log(String(err));
console.log(err instanceof Error);

Обратите внимание: создать объект ошибки — ещё не значит сломать программу. Пока он просто лежит в переменной, всё идёт своим чередом. Прерывает выполнение throw — и ровно то же самое делает движок, когда натыкается на недопустимую операцию, только объект ошибки он создаёт сам.

try {
  throw new Error("Нет соединения");
  console.log("эта строка недостижима");
} catch (err) {
  console.log(err.message);
}
console.log("жизнь продолжается");

Error — общий предок, его бросают, когда ничего конкретнее не подходит. Остальные виды наследуются от него и говорят о характере беды: сам движок почти всегда выбирает специализированный конструктор, а не голый Error. Всего встроенных классов ошибок девять; пять из таблицы ниже закрывают почти всё, что встретится в повседневном коде, а EvalError, URIError, AggregateError и SuppressedError попадаются редко и в особых местах.

Проще всего запомнить границу между двумя самыми частыми: ReferenceError — «такого имени нет», TypeError — «имя есть, но с его значением так нельзя».

function nameOf(fn) {
  try { fn(); } catch (err) { return err.name; }
}
console.log(nameOf(() => undefined.length));
console.log(nameOf(() => missingVar));
console.log(nameOf(() => (5).toFixed(200)));

Этот вид выпадает из общего ряда. Остальные ошибки случаются во время работы программы, а синтаксическая — до неё: движок сначала разбирает весь файл целиком. Если в нём забыта скобка, не выполнится ни одна строка — включая тот самый try, которым вы надеялись ошибку поймать.

Поэтому SyntaxError, который действительно ловят в приложениях, почти всегда прилетает из JSON.parse: там разбирается чужой текст, и происходит это уже во время работы программы.

try {
  JSON.parse("{name: Аня}");
} catch (err) {
  console.log(err.name);
  console.log(err instanceof Error);
}

try {
  JSON.parse("[1, 2,]");
} catch (err) {
  console.log(err.name);
}
console.log([1, 2,].length);

Поле stack отвечает на вопрос «как мы сюда попали». Это обычный текст: в большинстве браузеров первой идёт строка с видом и сообщением, а дальше — список функций. Сверху та, внутри которой ошибка возникла, под ней — та, что её вызвала, и так вниз до верхнего уровня программы.

function inner() { throw new Error("нет данных"); }
function outer() { inner(); }
try {
  outer();
} catch (err) {
  console.log(err.stack.includes("inner"));
  console.log(err.stack.includes("outer"));
}

Читайте стек сверху вниз и ищите первую строку со своим файлом. Если верхние кадры принадлежат библиотеке, ошибка почти наверняка не в ней: это вы передали туда неподходящие данные, и первая ваша строка в списке и есть место, откуда стоит начинать разбор.

stack не описан в стандарте — формат у каждого движка свой. Читать глазами можно, разбирать регулярками не стоит.

Сообщения браузеров кажутся набором английских слов, но на деле их немного и они повторяются. Несколько формул стоит выучить сразу — они закрывают большую часть повседневных поломок.

Главный навык — смотреть не на то, что справа от точки, а на то, что слева. Сообщение «нельзя прочитать свойство items» жалуется вовсе не на items: виновато выражение перед ним, которое оказалось undefined.

const response = { data: undefined };
try {
  console.log(response.data.items.length);
} catch (err) {
  console.log(err.name);
  console.log(err.message.includes("undefined"));
}

Когда ошибку бросаете вы, берите не голый Error, а вид, который точнее описывает беду: TypeError — пришли данные не того типа, RangeError — тип верный, но значение вне допустимых границ. Тогда тот, кто ловит, сможет развести случаи по err.name или через instanceof, не разбирая текст сообщения.

function setAge(age) {
  if (typeof age !== "number") throw new TypeError("Возраст должен быть числом");
  if (age < 0 || age > 130) throw new RangeError("Возраст вне разумных границ");
  return age;
}
try { setAge(-5); } catch (err) {
  console.log(err.name);
}

class ValidationError extends Error {
  name = "ValidationError";
}
const e = new ValidationError("поле пустое");
console.log(e.name);
console.log(e.message);
console.log(e instanceof Error);