JavaScript Отладка


Когда вы пишете на JavaScript, бывает мучительно, если нет инструментов отладки.


Отладка JavaScript

Без инструментов отладки трудно писать программы на JavaScript.

В вашем коде могут быть синтаксические и логические ошибки; без инструментов отладки такие ошибки трудно найти.

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

Note Часто ошибки возникают, когда вы пишете новый код на JavaScript.

Инструменты отладки JavaScript

Поиск ошибок в программном коде называется отладкой кода.

Отладка — сложная задача, но, к счастью, многие браузеры имеют встроенные инструменты отладки.

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

С помощью инструментов отладки мы можем устанавливать точки останова (позиции, где выполнение кода останавливается) и отслеживать переменные во время выполнения кода.

Чтобы включить инструменты отладки в браузере, обычно нажмите клавишу F12 и выберите "Console" в меню отладки.


Метод console.log()

Если браузер поддерживает отладку, вы можете использовать метод console.log() для вывода значений JavaScript в окне отладки:

Пример

a = 5; b = 6; c = a + b; console.log(c);

Попробуйте сами »


Установка точек останова

В окне отладки можно устанавливать точки останова в коде JavaScript.

На каждой точке останова выполнение кода JavaScript останавливается, чтобы мы могли проверить значения переменных JavaScript.

После проверки можно возобновить выполнение кода (например, с помощью кнопки воспроизведения).


Ключевое слово debugger

debuggerКлючевое слово используется для остановки выполнения JavaScript и вызова функции отладки.

Это ключевое слово имеет тот же эффект, что и установка точки останова в инструментах отладки.

Если отладка недоступна, оператор debugger не будет работать.

Если debugger включён, код останавливает выполнение перед третьей строкой.

Пример

var x = 15 * 5; debugger; document.getElementbyId("demo").innerHTML = x;

Попробуйте сами »


Инструменты отладки в основных браузерах

Обычно, чтобы включить инструменты отладки в браузере, нажмите клавишу F12 и выберите "Консоль" в меню отладки.

Шаги для каждого браузера приведены ниже:

Браузер Chrome

  • Откройте браузер.
  • В меню выберите«Дополнительные инструменты»。
  • В разделе«Дополнительные инструменты»затем выберите«Инструменты разработчика»。
  • Наконец, выберите «Консоль».

Или можно щёлкнуть правой кнопкой мыши и выбрать«Просмотреть код», как показано на рисунке ниже:

Браузер Firefox

  • Откройте браузер.
  • Щёлкните правой кнопкой мыши и выберите«Исследовать элемент»。

Safari

  • Откройте браузер.
  • Щёлкните правой кнопкой мыши и выберите «Исследовать элемент».
  • Во всплывающем внизу окне выберите «Консоль».

Браузер Internet Explorer.

  • Откройте браузер.
  • В меню выберите «Сервис».
  • В меню «Сервис» выберите «Инструменты разработчика».
  • Наконец, выберите «Консоль».

Opera

  • Откройте браузер.
  • Щёлкните в левом верхнем углу и выберите«Инструменты разработчика», выберите«Веб-инспектор»。

Более простой способ: щёлкните правой кнопкой мыши и выберите"Inspect Element"

Другие расширения