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

Ты можешь представить переменную как ячейку в таблице или коробку на складе. В нее можно положить что-то, а можно оставить пустой.

Начни Учить Full-Stack JavaScript СЕЙЧАС!

Создание переменных

Переменные в JavaScript создаются с помощью ключевого слова let.

Не забывай писать все команды с новой строки!

let x;
let y;

Мы создали 2 переменные. Имя первой — x, а второй — y.

Сейчас они пустые, но мы можем в них что-то сохранить. Например, строки:

let x;
let y;

x = 'hello';
y = 'world';

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

Теперь, мы можем использовать переменные x и y в нашей программе. Попробуем вывести их на экран с помощью console.log.

let x;
let y;

x = 'hello';
y = 'world';

console.log(x);
console.log(y);

На экране появятся такие сообщения:

hello
world

Инициализация переменных и undefined

Когда ты сохраняешь значение в переменную первый раз — это называется “инициализация” или присваивание начального значения.

Инициализировать переменную можно сразу после создания.

let x = 'hello';
let y = 'world';

console.log(x);
console.log(y);

На экране появятся те же строки, что и раньше:

hello
world

Если ты забудешь инициализировать переменную, то ее значение будет не определено. В JavaScript для этого есть специальное значение undefined.

let x = 'hello';
let y;

console.log(x);
console.log(y);

Мы забыли присвоить значение переменной y, теперь ее значение не определено.

hello
undefined

Изменение значения переменных

После инициализации, значение переменной можно изменить.

let x = 'hello';
console.log(x);

x = 'olleh';
console.log(x);

Разберем этот пример пошагово:

  • В первой строке мы сделали два действия: создали переменную x и присвоили ей значение hello.
  • Во второй строке мы вывели на экран текущее значение переменной x.
  • В третьей строке, мы присвоили x новое значение - olleh. Значение x изменилось!
  • В четвертой строке, мы выводим на экран текущее значение переменной x, чтобы убедиться в том, что оно равно olleh, а не hello.

На экране появятся такие строки:

hello
olleh

Практические задачи

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

Задача 1

Создадим одну переменную message, сохраним в нее строку hello и выведем ее значение на экран.

Введи в редакторе кода команды:

let message = 'hello';
console.log(message);

И нажми “ЗАПУСК”.

Задача 2

Создадим две переменные x и y, сохраним в них строки hello и world и попробуем сложить их.

Введи в редакторе кода команды:

let x = 'hello';
let y = 'world';
console.log(x + y);

И нажми “ЗАПУСК”.

Задача 3

В этом примере кода есть ошибка.

let greeting = hello world;
console.log(greeting);

Перепиши код, исправь ошибку с помощью одинарных кавычек и нажми “ЗАПУСК”.

Задача 4

Выведи на экран сообщение I will become a programmer! любым удобным способом. Можешь сохранить это сообщение в переменную и использовать ее внутри console.log, а можешь обойтись и без переменной. Решай сам. Я буду проверять только вывод на экран.

Как обычно, для проверки задачи не забудь нажать “ЗАПУСК”.