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

Очень важно поддерживать простоту, удобочитаемость и простоту обслуживания в вашем коде, чтобы управлять сложными проектами JavaScript. Последовательное соблюдение соглашений об именах является ключом к достижению этой цели.

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

1. Именование переменных

В JavaScript данные хранятся в переменных. Очень важно выбирать для переменных описательные имена, точно отражающие их функцию. Можно, например, заменить имя пользователя или Итоговая цена для имени переменной, а не Икс.

Хороший способ назвать переменные выглядит следующим образом:

позволять общая цена = 100;
позволять имя_пользователя = "Джон";

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

2. Именование логического значения

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

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

Рассмотрим этот пример:

позволять Действителен = истинный;
позволять имеет значение = ЛОЖЬ;

В этом примере описательные логические имена переменных дают понять, что они представляют.

3. Именование функций

Функция в JavaScript относится к автономной единице кода, предназначенной для выполнения определенной задачи. Это блок кода, который может быть вызван или вызван другими частями кода и работает как независимая сущность.

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

Например:

функциярассчитатьTotalPrice(цена, количество) {
возвращаться цена * количество;
}
функциявалидатеусеринпут(вход) {
возвращаться ввод !== неопределенный && ввод !== нулевой;
}

4. Именование констант

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

Например:

константа МАКС._ЦЕНА = 1000;
константа МИН_ЦЕНА = 0;

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

5. Именование классов

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

Возьмем, например:

сортКорзина{
конструктор(сделать модель) {
этот.сделать = сделать;
этот.модель = модель;
 }
}

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

6. Именование компонентов

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

Разбивая сложный пользовательский интерфейс или приложение на более мелкие, управляемые части, вы можете создать компоненты, которые можно повторно использовать в разных проектах, сокращая время разработки и увеличивая объем кода эффективность.

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

Такое соглашение помогает отличать компоненты от других сегментов кода, упрощая идентификацию и манипулирование.

функцияКнопка(реквизит) {
возвращаться<кнопка>{реквизит.метка}кнопка>;
}

В этом примере соглашение об именовании PascalCase использовалось для именования компонента. Кнопка.

7. Методы именования

При именовании методов очень важно использовать описательные имена, которые успешно сообщают о том, что делает метод, поскольку методы — это функции, относящиеся к объекту.

Например:

сортМашина{
конструктор(сделать модель) {
этот.сделать = сделать;
этот.модель = модель;
 }
 запустить двигатель() {
// код для запуска двигателя 
 } 
 остановить двигатель () { 
// код остановки двигателя 
 }
 }
}

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

8. Именование частных функций

Доступ к функциям, определенным как частные, ограничен только внутри объекта, в котором они определены. Крайне важно добавить начальное подчеркивание (_), чтобы указать, что функции являются частными.

Вот пример:

сортМашина{
конструктор(сделать модель) {
этот.сделать = сделать;
этот.модель = модель;
 }
 _запустить двигатель() {
// код для запуска двигателя
 }
 _stopEngine () {
// код остановки двигателя
 }
}

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

9. Именование глобальных переменных

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

Например:

константа МАКС._ЦЕНА = 1000;
константа МИН_ЦЕНА = 0;
функцияпроверитьЦена(цена) {
если (цена > MAX_PRICE) {
// код для обработки высоких цен
 } ещеесли (цена < MIN_PRICE) {
// код для обработки низких цен
 }
}

10. Именование файлов

Эффективная организация файлов — важнейший аспект успешного управления проектами JavaScript. Чтобы обеспечить упрощенные и последовательные соглашения об именах, важно разделять слова в именах файлов строчными буквами и дефисами.

Предпочтение отдается строчным буквам, потому что JavaScript чувствителен к регистру, а это означает, что язык обрабатывает строчные и прописные буквы по-разному. Использование строчных букв в именах файлов обеспечивает согласованность и позволяет избежать путаницы при ссылках на файлы в коде.

Дефисы используются для разделения слов в именах файлов, поскольку пробелы в именах файлов не допускаются. Другие альтернативы, такие как символы подчеркивания или camelCase, также могут использоваться, но дефисы обычно предпочтительнее из-за их удобочитаемости.

Использование дефисов также делает имена файлов более доступными для пользователей программ чтения с экрана или других вспомогательных технологий.

мое приложение/
├── источник/
 ├── компоненты/
 ├── button.js
 ├── input-field.js
├── утилиты/
 ├── string-utils.js
 ├── date-utils.js
├── app.js
├── index.js

В этом примере строчные буквы и дефисы используются для разделения слов в именах файлов.

Важность соблюдения соглашений об именах в JavaScript

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