JavaScript Відладка (дебагінг)
Помилки (баги) можуть (будуть) виникати кожен раз, коли ви пишите новий комп’ютерний код.
Відладка (дебагінг) коду
Програмний код може містити синтаксичні або логічні помилки.
Багато із цих помилок складно діагностувати.
Часто, коли програмний код містить помилки, нічого не відбувається. Повідомлення про помилки відсутнє, і ви не отримаєте вказівок, де шукати помилки.
Пошук (та виправлення) помилок в програмному коді називається відладкою (або дебагінгом) коду.
Відладчики JavaScript
Відладка - непроста задача. Але, на щастя, всі сучасні браузери мають вбудований відладчик JavaScript.
Вбудовані відладчики можна включати і виключати, змушуючи користувача повідомляти про помилки.
За допомогою відладчика ви також можете встановлювати точки зупину (місця, де виконання коду може бути зупинено) і перевіряти змінні під час виконання коду.
Зазвичай так. В іншому випадку слідуючи інструкціям внизу сторінки, ви активуєте відладку в своєму браузері за допомогою клавіши F12 та обираєте "Консоль" в меню відладчика.
Метод console.log()
Якщо ваш браузер підтримує відладку, ви можете використовувати console.log() для відображення значень JavaScript у вікні відладчика:
Приклад
<!DOCTYPE html>
<html>
<body>
<h1>Моя перша вебсторінка</h1>
<script>
a = 5;
b = 6;
c = a + b;
console.log(c);
</script>
</body>
</html>
Спробуйте самі »
Порада: Додаткову інформацію про метод console.log() дивіться в Довіднику по JavaScript консолі на нашому сайті W3Schools українською.
Встановлення точок зупину
У вікні відладчика ви можете встановити точки зупину в JavaScript коді.
В кожній точці зупину JavaScript припиняється виконання і дозволяє вам перевіряти значення JavaScript.
Після вивчення значень ви можете оновити виконання коду (зазвичай за допомогою кнопки відтворення).
Ключове слово debugger
Ключове слово debugger зупиняє виконання JavaScript та викликає (якщо доступно) функцію відладки.
Це та ж функція, що і встановлення точки зупину у відладчику.
Якщо відладка недоступна, інструкція відладчика не діє.
При включеному відладчику цей код перестане виконуватись до того, як виконає третій рядок.
Основні інструменти відладки браузерів
Зазвичай ви активуєте відладку в своєму браузері за допомогою F12 та обираєте "Console" в меню відладчика.
В іншому випадку виконайте наступні дії:
Chrome
- Відкрити браузер.
- В меню оберіть "Додаткові інструменти".
- В інструментах оберіть "Інструменти розробника".
- потім оберіть Консоль.
Firefox
- Відкрити браузер.
- В меню оберіть "Інструменти веб-розробника".
- Потім оберіть "Консоль".
Edge
- Відкрити браузер.
- В меню оберіть "Інструменти розробника".
- Потім оберіть "Консоль".
Opera
- Відкрити браузер.
- В меню оберіть "Розробка".
- Із "Розробка" оберіть "Інструменти розробника".
- Потім оберіть "Консоль".
Safari
- Перейдіть в Safari, Налаштування, Додатково в головному меню.
- Встановіть прапорець "Включити показувати меню розробки в рядку меню".
- При появі нової опції "Develop" з’являється в меню:
Оберіть "Show Error Console".
А ви знаєте?
Відладка - це процес тестування, пошуку та усунення багів (помилок) в комп’ютерних програмах.
Першою відомою комп’ютерною помилкою був справжній жук (bug - з анг. жук, комаха), що застряг в електроніці. Саме тому помилки в програмах стали називати багами (жуками).
