Как называть переменные

48279

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

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

1. Строковые переменные

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


const serverMessage = 'hello server'
const componentHtml = '<h1>Hello</h1>'
const login = 'username'
const password = 'qwerty'
const ACCESS_TOKEN = 'zzzzzz'

2. Никакого транслита. Только английский.

неправильно


var moiTovar;
var cena;
var ssilka;

правильно


var myGood;
var price;
var link;

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

Длина переменных, как правило на английском короче, чем на транслите.

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

3. Числовые переменные

Почти в каждом проекте приняты следующие правила.

  • количество (count)
  • код чего-либо (code)
  • размер (size, length)
  • номер (number)

пример


const keyCode = 15
const numberFromEnd = 101
const maxWindowSize = 900
const minCharacterLength = 10
const newMessageCount = 3

 4. Переменные из нескольких слов пишутся вместеВотТак

Приведенный ниже способ, называется «верблюжьей нотацией» или, по-английски, «camelCase».

var borderLeftWidth;

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

var border_left_width;

5. Булевое значение

Логичным названием для булевой переменной — вопрос с ответом да или нет.

  • это (is)
  • содержит (has/contain)
  • может (can)
  • должен (shoud)
  • возможность (able)

const isPopupOpen = true;
const hasUpperLetters = true;
const containObject = false;
const shoudUpdate = false;
const disabled = true;

6. Массивы

Это существительные во множественном числе, которые имеют окончание на s и es.


const users = [{ name: 'Yury'}];
const letters = ['A', 'B', 'C'];
const codes = [21, 37];

 

7. Использование коротких имен переменных только для небольшого фрагмента кода

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

8. Объекты

Не стоит дублировать название объекта в названии свойства или метода.

неправильно

const user = {
    userName: 'test',
    getUsername() {},
};

правильно

const user = {
    name: 'test',
    getName() {},
};

9. Функции и методы

Для функций, используйте первое слово глагол.

  • init/initialize
  • compute
  • find
  • create (object, array…)
  • to (string, array…)
  • filter

const initApp = () => {};
const computeMaxHeight = () => {};
const findClosestElement = () => {};
const toString = () => {};
const filterUsers = () => {};

10. Симметричные пары

Общие:

  • min/max
  • up/down
  • old/new
  • begin/end
  • first/last
  • next/previous

Для функций:

  • open/close
  • get/set
  • add/remove
  • create/destroy
  • start/stop
  • insert/delete
  • increment/decrement
  • show/hide
  • suspend/resume