Что такое отладка?

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

Как отладить код, запущенный в NodeJs?

В процессе разработки вы, возможно, использовали оператор console.log() для вывода того, что происходит при выполнении определенного кода, и если распечатанной вами информации недостаточно, вы можете отредактировать код и добавить дополнительную информацию для печати. используя console.log(), цикл продолжается до тех пор, пока вы не найдете проблему и рабочее решение.

Как и в других языках программирования, javascript также имеет инструменты отладки, которые позволяют нам приостановить выполнение программы в определенном разделе кода, чтобы мы могли намного легче анализировать состояние программы, поэтому процесс отладки будет быстрее.

В этих статьях я расскажу о двух инструментах: Chrome DevTools и встроенном отладчике VS Code.

Предположим, что NodeJs и npm уже установлены на компьютере, и у нас есть простое приложение, которое обслуживает конечную точку, размещенную локально http://localhost:3000/add, который принимает два параметра запроса a и b. ,

например, http://localhost:3000/add?a=6&b=10 возвращает result = 610, как показано на рисунке ниже.

Результат не тот, что мы ожидали, а должно быть 6 + 10 равно 16. Итак, давайте отладим программу.

Код приложения довольно прост, как показано ниже, достаточно иметь один исходный файл с именем index.js. исходный код доступен на github.

const express = require(“express”);
const app = express();

app.get("/add", (req, resp) =› {
let a = req.query.a;
let b = req.query.b;
let sum = a + b;
resp.send («результат = « + сумма);
});

const port = 3000;
app.listen(port, () =› {
console.log(“run on port: “ + port);
});

Запустите node с флагом проверки:

узел — проверить index.js

# иначе это автоматически сломается на первом узле оператора
— inspect-brk index.js

Отладка с помощью Chrome DevTools

После запуска приложения откройте браузер Chrome и введите в адресной строке chrome://inspect, вы должны увидеть.

Нажмите проверить одну из перечисленных целей. затем появится всплывающее окно, перейдите на вкладку «Источники», и вы должны увидеть что-то вроде рисунка ниже.

Вы можете добавить точку останова, где программа будет приостанавливать свое выполнение, щелкнув номер строки в редакторе исходного кода, в этом случае я установил точку останова на строке 8, а затем выполнить код, запросив URL-адрес http://localhost:3000/add?a=6&b=10 с помощью браузера, после чего программа остановится на этой строке со своим текущим состоянием, таким как текущий переменные значения и т. д.

Как показано выше, текущее значение переменных a и b указано на правой панели. Используя это, мы можем видеть, что a и b равны «6» и «10» соответственно, но это строка, а не число, поэтому мы можем сделать вывод, что на самом деле мы не добавляем a к b, а объединяем строку a с b, решение будет преобразовывать a и b в число, поэтому это будет операция сложения.

Этот процесс обычно проще и быстрее, чем использование цикла console.log() для проверки того, что делает код.

Отладка с помощью VS Code

Перейдите на экран отладки, щелкнув значок отладки в меню слева, затем добавьте конфигурацию, чтобы создать файл конфигурации для vscode. Этот процесс создаст в проекте файл с именем .vscode/launch.json.

Отредактируйте файл launch.json, как показано на рисунке ниже. Это добавит конфигурацию запуска с именем "Присоединить по идентификатору процесса".

При запуске конфигурации с экрана отладчика он появится во всплывающем окне и покажет доступные запущенные процессы узла. нажмите на процесс node, на котором вы запускаете свое приложение, и он подключит отладчик vscode к процессу.

После этого установите точку останова и все такое, как в chrome devtools, интерфейс должен выглядеть так.