Помилка JavaScript. Як знайти і виправити помилки JavaScript

31

Від автора: вітаю вас, друзі. З цієї невеликої статті ми з вами дізнаємося, як побачити і виправити помилки JavaScript. Стаття написана для початківців вивчення JavaScript.

При написанні програми на будь-якій мові програмування так чи інакше не обходиться без помилок, які необхідно вміти знайти і виправити. В якості прикладу давайте напишемо найпростішу програму, яка повинна показати модальне вікно:

alert(Привіт!);

У цій найпростішій програмі є помилка JavaScript, яку нам і потрібно знайти, оскільки з нею наш код не працює і модальний не показується. Мало того, в JavaScript багато помилок можна назвати фатальними, оскільки за них може припинити роботу не тільки ваш скрипт, але і сторонні бібліотеки JavaScript до тих пір, поки помилка не буде виправлена.

Що ж допоможе знайти помилки JavaScript? Консоль браузера. Тут ми коротко пройдемося по цьому інструменту в різних браузерах, зокрема це буде Firefox і Chrome. В обох браузерах консоль є з коробки.

Почнемо з Firefox. Для того, щоб побачити помилку в нашому коді, необхідно відкрити консоль браузера. Для цього у вікні браузера клікаємо правою кнопкою миші і в контекстному меню вибираємо пункт Дослідити елемент.

Внизу вікна з’явиться панель, в якій ми можемо досліджувати і розвивати наш код. Думаю, якщо ви верстали сайти, ви вже могли використовувати цей інспектор коду для дослідження верстки. Інструмент значно спрощує життя верстальника, навіть і не уявляю, як раніше верстали сайти без нього :)

Отже, у панелі, поряд з вкладкою Інспектор є вкладка Консоль, вона нас і цікавить. Перемкнемося на неї, ще раз оновимо сторінку і побачимо всі помилки JavaScript. У нашому випадку це всього одна синтаксична помилка, яка сталася у файлі scripts.js на першому рядку.

Нам залишається лише перейти в цей файл, зауважити, що ми забули укласти рядок в лапки і виправити цю помилку:

Ось тепер немає помилок, і код успішно виконався. Крім вбудованої консолі для Firefox можна окремо встановити розширення Firebug, яке, по суті, є аналогом. Після установки Firebug можна викликати, як і вбудовану консоль, з контекстного меню або використовувати для цього гарячу клавішу F12. Ось таким чином виглядає Firebug:

Ну і консоль Хрому:

Вона також викликається з контекстного меню або клавішею F12.

Звичайно, для виправлення помилки у єдиному рядку коду консоль часто не потрібна. Але якщо коду десятки і сотні рядків, тоді без консолі обійтися практично нереально. При цьому в консолі можна не тільки дивитися помилки, але і навіть писати власний JavaScript код, але це вже тема окремої статті.

На цьому стаття підійшла до кінця, тепер ви знаєте, як знайти в своєму коді помилки JavaScript і виправити їх. Якщо ви хочете більше дізнатися про JavaScript, тоді рекомендую звернути свою увагу на уроки по JavaScript і окремий курс по мові JavaScript. Удачі!