Отладчик кода Visual Studio: введение и скринкаст

В предыдущих сообщениях я немного говорил о том, почему важно использовать правильный отладчик по сравнению с некоторыми встроенными операторами PHP. В последнем посте я даже рассказал, как настроить Xdebug с помощью Visual Studio Code (и MAMP Pro, если вы используете).

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

Итак, я собираюсь немного рассказать об этом в контексте нескольких определений и снимков экрана, а также короткого скринкаста в конце, чтобы показать отладчик Visual Studio Code, работающий в действии.

Отладчик кода Visual Studio

Предположим, у вас установлен отладчик; есть несколько терминов, которые стоит выучить. Конечно, есть и другие, но вот те, которые я считаю ключевыми:

• Точки останова — это то место, где вы говорите программе остановить ее выполнение. Как только код остановился в этой точке, вы можете исследовать переменные, посмотреть, какие значения хранятся в памяти и так далее.
• Часы — это переменные в коде, за которыми вы хотите буквально наблюдать, как они меняются в процессе выполнения переменных.
• Start запускает отладчик. Даже если у вас установлены точки останова и часы, отладчик ничего не сделает, пока вы его не запустите.
• Step Into — это действие, которое, когда вы нажмете на вызов функции, перенесет вас в вызываемую функцию. Иногда это полезно, например, если вы хотите увидеть, что делает функция; в других случаях в этом нет необходимости, если вы заботитесь только о выполнении функции или вас заботит только то, что она возвращает.
• Step Over позволит вам перешагнуть выполнение функции таким образом, что выполнение программы будет остановлено сразу после завершения функции, которую вы перешагнули.
• Step Out используется, когда вы вошли в функцию, достигли точки, где вы закончили оценку кода, а затем готовы вернуться к тому месту, где вы установили точку останова.
• Stop остановит выполнение отладчика.

Звучит относительно ясно, не так ли? На мой взгляд, проще всего увидеть это в действии.

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

В конце концов, значки довольно информативны.

Пример

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

1 точка останова

Обратите внимание, что на изображении ниже я разместил точку останова рядом со строкой кода (обозначенной красной точкой).

Здесь выполнение остановится, как только я запущу отладчик и начну выполнение программы.

2 Установите часы

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

В следующем разделе вы увидите значение часов после того, как выполнение программы передало эту строку кода.

3 Оцените часы

Как только код пройдет эту строку, вы увидите значение переменной в разделе Watch панели отладки.

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

4 Приготовьтесь вмешаться

Прежде чем перейти к функции, важно убедиться, что имя функции выделено.

После этого вы сможете нажать кнопку «Вступить », чтобы увидеть, что происходит в функции.

5 шаг вперед

После входа вы увидите код, который вы не писали. Вместо этого это код, являющийся частью WooCommerce (по крайней мере, в этом примере).

Основываясь на своем опыте, вы увидите код, который, возможно, написали вы или кто-то другой.

6 Шаг вперед

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

Есть смысл?

Скринкаст

И, наконец, вот очень краткий скринкаст, показывающий, как все вышеперечисленное выглядит в действии:

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

Это требует времени и практики

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

И я не говорю, что это неуместно; однако, если вы хотите получить более глубокое понимание того, что происходит всякий раз, когда вы запускаете свою программу, или вы хотите изучить, скажем, ядро ​​​​WordPress, то использование отладчика — действительно хороший способ сделать это.

Кроме того, я бы сказал, что использование отладчика может помочь лучше понять, что происходит неправильно (или правильно) в контексте вашего кода, чтобы вы могли создать для него наилучшее возможное решение.