Загрузка...

Переменные в JavaScript

Комментарии вы уже видели: заметки для людей, а не склад для программы. Теперь переменные — именные «коробки», где лежит значение, чтобы не набирать одно и то же число или текст снова и снова.

Что такое переменная в JavaScript и как её объявить?

Переменная — имя, которое хранит значение. С помощью let или const вы создаёте имя (объявляете), затем кладёте значение через =. Дальше вызываете имя вместо повторения самого значения. Если оно потом может измениться — берите let; если после первого присваивания должно остаться тем же — const. В старых примерах встречается var; для новичка в этом курсе достаточно и предпочтительнее let и const.

Какое ключевое слово выбрать?

📊 Выбор let, const или var для новичка

Слово Пример Совет новичку
let let score = 10; Создайте имя; позже можно дать новое значение
const const city = "Oslo"; Создайте имя; после первого значения не переназначайте
var var old = 1; Старый стиль; работает, но здесь берите let / const
Знак = score = 15; Кладёт значение в уже объявленное через let имя
Чтение имени console.log(score); Берёт сохранённое значение — имя заменяет данные

Объявите через let и посмотрите значение

let создаёт имя. Первый = кладёт значение внутрь. console.log показывает его в консоли.

let со строкой

javascript 
let greeting = "Hello";
console.log(greeting);

Объявите через const

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

const с фиксированной меткой

javascript 
const course = "JavaScript";
console.log(course);

Измените значение let

С let можно снова поставить =. Имя то же; меняется только содержимое.

Повторное присваивание let

javascript 
let score = 10;
score = 15;
console.log(score);

Консоль показывает 15 — более позднее присваивание заменило 10.

Сначала имя, потом значение

Иногда пишут только let status; и присваивают на следующей строке. Пока внутри пусто, не используйте имя так, будто там уже есть полезное значение.

Объявление, затем присваивание

javascript 
let status;
status = "Ready";
console.log(status);

Два имени в одном выражении

Имена можно ставить внутри выражения. Движок читает каждое сохранённое значение и считает результат.

две переменные в выражении

javascript 
let a = 2;
let b = 3;
console.log(a + b);

Покажите значение на странице

Сохраните текст в переменной и передайте это имя в textContent. Меняйте только строку в переменной и обновите страницу — заголовок изменится.

Текст страницы из переменной

html 
<!DOCTYPE html>
<html>
<head>
<title>Variables — Page value</title>
</head>
<body>
<h1 id="msg">Waiting…</h1>
<script>
let message = "Variables hold values";
document.getElementById("msg").textContent = message;
</script>
</body>
</html>

Заголовок показывает то, что лежит в message. Переменная — многоразовый контейнер; строка DOM лишь выводит результат на страницу — навык, который вы уже отрабатывали.

Попробуйте сами

  1. Создайте let со своим именем-строкой, выведите в лог, присвойте другую строку и снова выведите.
  2. Создайте const с названием города и выведите. Не переназначайте; при попытке будет ошибка — уберите ту строку.
  3. Напишите let total;, затем total = 5; и выведите total.
  4. Два числа через let и их сумму через +.
  5. В HTML-демо поменяйте только строку в message, обновите страницу и проверьте заголовок.

Частые ошибки

  • Использовать имя до объявления (или до полезного значения)
  • Написать const score = 1; и потом score = 2; — const это отклоняет
  • Держать число только в комментарии и ждать, что программа «запомнит» — комментарий не хранилище
  • Думать, что в каждом примере нужен var — этот курс предпочитает let и const
  • Недопустимые или хаотичные имена (пробелы, цифра в начале) — правила идентификаторов в уроке о синтаксисе

Кратко

  • Переменная — именной контейнер для повторно используемого значения
  • Объявляйте через let или const, присваивайте через =
  • Переназначайте через let; const после первого значения не меняйте
  • В коде новичка предпочитайте let и const старому var
  • Дальше — типы данных: какие значения может хранить переменная

🧠 Проверьте Свои Знания

Готов к Началу

Проверьте Свои Знания

Бросьте себе вызов с помощью этой интерактивной викторины и узнайте, насколько хорошо вы понимаете тему

❓
7
Вопросы
🎯
70%
Для Прохождения
♾️
∞
Время
🔄
∞
Попытки

📝 Инструкции

  • Внимательно прочитайте каждый вопрос
  • Выберите лучший ответ на каждый вопрос
  • Вы можете пересдавать тест столько раз, сколько захотите
  • Ваш прогресс будет показан вверху
Тема 7 из 7
Javascript Урок