Ошибки в JavaScript

Содержание

• Листочек
• Метод утенка
• 4-ре типа ошибок

Листочек

Самый действенный способ понять, как работает участок кода — это расписать его выполнение на бумажке, как если бы вы были компьютером (медленным и немного голодным).

Метод утенка

Метод утёнка — психологический метод решения задачи, делегирующий её мысленному помощнику. Метод описан в книге «Программист-прагматик».

Тестируемый ставит на рабочем столе игрушечного утёнка (или представляет его мысленно; на самом деле уточка - это условно, предмет может быть любым), и когда у него возникает вопрос, на который трудно ответить, то он задаёт его игрушке, как живому человеку, словно она действительно может ответить.

Считается, что правильная формулировка вопроса содержит как минимум половину ответа, а также это дает толчок мыслям, направляя их в нужное русло.

Метод также используется при отладке. Если определённая часть программы не работает, программист пытается объяснить утёнку, что делает каждая строка программы, и в процессе этого сам находит ошибку.

4 типа ошибок:

Syntax error

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

var cube = (num) => {
  return num * num * num;
})

// выведет
Uncaught SyntaxError: Unexpected token )

Синтаксическая ошибка — это как если кто-то бредит вслух. Никто вокруг ничего не понимает.

Reference error

Использование несуществующего названия.
Что делать?
Проверить, существует ли то, на что вы ссылаетесь. Возможно вы использовали ошибочное название или забыли его создать.

var sheep;
ship;

// got next
Uncaught ReferenceError: ship is not defined

ReferenceError — это как называть кого-то чужим именем.

Type error

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

var length = 12;
var num = length(54);

// got next
TypeError: length is not a function

Сначала мы создали константу. Помните, что это как давать чему-то название: в нашем случае — числу 12 даётся название length. В следующей строке мы вызываем функцию length и передаём ей аргумент — число 54. Но подождите! length — это не функция! Это всего лишь число. Числа — это не функции, не ящики, которые производят какие-то действия. И JavaScript пожалуется именно на это.

Что делать?
Убедиться, что всё используется верно. Часто проблема в простой путанице: вы создали численную константу и функциональную константу, а потом пытаетесь вызвать число. Вероятно вы собирались вызвать функцию.

Ошибка типизации — это как просить начальника постирать бельё. Возможно, вы хотели попросить об этом вашего друга.

Все эти ошибки — syntax error, reference error и type error — возникают из-за использования неправильных слов. И все они предельно очевидные: вы видите сообщение об ошибке и достаточно хорошо понимаете в чём проблема. Обычно сразу понятно, как их исправить:

1. Синтаксическая ошибка Заменить, удалить или добавить символы. Часто проблема в скобках и кавычках: открытые скобки и открытые кавычки должны быть закрыты.
2. Reference error Проверить, существует ли тот объект, на который вы ссылаетесь. Возможно, вы использовали неправильное название или забыли создать его.
3. Ошибка типизации Убедиться, что вы используете объекты верно. Часто проблема — простая путаница: вы создали и числовую константу и функцию, а потом пытаетесь вызвать число. Наверное, вы хотели вызвать функцию.

Последний тип ошибки, о котором мы сегодня поговорим — самый злой: Логическая ошибка. Допустим, мы пишем функцию, которая конвертирует градусы по фаренгейту (F) в градусы по цельсию (C). Чтобы сконвертировать температуру по одной шкале в другую, нужно вычесть 32 и умножить на 5/9. Например (50°F - 32) x 5/9 = 10°C.

Logic error (Логическая ошибка)

Ваш код выполняет не то, что требуется, но программа запускается и не выдаёт ошибок трёх перечисленных выше типов. Сломана логика.
Что делать?
Проверить свой код, убедиться, что он выполняет то, что должен.

var fahrToCelsius = (fahr) => {
  return fahr - 32 * 5/9;
}

Выглядит нормально? Давайте запустим эту функцию, сконвертируем 50 градусов и выведем на экран:

console.log(fahrToCelsius(50));

И у нас получилось 32.22222222222222. Не 10. Что произошло? JavaScript не пожаловался, когда код запустился, никаких ошибок не выскакивало. Компьютер не знает, что нам нужно, поэтому он производит вычисление, как мы его и просили. Но такое вычисление ошибочно — допустили ошибку мы. Нам нужно вначале вычесть 32, а потом умножить это на 5/9. Но мы не использовали скобки, поэтому 32 вначале умножилось на 5/9, а затем результат был отнят от температуры в фаренгейтах.

ЭтоЛогическая ошибка. Мы не нарушили никаких правил, мы просто сделали что-то не то. Наш пример был простым: мы написали функцию, запустили её и увидели неверный результат. Но представьте, что функция — это только маленькая частица крупной системы. Приложение для формирования бюджета в огромной организации отправляет отчёт в главную бухгалтерию, что в следующем месяце для оплаты счёта за электричество требуются дополнительные $300 000. Организуется экстренное собрание, увольняют людей, генеральный директор снова уходит в запой. Что случилось?

Иногда обнаружить проблему может оказаться трудной задачей: система кондиционирования ожидает, что январская температура будет 32 градуса по цельсию, вместо 10, потому что кто-то забыл использовать скобки в функции.

Борьба с логическими ошибками — это целиком ваша ответственность. И временами — тяжёлая работа, но в конце приходит сильное облегчение и удовлетворение: а-ааа, так вот в чём была проблема!