Пусть для простоты у нас есть всегда выполняющееся условие:
if (true) {
}
Давайте рассмотрим следующий код:
if (true) {
let result = '!';
}
console.log(result);
Как вы видите, в переменную result должно записаться значение '!'. Однако, если запустить этот код, то в консоль выведется ошибка!
Дело в том, что переменные, объявленные внутри фигурных скобок, видны только внутри этих скобок, и не видны снаружи.
По-научному здесь идет речь об области видимости переменных.
Можно говорить о том, что областью видимости переменных, объявленных внутри фигурных скобок, являются только эти фигурные скобки.
Однако, если переменная объявлена снаружи фигурных скобок, то видна и внутри них, и снаружи:
let result; // переменная объявлена снаружи
if (true) {
result = '!';
}
console.log(result); // выведет '!'
Пример
В следующем примере в переменную result в зависимости от условия записывается либо значение 1, либо значение 2:
let num = 5;
if (num >= 0) {
let result = 1;
} else {
let result = 2;
}
console.log(result);
Однако, если запустить этот код, то в консоль выведется ошибка. Как вы теперь уже понимаете, все дело в видимости переменных.
Для решения проблемы объявим переменную снаружи условия:
let test = true;
let result; // объявим переменную снаружи условия
if (test) {
result = 1;
} else {
result = 2;
}
console.log(result); // выведет 1
Автор приведенного ниже кода хотел выполнить проверку возраста на достижение 18 лет.
Код, однако, не работает. Исправьте ошибку автора кода.
Вот проблемный код:
let age = 17;
if (age >= 18) {
let adult = true;
} else {
let adult = false;
}
console.log(adult);
Нюансы
Область видимости переменных обладает некоторым нюансом.
Давайте рассмотрим его на примере.
Давайте объявим снаружи нашего условия переменную result с одним значением, а внутри условия поменяем это значение на другое:
let result = 1;
if (true) {
result = 2;
}
console.log(result); // выведет 2
Как вы видите, переменная result поменялась внутри условия.
Все, однако, поменяется, если внутри условия также объявить переменную result через let:
let result = 1;
if (true) {
let result = 2; // объявим переменную через let
}
console.log(result); // выведет 1, а не 2!
Здесь все дело в том, что объявление переменой через let внутри условия создало локальную переменную result.
То есть внутри условия существует одна переменная result, а снаружи условия - другая.
Убедится в этом можно, выведя значение переменной в консоль внутри условия:
let result = 1;
if (true) {
let result = 2;
console.log(result); // выведет 2
}
console.log(result); // выведет 1
Автор приведенного ниже кода хотел выполнить проверку возраста на достижение 18 лет.
Код, однако, при любом значение возраста выводит в консоль значение undefined. Исправьте ошибку автора кода.
Вот проблемный код:
let age = 17;
let adult;
if (age >= 18) {
let adult = true;
} else {
let adult = false;
}
console.log(adult);
Автор приведенного ниже кода хотел выполнить проверку возраста на достижение 18 лет.
После проверки кода оказалось, что если возраст равен или больше 18 лет, то в переменную adult записывается true, как и должно быть, однако, если возраст меньше 18, то переменная adult имеет значение undefined.
Исправьте ошибку автора кода.
Вот проблемный код:
let age = 17;
let adult;
if (age >= 18) {
adult = true;
} else {
let adult = false;
}
console.log(adult);
Автор приведенного ниже кода хотел выполнить проверку возраста.
Код, однако, при любом значение возраста выводит в консоль значение undefined. Исправьте ошибку автора кода.
Вот проблемный код:
let age = 17;
let result;
if (age >= 18) {
if (age <= 23) {
let result = 'от 18 до 23';
} else {
let result = 'больше 23';
}
} else {
let result = 'меньше 18';
}
console.log(result);
Автор приведенного ниже кода хотел выполнить проверку возраста.
Код, однако, при значение возраста большим 18 лет выводит в консоль значение undefined. Исправьте ошибку автора кода.
Вот проблемный код:
let age = 19;
let result;
if (age >= 18) {
let result;
if (age <= 23) {
result = 'от 18 до 23';
} else {
result = 'больше 23';
}
} else {
result = 'меньше 18';
}
console.log(result);
Область видимости var
В самом начале учебника я рассказывал вам, что переменные можно объявлять либо через let, либо через var.
Эти два способа объявления переменных создают для них разные области видимости.
Посмотрим на примерах.
В следующем примере переменная объявлена через let внутри условия и поэтому не видна снаружи условия:
if (true) {
let result = '!';
}
console.log(result); // выдаст ошибку
А вот если объявить переменную через var - то переменная будет видна снаружи условия:
if (true) {
var result = '!';
}
console.log(result); // выведет '!'
Определите, что выведет приведенный код:
let num = 1;
if (num == 1) {
var result = 'верно';
} else {
var result = 'неверно';
}
console.log(result);
Определите, что выведет приведенный код:
let num = 1;
if (num == 1) {
let result = 'верно';
} else {
let result = 'неверно';
}
console.log(result);
Замечания по поводу let и var
Как я упоминал ранее, объявление переменных через let появилось в JavaScript позже, чем объявление переменных через var.
В настоящее время рекомендуется объявлять переменные именно через let, так как область видимости таких переменных ограничена фигурными скобками (это защищает код от случайных ошибок).