Редакторы исходного кода – текстовые программы, в которых разработчики создают и редактируют исходный код IT-продукта. В принципе, код можно писать даже в блокноте. Но в специальной среде кодить почти всегда быстрее, проще и чище.
На примере двух самых популярных текстовых редакторов Visual Studio Code и Pycharm рассказываем про одну важную фичу – комментирование кода на Java, Python, PHP, JavaScript, HTML, CSS.
Немного о Visual Studio Code и Pycharm
Visual Studio Code (VS Code) — это мощный редактор исходного кода, разработанный компанией Microsoft и поддерживающий работу на всех популярных операционных системах: Windows, Linux и macOS.
PyCharm — еще одна среда разработки на языке на Python с поддержкой таких языков: Rust, HTML, XML, JSON, YAML, SQL, JavaScript, TypeScript, CSS, Sass, SCSS, Less. Нужно учитывать, у PyCharm есть две версии: бесплатная и платная. От версии зависит диапазон и наличие языков. Среда доступна для Windows, macOS, Linux.
Зачем нужны комментарии в коде
Комментарии делают код понятнее, доступнее для вас, для других. Комментировать код можно и нужно по нескольким причинам:
- Лучшее понимание кода:
Комментарии – путеводители для других разработчиков и вас в будущем. С ними вы понимаете, что делает тот или иной отрезок кода. Это особенно полезно в больших проектах или после перерыва.
- Помощь в создании документировании API:
При создании библиотек или API комментарии становятся пользовательскими инструкциями. С их помощью другие разработчики получают четкое представление о возможностях библиотеки или API.
- Отладка и поиск ошибок:
Комментарии нужны при отладке кода и поиске ошибок. Комментарии с пояснениями ускорят процесс устранения ошибок.
- Соблюдение стандартов:
Комментарии могут указывать на соблюдение стандартов написания кода. Это в свою очередь упрощает процесс согласования стиля и поддерживает единообразие в коде.
- Снижение зависимости от автора:
Четкие комментарии делают код менее зависимым от конкретного разработчика. То есть позволяет другим разработчикам быстро продолжить разработку, если оригинальный автор недоступен.
Кстати, можно не только комментировать код, но и раскомментировать его. Раскомментировать – преобразовать комментарий в часть программы, сделать его «рабочей» частью.
Как закомментировать код в Visual Studio Code
Если код на Java
Для комментирования и раскомментирования кода на Java в Visual Studio Code используют следующие горячие клавиши:
Комментирование одной строки
- Windows: Ctrl + /
- macOS: ⌘Cmd + /
- Linux: Ctrl + /
Раскомментирование одной строки
- Windows: Ctrl + / (повторно)
- macOS: ⌘Cmd + / (повторно)
- Linux: Ctrl + /
Комментирование блока кода
Выделите блок кода, который хотите закомментировать. Нажмите и удерживайте Shift, затем нажмите Alt и A одновременно (Windows и Linux) или ⌥Option и A (macOS).
Если код на Python
Принцип работы и горячие клавиши в работе на Python в Visual Studio Code практически аналогичны, как на Java.
Комментирование одной строки
- Windows/Linux: Ctrl + /
- macOS: ⌘Cmd + /
Раскомментирование одной строки
- Windows/Linux: Ctrl + / (повторно)
- macOS: ⌘Cmd + / (повторно)
Комментирование блока кода
Выделите блок кода, который хотите закомментировать. Нажмите и удерживайте Shift, затем нажмите Alt и A одновременно (Windows/Linux) или ⌥Option и A (macOS).
Раскомментирование блока кода
Если вы комментировали блок с помощью комбинации Shift + Alt + A (Windows/Linux) или Shift + ⌥Option + A (macOS), повторите эту комбинацию для раскомментирования.
Если код на PHP
Комментирование одной строки
Чтобы закомментировать одну строку в PHP:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
VS Code автоматически добавит символы // перед текущей строкой, превращая ее в комментарий.
Раскомментирование одной строки
Чтобы вернуть закомментированную строку в исходное состояние. Используйте те же комбинации, что и для комментирования:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Если строка уже закомментирована, сочетание клавиш уберет символы // из начала строки.
Комментирование блока кода
Для комментирования нескольких строк (блока кода):
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Выделите несколько строк, затем используйте сочетание клавиш. VS Code автоматически добавит // перед каждой строкой.
Раскомментирование блока кода
Для раскомментирования нескольких строк: Выделите закомментированные строки. Используйте ту же горячую клавишу:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
VS Code уберет // из начала каждой строки.
Если код на JavaScript
Комментирование одной строки
Для добавления комментария к одной строке используйте горячую клавишу:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
VS Code автоматически добавит символы // в начало строки.
Раскомментирование одной строки
Для удаления комментария с одной строки используйте те же сочетания клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Если строка уже закомментирована, это действие уберет символы //.
Комментирование блока кода
Для комментирования сразу нескольких строк выделите блок кода и используйте сочетание клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Это добавит // перед каждой строкой в выделении.
Раскомментировать блока кода
Для удаления комментариев с нескольких строк выделите их и нажмите:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Это уберет // в начале каждой строки.
Многострочные комментарии
Для создания многострочного комментария оберните блок кода в /* и */. Для удаления многострочного комментария просто уберите /* и */.
Если работаете с HTML и CSS
У данных языков одинаковый набор команд.
Комментирование одной строки:
- Windows/Linux: Ctrl + /
- macOS: ⌘Cmd + /
Чтобы добавить комментарий, нужно перейти в начало строки и дописать туда два слеша (//). Это можно сделать быстро, нажав в любом месте строки Ctrl + /.
Раскомментирование одной строки
- Windows/Linux: Ctrl + / (повторно)
- macOS: ⌘Cmd + / (повторно)
Если строка уже закомментирована, повторный ввод комбинации удалит комментарии.
Комментирование блока кода
Выделите блок кода, который хотите закомментировать. Нажмите и удерживайте Shift, затем нажмите Alt и ↑ или ↓ (Windows/Linux) или ⌥Option и ↑ или ↓ (macOS).
Раскомментирование блока кода
Если вы комментировали блок с помощью комбинации Shift + Alt + ↑ или ↓ (Windows/Linux) или Shift + ⌥Option + ↑ или ↓ (macOS), повторите эту комбинацию для раскомментирования.
Как закомментировать код в PyCharm
Если код на Java
Комментирование одной строки
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Чтобы добавить комментарий, нужно перейти в начало строки и дописать там символ //. Это можно сделать быстро, нажав в любом месте строки Ctrl + /.
Раскомментирование одной строки
- Windows/Linux: Ctrl + / (повторно)
- macOS: Cmd + / (повторно)
Если строка уже закомментирована, повторный ввод комбинации удалит комментарии.
Комментирование блока кода
Выделите блок кода, который хотите закомментировать. Нажмите и удерживайте Shift, затем нажмите Alt и 7 одновременно (Windows/Linux) или Cmd + Alt + 7 (macOS).
Раскомментирование блока кода
Если вы комментировали блок с помощью комбинации Shift + Alt + 7 (Windows/Linux) или Shift + Cmd + Alt + 7 (macOS), повторите эту комбинацию для раскомментирования.
Если код на Python
При работе с питоном в PyCharm есть два пути для комментирования. Первый – использование синтаксиса, второй – горячие клавиши.
Комментирование одной строки
Использование символа решетки (#):
# Это комментарий одной строки
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Раскомментирование одной строки
Повторное использование комбинации клавиш Ctrl + / (Windows/Linux) или Cmd + / (macOS) удалит символ # и раскомментирует строку.
Комментирование блока кода
Использование тройных кавычек (‘’‘’) для многострочных комментариев. В PyCharm можно выделить блок кода и использовать комбинацию клавиш Ctrl + /, чтобы автоматически закомментировать выделенные строки с помощью тройных кавычек.
Раскомментирование блока кода:
Если вы комментировали блок с помощью комбинации Ctrl + / (Windows/Linux) или Cmd + / (macOS), повторите эту комбинацию для удаления комментариев.
Если код на PHP
Комментирование одной строки
Для добавления комментария к одной строке:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
PyCharm автоматически добавит символы // в начало строки.
Раскомментирование одной строки
Для удаления комментария с одной строки используйте те же сочетания клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Если строка уже закомментирована, эти действия уберут символы //.
Комментирование блока кода
Чтобы закомментировать несколько строк одновременно. Выделите блок кода. Используйте сочетание клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
PyCharm добавит // в начало каждой строки.
Раскомментирование блока кода
Для удаления комментариев с блока кода, выделите закомментированные строки. Используйте сочетание клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Это удалит // из начала каждой строки.
Многострочные комментарии
PHP поддерживает многострочные комментарии с использованием /* … */, и PyCharm тоже позволяет работать с ними. Чтобы закомментировать блок, оберните его в /* и */. Чтобы раскомментировать, удалите эти символы.
Альтернативный способ через меню
Если вы предпочитаете меню, используйте следующие шаги:
- Выделите строку или блок кода.
- Перейдите в Code > Comment with Line Comment или Comment with Block Comment.
Если код на JavaScript
Комментирование одной строки
Для добавления комментария к одной строке:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
PyCharm автоматически добавит символы // в начало строки.
Раскомментирование одной строки
Чтобы убрать комментарий с одной строки, используйте те же горячие клавиши:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Если строка уже закомментирована, это действие уберет символы //.
Комментирование блока кода
Для закомментирования нескольких строк кода, выделите нужный блок. Используйте сочетание клавиш:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
PyCharm добавит // перед каждой строкой.
Раскомментирование блока кода
Для удаления комментариев из блока кода, выделите закомментированные строки. Нажмите:
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Это уберет // из начала каждой строки.
Многострочные комментарии
JavaScript поддерживает многострочные комментарии с использованием /* … */. В PyCharm они также доступны. Для комментирования: оберните блок кода в /* и */. Для раскомментирования: удалите /* и */.
Альтернативный способ через меню
Если вы предпочитаете использовать меню, выполните следующие действия:
- Выделите строку или блок кода.
- Перейдите в меню Code > Comment with Line Comment или Comment with Block Comment.
Если работаете с HTML и CSS
В этих языках отмечать комментарии также можно двумя способами: синтаксис и горячие клавиши.
HTML:
Комментирование одной строки
Использование символа решетки (#):
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Раскомментирование одной строки
Повторное использование комбинации клавиш Ctrl + / (Windows/Linux) или Cmd + / (macOS) удалит символ <!— и —>.
Комментирование блока кода
В PyCharm можно выделить блок кода и использовать комбинацию клавиш Ctrl + /, чтобы автоматически закомментировать выделенные строки с помощью тегов комментариев.
CSS:
Комментирование одной строки
Использование символа решетки (#):
- Windows/Linux: Ctrl + /
- macOS: Cmd + /
Раскомментирование одной строки
Повторное использование комбинации клавиш Ctrl + / (Windows/Linux) или Cmd + / (macOS) удалит символ /* и */.
Комментирование блока кода
В PyCharm можно выделить блок кода и использовать комбинацию клавиш Ctrl + /, чтобы автоматически закомментировать выделенные строки с помощью фигурных скобок.