Переменные: let, const и почему не var

данные≈ 6 минут

Здесь будет встроен видео-разбор темы (5–7 минут, YouTube / RuTube / VK Видео) — тем, кто лучше воспринимает на слух, текст ниже не обязателен.

Программа постоянно что-то запоминает: имя пользователя, счёт в игре, цену товара. Для этого существуют переменные — именованные «коробки» с данными, и в этой статье мы научимся заводить их через let и const.

Разделы темы:·

Переменная создаётся ключевым словом let, за которым идёт имя. Знак = кладёт значение внутрь — эта операция называется присваиванием. Дальше по имени можно получить то, что лежит в коробке.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Объявляют переменную один раз, а пользуются сколько угодно. Значение можно заменить в любой момент — старое стирается без следа, и let при этом повторять не нужно: ключевое слово ставится только при создании. Написать let с тем же именем второй раз нельзя — будет ошибка.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Можно объявить переменную и без значения — тогда внутри окажется undefined, пока вы что-нибудь не положите. Чаще всё же удобнее сразу объявить и присвоить одной строкой.

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

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Отсюда практическое правило: объявляйте всё через const, а let берите только тогда, когда точно собираетесь перезаписывать значение — счётчик цикла, накапливаемая сумма. В реальном коде переприсваивается меньшинство переменных, так что const будет встречаться гораздо чаще. Бонус: увидев const, читатель может не следить, не поменялось ли значение где-то ниже.

const — всегда, let — по необходимости, var — никогда

В коде до 2015 года переменные объявляли словом var. У него нет блочной области видимости: переменная, созданная внутри фигурных скобок if или for, не остаётся там, а «протекает» наружу. Из-за этого переменные из разных блоков незаметно перезаписывали друг друга — классический источник трудноуловимых ошибок.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Вторая странность — «всплытие»: объявление var как будто поднимается в начало функции, поэтому переменной можно пользоваться раньше строки, где она объявлена, — вместо ошибки вы получите undefined. let и const ведут себя строже и предсказуемее, так что в новом коде var не пишут; встретить его можно только в старых проектах и древних статьях.

Имя может состоять из букв, цифр и символов $ и _, но не может начинаться с цифры. Дефисы и пробелы запрещены, а регистр важен: apple и Apple — две разные переменные. Когда имя состоит из нескольких слов, принято писать его в стиле camelCase: первое слово с маленькой буквы, каждое следующее — с большой.

ИмяГодится?
userNameДа — образцовый camelCase
test123Да — цифры допустимы, если не первые
$elementДа — $ обычный символ, без магии
_tempДа — подчёркивание может стоять даже первым
1placeНет — начинается с цифры
user-nameНет — дефис читается как минус

Формальные правила — это минимум. Главное, чтобы имя описывало содержимое: data и value2 не говорят ничего, а userName и ordersCount читаются как обычный текст. Код читают гораздо чаще, чем пишут, поэтому минута, потраченная на хорошее имя, окупается многократно.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Часто константа хранит «магическое» значение, известное ещё до запуска программы: код цвета, лимит попыток, адрес сервера. Такие константы принято называть ЗАГЛАВНЫМИ_БУКВАМИ_С_ПОДЧЁРКИВАНИЕМ. Строка "#F00" посреди кода ничего не объясняет, а имя COLOR_RED объясняет всё.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

Капс — только для значений, «зашитых» в код заранее. Константа, которая вычисляется во время работы программы, — например const now = Date.now() — остаётся в camelCase: она тоже не переприсваивается, но её значение до запуска неизвестно.

  • let создаёт переменную, = присваивает значение; менять его можно сколько угодно раз.
  • const запрещает переприсваивание — это выбор по умолчанию, let берём только там, где перезапись задумана.
  • Имя переменной — буквы, цифры (не первой), $ и _; стиль — camelCase, и имя должно описывать содержимое.
  • «Магические» значения, известные до запуска, выносим в константы КАПСОМ: COLOR_RED, MAX_RETRIES.
  • var — устаревшее объявление без блочной области видимости и со «всплытием»; в новом коде не используется.

1/3Что выведет этот код? let x = 5; x = "пять"; console.log(x);

2/3Переменную не планируется переприсваивать. Через что её объявить?

3/3Какое из имён — допустимое имя переменной?

Переведите на const

В этом коде всё объявлено через let. Найдите переменные, которые ни разу не переприсваиваются, и замените их объявления на const.

js
Tab добавляет отступ. Чтобы выйти из редактора, нажмите Escape — фокус перейдёт на кнопку запуска.

greeting и userName нигде не переприсваиваются — их объявляем через const. А message перезаписывается на четвёртой строке, поэтому остаётся let.

Секунды в неделе

В сутках 86 400 секунд (60 · 60 · 24). Заведите под это число константу, назвав её в правильном стиле, и с её помощью вычислите и выведите количество секунд в неделе.

Значение известно заранее, поэтому имя пишем капсом: const SECONDS_PER_DAY = 86400; — а дальше console.log(SECONDS_PER_DAY * 7); // 604800.