Действительно ли нам нужно «Let», если у нас уже есть «Var»?
Что такое Вар?
Посмотрим, что говорит MDN:
Оператор
var
объявляет переменную на уровне функции или на глобальном уровне, при необходимости инициализируя ее значением.
Сфера? Что это?
Область действия определяет доступность переменных или других выражений. Чтобы узнать подробности о сфере действия проверьте эту ссылку.
Var имеет глобальную или функциональную область видимости
Глобальный означает, что если переменная объявлена вне функции, она доступна для всех функций и скриптов на веб-странице или, другими словами, доступна для всего окна.
В области действия означает, что если переменная объявлена внутри функции, то она доступна и доступна только внутри функции.
давайте посмотрим на пример:
var num = 9; // Global scope function greeting(){ var str = 'hey!!'; // Functional Scope }
Поскольку переменная num находится вне какой-либо функции, она имеет глобальную область видимости. в то время как переменная str находится внутри функции, поэтому она имеет область действия. что означает, что к нему нельзя получить доступ за пределами приветствия. Попробуйте это в своем редакторе.
var num = 9; function greeting(){ var str = 'hey!!'; } console.log(str); // ReferenceError: str is not defined
Большинство из нас знает это о Var, поэтому возникает вопрос: в чем реальная проблема с var?
Var может быть обновлен и объявлен повторно. т.е.
var num = 9; num = 15;
Это разрешено в javascript, и, кстати, мы обновляли такие переменные много раз. в чем проблема?
var num = 9; var num = 15;
Это также разрешено в той же области. Это проблема. Теперь представьте, что вы или кто-то уже объявили num с некоторым значением в других частях кода (но в той же области), если вы повторно объявите num по незнанию, оно будет переопределено, и могут появиться неожиданные ошибки. давайте посмотрим на этот пример
var num = 9;
if (true) {
var num = 15; // num will get redefined to 15
}
console.log(num) // 15
«LET» спасает нас
Но прежде чем углубляться в «Let», давайте посмотрим, что говорит MDN:
Оператор
let
объявляет локальную переменную с блочной областью видимости, при необходимости инициализируя ее значением.
Let is Block-scoped, что означает, что переменная , объявленная с помощью let внутри блока, доступна только в этом блоке.
Я знаю, что вы думаете. что такое блок в первую очередь?
Блок - это область кода, ограниченная фигурными скобками {}. Все, что находится внутри {}, представляет собой блок. мы обычно сталкиваемся с блоком с некоторыми условными операторами, такими как операторы if или циклы, но также разрешено использовать его автономно.
{ let a = 10; let b = 20; }
Это вполне допустимый блок. Что касается блочной области видимости let, посмотрите этот пример.
let a = 10; if (true) { let b = 5; console.log(b); // 5 }
console.log(a); // 10 console.log(b) //
ReferenceError: b is not defined
но в случае с Вар:
var a = 10; if (true) { var b = 5; console.log(b); // 5 }
console.log(a); // 10 console.log(b) // 5
Поскольку let имеет блочную область видимости, переменная b недоступна за пределами области видимости, в которой она объявлена. Но в случае переменной Var, которая является глобальной или функциональной, доступ к переменной b осуществляется в пределах области, в которой она определена. Следовательно, ошибки нет.
Пусть можно обновить, но нельзя повторно объявить
Переменные, объявленные с помощью let, могут быть обновлены в пределах его области видимости. т.е.
let num = 20; num = 20;
но повторное декларирование не допускается
let num = 10; let num = 20; // Error: Identifier 'num' has already been declared
Поскольку num объявляется в одной и той же области дважды, возникает ошибка (var не показывает ошибку в том же случае, как обсуждалось выше). но обратите внимание, что одна и та же переменная может быть определена в разных областях без ошибок, что означает
let a = 20; if (true) { let a = 30; console.log(a) // 30 } console.log(a); // 20
Мы много рассказали о Вар и Лет. но осталась одна вещь
Подъем Var & Let
Javascript перемещает объявления переменных и функций в верхнюю часть их области видимости перед выполнением. это называется подъемом. Пример:
console.log(num); var num = 10; // Before execution. above code will get converted to var num; console.log(num); // undefined num = 10;
Обе переменные Var и Let перемещаются вверх, но переменные с var инициализируются неопределенным значением, а переменная Let не инициализируется.
console.log(num); let num = 10; // RefrenceError: Cannot access 'num' before initialization
Это все, что касается Вар против Лет. Ведь совершенно очевидно, что Let - это умный выбор в настоящее время.
Я буду публиковать больше таких блогов. Спасибо за чтение 😄.