Объявления Var, Let, Const, переменных в ES6

Когда дело доходит до объявления переменных с помощью JavasScript, есть три основных варианта: «var», «let» и «const». Каждое из этих объявлений переменных несет в себе различную область видимости, использование и подъем. Вопросы «В чем разница между var и let?» Или «В чем разница между let и const?» Часто задают, чтобы оценить свои знания фундаментального JavaScript. Таким образом, необходимо полностью понимать эти термины и их различия. Я начну с описания области видимости и подъема, поскольку это ключевые принципы объявления этих переменных.

Объем

Область действия можно определить как значение, определяющее доступность переменных. Переменные, определенные внутри функции, имеют так называемую «локальную» область видимости и доступны только внутри этой функции (между фигурными скобками {}). Известно, что переменная, определенная вне функции, имеет «глобальную» область видимости. При объявлении переменной вне функции на глобальном уровне все функции и скрипты в вашем файле JavaScript могут получить к ней доступ.

LOCAL
function myFunction() {
  let food = pizza;
  // the food variable is accessible within this function
}
// outside of the function, 'food' will not be accessible
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
GLOBAL
let food = donuts;
// here, the 'food' variable is declared outside of the function
function mySecondFunction() {
  food = sushi;
  // as 'food' was declared globally in this case, it can be     accessed from within the function
}

Подъем

Подъем - это стандартное поведение JavaScript, заключающееся в перемещении всех объявлений в верхнюю часть текущей области видимости, при этом «поднимая» их.

console.log(city);
var city = "New York City";
// Output: Undefined

Проблема с подъемом заключается в том, что поднимаются только объявления переменных, а не фактические присвоенные значения. Ваш сценарий распознает, что переменная существует, но не будет иметь для нее значения. Это может привести к некоторым надоедливым, а иногда и трудно исправляемым ошибкам в вашем коде. Вы можете увидеть, что значение не определено, и ожидаете другого типа ошибки, или наоборот, в результате подъема. (Если вместо этого переменная была объявлена ​​с помощью «let», вы получите ошибку «ReferenceError», а не «undefined», что было бы гораздо более удобоваримым сообщением об ошибке, которое будет обсуждаться в разделе «let»)

var, let, const

После понимания концепций области видимости и подъема будет намного легче различать типы объявлений переменных.

‘Var’: самое старое из этих объявлений - ‘var’. До ES6 единственным способом объявления переменных была var. Переменные, объявленные с помощью ключевого слова var, могут быть изменены или переназначены значения, и к ним можно получить доступ в областях, отличных от той, которая была им назначена. При этом "var" уникальным образом поднимается таким образом, вызывая описанные выше ошибки при подъеме.

«Let»: объявление, которое ближе всего к старому «var», - «let». Переменные, объявленные с помощью 'let', также могут быть переназначены, ключевое отличие состоит в том, что переменные, объявленные с помощью 'let', имеют область видимости блока, например, к ним можно получить доступ только внутри блока кода (между {} s) и внутренним блоков, что было заявлено. Переменные, объявленные с помощью 'let', имеют строго локальную, блочную область видимости и предотвращают проблемы подъема, которые могут возникнуть при использовании 'var'.

let dog = "Spot";
dog = "Fido";
console.log(dog) // "Fido"

‘Const’: последний тип объявления переменной - ‘const’. Этот тип объявления имеет много общего с let, с той лишь разницей, что после того, как переменной присваивается значение с помощью «const», это значение нельзя переназначить. Этот тип объявления лучше всего использовать в случаях, когда значение никогда не следует переназначать или оно остается неизменным во всем приложении. (Один из способов решения этой проблемы заключается в том, что для объектов, объявленных с помощью «const», могут быть обновлены их свойства)

const city = "New York City"
city = "San Francisco" // error : Assignment to constant variable.

В заключение, лучше всего придерживаться новых объявлений «let» и «const», в зависимости от приложения, чтобы избежать проблем с подъемом и внутренних проблем, связанных с глобально доступной переменной. Если помнить о области видимости, использование let и const - идеальный способ объявления переменных.