Комментарии
Комментарии используются для добавления поясняющих заметок или для того, чтобы предотвратить интеграцию части кода в браузер.
Синтаксис
/* Комментарий */
Примеры
/* Однострочный комментарий */ /* Комментарий который содержит несколько строк */
Замечания
Данный /* */ синтаксис комментария используется для обоих вариантов, и однострочного и многострочного комментария. Нет других способов добавить комментарий во внешнюю таблицу стилей. Также, когда используется элемент , вы можете использовать , чтобы спрятать CSS от старых браузеров, но это не рекомендуется. Как и в большинстве языков программирования, которые используют синтаксис комментариев /* */ , комментарии нельзя вкладывать друг в друга. Другими словами, данная часть синтаксиса */, которая следует за /* закрывает комментарий.
Спецификации
Смотрите также
- Руководство по CSS
- Ключевые концепции CSS
- Синтаксис CSS
- @-правила
- комментарии
- специфичность
- наследование
- блочная модель
- режимы компоновки
- модели визуального форматирования
- Схлопывание отступов
- Значения
- начальные
- вычисленные
- используемые
- действительные
Found a content problem with this page?
- Edit the page on GitHub.
- Report the content issue.
- View the source on GitHub.
This page was last modified on 7 авг. 2023 г. by MDN contributors.
Your blueprint for a better internet.
Подборка самых полезных горячих клавиш для различных IDE и редакторов кода
Программист должен хорошо знать свой инструмент. Собрали для вас подборку горячих клавиш, повышающих эффективность разработки в различных IDE.
Хорошему программисту нужны хорошие инструменты для работы. Однако самих инструментов мало — нужно ещё владеть ими на должном уровне. Комбинация клавиш Ctrl+C Ctrl+V — незаменимый спутник каждого разработчика, однако в средах разработки есть гораздо больше полезных горячих клавиш, существенно повышающих продуктивность. Мы собрали для вас подборку полезных горячих клавиш для некоторых популярных IDE, чтобы вы могли похвастаться перед коллегами своими мега-скиллами разработки.
IntelliJ IDEA
IntelliJ IDEA — известная IDE от JetBrains для JVM-языков вроде Java, Scala и Kotlin. Укомплектована уникальными инструментами и позволяет без проблем ориентироваться в программе. Есть и другие IDE от тех же разработчиков, например, PyCharm для Python, WebStorm для JavaScript и не только. Они во многом схожи между собой, поэтому большинство из нижеуказанных горячих клавиш должно работать и в других IDE от JetBrains.
- Ctrl + Space — стандартное автодополнение кода;
- Ctrl + Shift + Space — умное автодополнение кода;
- Двойной Shift — искать везде;
- Alt + Enter — показать возможные варианты исправления;
- Alt + Ins — генерация кода (геттеры, сеттеры, конструктор и т.д.);
- Ctrl + P — информация о параметре (применяется на аргументе метода при вызове);
- Ctrl + W — расширить область выделения;
- Ctrl + Shift + W — уменьшить область выделения;
- Ctrl + E — список недавних файлов;
- Shift + F6 — переименовать (переменную, функцию и т.д.);
- Ctrl + R — сделать замену;
- Ctrl + Q — быстрый просмотр документации;
- Ctrl + / — закомментировать/раскомментировать строку;
- Ctrl + Shift + / — закомментировать/раскомментировать блок кода;
- Ctrl + Alt + I — автоматически добавить нужные отступы для строки/строк;
- Ctrl + Shift + A — найти действие;
- Shift + Alt + ↑ — переместить выбранные строки вверх;
- Shift + Alt + ↓ — переместить выбранные строки вниз;
- Ctrl + Shift + F7 — показать все упоминания в файле;
- Ctrl + Alt + L — реформатировать код.
Eclipse
Если вы близки с open-source сообществом, то вы наверняка слышали об Eclipse. Будучи доступным для Linux, Windows и OS X, Eclipse де-факто является open-source IDE для разработки на Java. Существует множество расширений и аддонов, которые делают Eclipse полезным для разного рода задач и разработки на отличных от Java языках программирования вроде Python.
- Ctrl + 1 — быстрое исправление;
- Ctrl + Alt + R — переименовать;
- Ctrl + / — закомментировать/раскомментировать строку;
- Ctrl + Shift + / — закомментировать/раскомментировать блок кода;
- Alt + ↑ — переместить выбранные строки вверх;
- Alt + ↓ — переместить выбранные строки вниз;
- Ctrl + I — исправить отступы;
- Ctrl + Alt + U — показать все упоминания в файле;
- Ctrl + Q — перейти к последнему месту редактирования;
- Shift + Ctrl + X — привести текст к верхнему регистру;
- Shift + Ctrl + Y — привести текст к нижнему регистру;
- Ctrl + Shift + F — реформатировать код;
- Ctrl + Shift + O — автоматически вставить нужные импорты.
Visual Studio 2017
Visual Studio — полнофункциональная IDE от Microsoft, которая во многом сопоставима с Eclipse. Доступная на Windows и Mac OS, Visual Studio представлена как в бесплатном (Community), так и в платном (Professional и Enterprise) вариантах. Visual Studio позволяет разрабатывать приложения для разных платформ и предоставляет свой собственный набор расширений.
- F12 — перейти к определению(класса,метода и т.д.);
- Ctrl + Shift + L — поставить закладку;
- Ctrl + K Ctrl + W — открыть окно закладок;
- Ctrl + Shift + U — привести текст к верхнему регистру;
- Ctrl + U — привести текст к нижнему регистру;
- Ctrl + Shift + V или Ctrl + Shift + Ins — вставить один из 10 последних фрагментов текста, скопированных в буфер обмена;
- Ctrl + K Ctrl + C — закомментировать блок кода;
- Ctrl + K Ctrl + U — раскомментировать блок кода;
- Ctrl + K Ctrl + D — отформатировать весь документ;
- Ctrl + K Ctrl + F — отформатировать выбранный текст;
- Ctrl + K Ctrl + S — обернуть в конструкцию (if-else, цикл for и т.д.);
- Ctrl + ] — когда курсор установлен на скобку, регион, многострочный комментарий или строку, эта комбинация позволит увидеть начало и конец этого блока;
- Ctrl + M Ctrl + O — свернуть все функции;
Atom
Доступный на всех платформах Atom называют «хакабельным текстовым редактором 21 века». Atom написан с использованием Electron — фреймворка для создания кроссплатформенных приложений для десктопа средствами JavaScript, HTML и CSS — и имеет множество расширений.
- Ctrl + Shift + L — выбрать язык файла;
- Ctrl + Shift + D — копирует строку, на которой находится курсор, под неё же;
- Ctrl + Shift + K — удалить строку;
- Ctrl + ↑ — переместить выбранные строки вверх;
- Ctrl + ↓ — переместить выбранные строки вниз;
- Ctrl + R — открывает список со всеми символами (функциями) в текущем файле для быстрого перехода;
- Alt + F3 — выбрать все одинаковые слова;
- Ctrl + ЛКМ — множественные курсоры;
- Ctrl + J — соединить строки;
- Ctrl + [ — убрать отступы для выделенных строк;
- Ctrl +] — добавить отступы для выделенных строк.
Visual Studio Code
Visual Studio Code (не путать с Visual Studio) — полнофункциональный редактор кода, доступный на Windows, Linux и Mac OS X. VS Code является расширяемым open-source редактором, который можно настроить под любую задачу. Как и Atom, VS Code построен на Electron, поэтому у него есть те же преимущества и недостатки.
- F2 — переименовать символ (функцию, переменную и т.д.);
- Ctrl + Shift + O — перейти к символу;
- Ctrl + K Z — перейти в режим Дзен, в котором вас не отвлекают лишние детали;
- Ctrl + / — закомментировать/раскомментировать строку;
- Shift + Alt + A — закомментировать/раскомментировать блок кода;
- Ctrl + Shift + [ — свернуть область;
- Ctrl + Shift + ] — развернуть область;
- Ctrl + H — заменить;
- Shift + F12 — показать все упоминания;
- F12 — открыть определение (функции, класса и т.д.);
- Ctrl + K F12 — открыть определение в другой части экрана;
- Ctrl + K M — изменить язык файла;
- Ctrl + P — быстро открыть файл;
- Ctrl + \ — разделить экран;
- Ctrl + ` — открыть встроенный терминал;
- Ctrl + K Ctrl + S — показать список всех горячих клавиш.
Sublime Text
Sublime Text, написанный инженером из Google с мечтой о лучшем текстовом редакторе, является весьма популярным редактором кода. Доступный на всех платформах, Sublime Text имеет встроенную поддержку редактирования кода на разных языках, а также богатый набор расширений, называемых пакетами, которые расширяют возможности синтаксиса и редактирования.
- Ctrl + K Ctrl + C — переместить экран к курсору;
- Ctrl + Shift + ↑ — переместить выбранные строки вверх;
- Ctrl + Shift + ↓ — переместить выбранные строки вниз;
- Ctrl + Y — повторить действие последней использованной горячей клавиши;
- Ctrl + Shift + V — вставить с правильными отступами;
- Ctrl + F2 — поставить закладку;
- F2 — перейти к следующей закладке;
- Shift + F2 — перейти к предыдущей закладке;
- Ctrl + K Ctrl + U — привести текст к верхнему регистру;
- Ctrl + K Ctrl + L — привести текст к нижнему регистру;
- Alt + Shift + — разделить экран на (в пределах от 1 до 4) колонок;
- Alt + Shift + 5 — разделить экран в виде сетки 2х2;
- Alt + Shift + 8 — разделить экран на две строки;
- Ctrl + Shift + F — поиск и замена в файлах;
- Ввести lorem и нажать Tab — вставляет текст Lorem ipsum…;
- F9 — отсортировать выделенные строки.
ТОП горячих клавиш VS Code для начинающего джуна
«Поговорим не про Vim», олдам, сеньорам и тру-си-разработчикам на проверку: пользуетесь ли вы такими сочетаниями VS Code? Если же вы только начинаете программировать, влетаете в айти на реактивном самолете курсов по Питону, или просто не знаете ничего про хоткеи VS Code, возможно вам точно пригодится парочка сочетаний 🙂
Все сочетания описаны для VS Code на Windows
↓ / ↑ / ← / → — стрелки вниз, вниз и т.д.
ЛКМ / ПКМ / СКМ — левая, правая, средняя кнопки мышки соответственно.- Shift + Tab — сместить табуляцию на один шаг влево. Если вы пишете на Python, то табуляция или четыре пробела — ваш неизменный спутник. Но мало кто знает, что достаточно поставить курсор в любое место строки, нажать Shift + Tab и вуаля, вся строка смещается влево на «один таб».
- Ctrl + / — закомментировать или раскомментировать строку. VS Code сам разберется, какой язык программирования вы используете, и в начале строки установит или удалит необходимый символ для комментария. Место, где находится курсор на строке неважно.
- Shift + Del — удалить строку целиком. Теперь не нужно выделять мышкой всю строку и потом нажимать Backspace. Не нужно выделять всю строку. Правда!
- Alt + ↑ / ↓ — перемещение строки с курсором вверх или вниз. Просто попробуйте и ощутите, насколько это удобно. Знаете шутку «стоит всего один раз зимой надеть подштанники, и ты уже не можешь остановиться»? Так вот стоит только один раз переместить так строку, и вы уже не сможете по-другому!
- Shift + Alt + ↓ / ↑ — дублирование строки с курсором вниз. В зависимости от ↓ или ↑ курсор останется на текущей или новой строке. Теперь можно обойтись без Ctrl + C, хотя нет, нельзя =)
- F2 — переименовать переменную. Прошу заметить, что переименовываются все переменные с таким названием только внутри блока, не внутри всего открытого файла. Часто нужно переименовать переменную, которая уже используется в нескольких местах функции, и тут либо вручную расставлять курсор в нужное место, либо поставить курсор на переменную и нажать F2.
- F12 или Alt + ЛКМ на переменной — перейти к переменной или родительскому классу. Часто рассказывают про PyCharm, будто только он умеет проваливаться в родительские классы, чтобы посмотреть, какие его атрибуты мы можем переопределять, наследуясь от него; но так умеет и VS Code.
- Ctrl + D — выделяет слово, на котором находится курсор. Следующее нажатие на D (удерживая Ctrl) выделить следующее по порядку вниз идентичное значение. Вот пишете вы функцию, и вам нужно выделить ближайшие значения ‘name’. Легко! Выделить все вхождения слова можно вот так — Ctrl + F2. Радует то, что курсор оказывается в конце каждого выделенного значения и сразу можно редактировать!
- Ctrl + L — выделяет всю строку. Целиком. Теперь копипастить еще проще, не правда ли? =)
- Ctrl + Alt + → — разделить рабочую область и переместить актуальную вкладку вправо. Ctrl + Alt + ← возвращает вкладку назад. Вы не поверите, насколько удобно видеть, например, models.py и views.py рядом.
А теперь неочевидные, но потрясающие возможности. Меню → Файл → Настройки → Сочетания клавиш (Ctrl + K + Ctrl + S), в строке поиска вводим необходимый параметр и кликаем по результату мышкой, после нажимаем нужные клавиши для установки пользовательской настройки и наслаждаемся. Команды, которые точно стоит попробовать:
editor.action.jumpToBracket — переход к парной скобке, у меня установлено на Ctrl + Q. Сначала переход к ближайшей скобке, а следующее нажатие перемещает вас к парной скобке и так далее. Часто нам нужно оказаться либо в начале скобок, либо в конце. А кликать мышкой или стрелками не всегда удобно. Теперь достаточно одного нажатия и вы у нужной скобки.
editor.action.selectToBracket — выделить все внутри ближайших скобок и сами скобки, у меня это Ctrl + Shift + Q. Сколько кликов мышкой, сколько ошибок, выделяя внутри скобок мышкой или Shift + стрелки. А теперь можно просто одним нажатием выделить все точно и быстро.
Буду благодарен за любые интересные и полезные хоткеи, пишите в комментариях, что понравилось из моих, и что вы используете сами?
P. S. В комментариях рассказали про логичную, но неочевидную возможность IDE-шек и иже с ними: чтобы вырезать или скопировать строку, необязательно выделять ее целиком, можно просто переместить курсор на неё. ❤️
Написание комментариев в JavaScript
В программировании обычно в первую очередь учитывается то, как компьютер читает и интерпретирует написанный код. Но так же важно учитывать интересы людей, которые будут читать и работать с этим кодом дальше. Нужно уметь правильно комментировать и структурировать свой код, чтобы обеспечить простоту чтения.
Комментарии – это пометки в исходном коде программы, которые не читаются интерпретатором и поэтому не влияют на фактический вывод кода. Комментарии могут быть чрезвычайно полезны для объяснения целей и действий того или иного блока кода.
Без комментариев разработчикам бывает сложно понять код, написанный другими людьми. Да и вы сами можете просто забыть, для чего добавили в программу тот или иной блок кода. Правильно прокомментированный код поможет вам избежать проблем с поддержкой программы в будущем.
Синтаксис комментариев
В JavaScript есть два типа комментариев.
Однострочные комментарии в JavaScript записываются с помощью двух слешей //.
// This is a comment
Интерпретатор будет игнорировать все символы после // до конца строки.
Многострочные комментарии заключаются в теги /* и */. Если вы знакомы с CSS, вы уже знаете, как работают такие комментарии.
/* This is
a comment */Интерпретатор будет игнорировать все, что находится между этими тегами.
Все комментарии вне зависимости от их типа пишутся над блоком кода, который они объясняют.
// Print «Hello, World!» to the console
console.log(«Hello, World!»);Кроме того, комментарии должны находиться на одном уровне с объясняемым кодом.
// Initialize a function
function alphabetizeOceans()// Define oceans variable as a list of strings
const oceans = [«Pacific», «Atlantic», «Indian», «Antarctic», «Arctic»];// Print alphabetized array to the console
console.log(oceans.sort());Обратите внимание, что комментарии являются такой же частью кода, как и сама программа. Код с устаревшими комментариями хуже, чем код совсем без них, поэтому не забывайте регулярно поддерживать и обновлять комментарии вместе с остальным кодом программы.
Встроенные комментарии
Если однострочный комментарий находится в конце строки кода, такой комментарий называется встроенным.
let x = 99; // assign numerical value to x
let y = x + 2; // assign the sum of x + 2 to yВстроенные комментарии используются для создания коротких примечаний к небольшим отдельным фрагментам контента. Такой комментарий должен относиться только к той строке, в которой он написан.
Помните, что однострочные комментарии нельзя закрыть тегом. Если в эту строку случайно попадет код программы, интерпретатор пропустит его. Поэтому будьте внимательны, следите, чтобы комментарий не сливался со следующей строкой кода в одну строку.
for (let i = 0; i === 10; i++) // for loop that runs ten times // Running this code results in a syntax error
>Встроенные комментарии бывают очень полезны, но их следует использовать экономно – код с большим количеством встроенных комментариев выглядит грязно и, следовательно, его трудно читать.
Многострочные комментарии
Многострочные комментарии пишутся на уровне блока и представляют собой длинные примечания или описание последующего блока кода. Часто этот тип комментариев размещается в верхней части файла или перед особенно сложным блоком кода.
/* Initialize and invoke a the greetUser function
to assign user’s name to a constant and print out
a greeting. */
function greetUser() const name = prompt(«What is your name?»);
console.log(«Hello ,» + name + «! How are you?»);
>
greetUser();Иногда встречается немного видоизмененный синтаксис: комментарий открывается тегом /**, и каждая строка начинается с символа звездочки.
/**
* Initialize constant with an array of strings.
* Loop through each item in the array and print
* it to the console.
*/
const seaCreatures = [«Shark», «Fish», «Octopus»];
for (const seaCreature of seaCreatures) console.log(seaCreature);
>Иногда эти комментарии также содержат сведения о файле программирования, включая имя, версию и автора сценария.
Комментирование кода для тестирования
Комментарии позволяют игнорировать те или иные блоки кода для тестирования работы программы. Это называется «закомментировать код».
Если в каком-то блоке кода есть ошибка, вы можете попробовать закомментировать отдельные блоки для определения источника проблемы. Вы также можете использовать этот механизм для переключения между блоками кода, которые выдают разные результаты.
// Function to add two numbers
function addTwoNumbers(x, y) let sum = x + y;
return sum;
>
// Function to multiply two numbers
function multiplyTwoNumbers(x, y) let product = x * y;
return product;
>
/* In this example, we’re commenting out the addTwoNumbers
function, therefore preventing it from executing. Only the
multiplyTwoNumbers function will run */
// addTwoNumbers(3, 5);
multiplyTwoNumbers(5, 9);Закомментировать код можно с помощью как однострочных, так и многострочных комментариев. Выбор зависит от объема блока, который нужно закомментировать.
Примечание: Комментировать код нужно только на время тестирования. Не оставляйте закомментированные блоки в конечном сценарии.
Комментирование кода может оказаться полезным при разработке логики программы, поскольку так вы можете определить источник ошибок или оценить производительность того или иного блока.
Заключение
Код программы JavaScript читает не только машина, но и другие разработчики и пользователи. Комментарии позволяют сделать код удобочитаемым и более понятным.