Error js client

Существует ряд причин, по которым код JavaScript может вызывать ошибки, например:

  • Проблема с сетевым подключением;
  • Пользователь мог ввести неверное значение в поля формы;
  • Ссылка на объекты или функции, которые не существуют;
  • Неправильные данные отправляются или принимаются с веб-сервера;
  • Служба, к которой приложение должно получить доступ, может быть временно недоступна.

Эти типы ошибок известны как ошибки времени выполнения (runtime errors), поскольку они возникают во время выполнения скрипта. Профессиональное приложение должно иметь возможность корректно обрабатывать такие ошибки во время выполнения. Обычно это означает понятное информирование пользователя о возникшей проблеме.

Ошибки в JavaScript и универсальные способы работы с ними.

Если в вашем коде что-то пошло не так, вы можете воспользоваться следующей конструкцией:

throw new Error('something went wrong')

В ходе выполнения этой команды будет создан экземпляр объекта Error и будет сгенерировано (или, как говорят, «выброшено») исключение с этим объектом. Инструкция throw может генерировать исключения, содержащие произвольные выражения. При этом выполнение скрипта остановится в том случае, если не были предприняты меры по обработке ошибки.

Начинающие JS-программисты обычно не используют инструкцию throw. Они, как правило, сталкиваются с исключениями, выдаваемыми либо средой выполнения языка, либо сторонними библиотеками. Когда это происходит — в консоль попадает нечто вроде ReferenceError: fs is not defined и выполнение программы останавливается.

Объект Error.

У экземпляров объекта Error есть несколько свойств, которыми мы можем пользоваться. Первое интересующее нас свойство — message. Именно сюда попадает та строка, которую можно передать конструктору ошибки в качестве аргумента. Например, ниже показано создание экземпляра объекта Error и вывод в консоль переданной конструктором строки через обращение к его свойству message.

const myError = new Error('please improve your code')
console.log(myError.message) // please improve your code

Второе свойство объекта, очень важное, представляет собой трассировку стека ошибки. Это — свойство stack. Обратившись к нему можно просмотреть стек вызовов (историю ошибки), который показывает последовательность операций, приведшую к неправильной работе программы. В частности, это позволяет понять — в каком именно файле содержится сбойный код, и увидеть, какая последовательность вызовов функций привела к ошибке. Вот пример того, что можно увидеть, обратившись к свойству stack.

Error: please improve your code
 at Object.<anonymous> (/Users/gisderdube/Documents/_projects/hacking.nosync/error-handling/src/general.js:1:79)
 at Module._compile (internal/modules/cjs/loader.js:689:30)
 at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
 at Module.load (internal/modules/cjs/loader.js:599:32)
 at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
 at Function.Module._load (internal/modules/cjs/loader.js:530:3)
 at Function.Module.runMain (internal/modules/cjs/loader.js:742:12)
 at startup (internal/bootstrap/node.js:266:19)
 at bootstrapNodeJSCore (internal/bootstrap/node.js:596:3)

Здесь, в верхней части, находится сообщение об ошибке, затем следует указание на тот участок кода, выполнение которого вызвало ошибку, потом описывается то место, откуда был вызван этот сбойный участок. Это продолжается до самого «дальнего» по отношению к ошибке фрагмента кода.

Встроенные ошибки

SyntaxError

Чаще всего встречаются опечатки — неправильные названия методов, лишние или отсутствующие точки с запятой или скобочки и так далее. Такой тип ошибок называется «синтаксическим», SyntaxError:

console.log(;)
// SyntaxError: Unexpected token ';'

console.log(()
// SyntaxError: missing ) after argument list

ReferenceError

Если попытаться обратиться к несуществующей переменной, произойдёт ошибка ReferenceError:

console.log(name)
// ReferenceError: name is not defined

TypeError

Если попытаться обратиться к несуществующему свойству, произойдёт ошибка TypeError:

console.log(null.length)
// TypeError: Cannot read property 'length' of null

undefined()
// TypeError: undefined is not a function

RangeError

Ошибка для значений, которые выходят за диапазон допустимого.

new Array(10000000000)
// RangeError: Недопустимая длина массива

URIError

Этот тип ошибок возникает при неправильном использовании обработки URI.

decodeURIComponent('%')
// URIError: URI malformed

Валидным считается URI, формат которого соответствует спецификации RFC 3986:
URI = scheme:[//authority]path[?query][#fragment]

EvalError

EvalError представляет ошибку, возникающую в глобальной функции eval().

eval(
  'console.log(null.length)'
)

Эта ошибка в настоящее время не используется и остаётся для совместимости с предыдущими версиями JavaScript.

InternalError (не стандарт)

Ошибка внутри движка JavaScript. Не является стандартом и почти не используется. Например:

"InternalError: инициализатор массива слишком большой".

Собственный класс ошибок

Можно расширять базовый класс Error и создавать собственные типы ошибок.

class WrongDataTypeForSumError extends Error {
  constructor(message) {
    super(message)
    this.name = 'WrongDataTypeForSumError'
  }
}

const myCustomError = new WrongDataTypeForSumError('Невалидный тип данных для суммирования')

Сгенерируем ошибку WrongDataTypeForSumError в случае, если хотя бы один из аргументов функции sum — не число.

function sum(a, b) {
  if (typeof a !== 'number' || typeof b !== 'number') {
    throw new WrongDataTypeForSumError('Невалидный тип данных для суммирования')
  }

  return a + b
}

console.log(sum('1', 2))
// VM840:3 Uncaught WrongDataTypeForSumError: Невалидный тип данных для суммирования
// at sum (<anonymous>:3:11)
// at <anonymous>:9:13
// WrongDataTypeForSumError @ VM830:3
// sum @ VM840:3
// (anonymous) @ VM840:9

Функция будет выполняться только в том случае если оба аргумента будут числами, в противном случае функция будет возвращать ошибку WrongDataTypeForSumError.

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

1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (Пока оценок нет)
Загрузка...

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Adblock
detector