Перейти к основному содержимому

Наименование функций/переменных

  1. Используйте camelCase для наименования функций и переменных.
  2. Используйте осмысленные имена.
  3. Избегайте слишком длинных имен.
  4. Избегайте сокращения.

Следуйте S-I-D​

Имя должно быть коротким (Short), интуитивно понятным (Intuitive) и описательным (Descriptive)

Хорошо
const postsCount = 5;
const hasPagination = postsCount > 10;
const shouldDisplayPagination = postsCount > 10; // альтернатива
Плохо
const a = 5; // "a" может обозначать что угодно
const isPaginatable = postsCount > 10; // "Paginatable" звучит крайне неестественно
const shouldPaginatize = postsCount > 10; // Придуманные слова

Учитывайте единственное/множественное число​

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

Хорошо
const friend = 'Bob';
const friends = ['Bob', 'Tony', 'Jhon'];
Плохо
const friends = 'Bob';
const friend = ['Bob', 'Tony', 'Jhon'];

Префиксы:​

  1. is (Описывает свойство или состояние текущего контекста (обычно — логическое значение))
const color = 'blue';
const isBlue = color === 'blue'; // свойство
const isPresent = true; // состояние
  1. has (Указывает, имеет ли текущий контекст определенное значение или состояние (обычно — логическое значение))
Хорошо
const hasProducts = productsCount > 0;
Плохо
const isProductsExist = productsCount > 0;
const areProductsPresent = productsCount > 0;
  1. should (Отражает положительный условный оператор (обычно — логическое значение), связанный с определенным действием.)
const shouldUpdateUrl = (url, expectedUrl) => url !== expectedUrl;
  1. get (Получает доступ к данным немедленно (сокращение от getter для внутренних данных))
const getFruitsCount = () => this.fruits.length;
  1. set (Безусловно присваивает переменной со значением A значение B)
let fruits = 0;
const setFruits = (nextFruits) => {
  fruits = nextFruits;
};
setFruits(5);
  1. reset (Возвращает переменную к её начальному значению или состоянию)
const initialFruits = 5;
let fruits = initialFruits;
setFruits(10);
console.log(fruits); // 10
const resetFruits = () => {
  fruits = initialFruits;
};
resetFruits();
console.log(fruits); // 5
  1. fetch (Выполняет запрос данных, для которого требуется время (например, асинхронный запрос))
const fetchPosts = (postCount) => fetch('https://api.dev/posts', {...});
  1. remove (Удаляет что-то откуда-то)
const removeFilter = (filterName, filters) =>
  filters.filter((name) => name !== filterName);
const selectedFilters = ['price', 'availability', 'size'];
removeFilter('price', selectedFilters);
  1. delete (Полностью стирает что-то. После операции сущность перестаёт существовать)
const deletePost = (id) => fetch('https://api.dev/posts', { method: 'DELETE' });
  1. handle (Обработка действия. Часто используется при именовании обратного вызова)
const handleLinkClick = () => {
  console.log('Clicked a link!');
};