let vs. const vs. var
ES6 представил let
и const
в качестве альтернативы исходному var
для определения переменных. Давайте углубимся в различия между ними.
Сфера
Переменные, определенные с помощью var
, имеют область действия. По сути, это означает, что их можно использовать в той функции, в которой они определены. Если они не определены в функции, они имеют глобальную область видимости. Более подробное объяснение можно найти здесь.
Переменные, определенные с помощью let
или const
, имеют область видимости блока. Блок можно просто определить как что-либо, заключенное в фигурные скобки {}. Сюда входят функции, но также, например, if
операторы и for
циклы. Опять же, подробности здесь.
Повторная декларация
Если вы объявите переменную с помощью let
или const
, а затем повторно объявите ее, вы получите сообщение об ошибке. Например:
let animal = 'dog'; let animal = 'cat'; VM148:1 Uncaught SyntaxError: Identifier 'animal' has already been declared
Эта защита может быть очень полезной для предотвращения ошибок. Переменные, объявленные с помощью var
, не имеют этой функции. Вы можете повторно декларировать, как хотите… на свой страх и риск.
Объявление в разных областях
Вот где это немного сложно. Когда вы объявляете переменную с помощью var
, а затем повторно объявляете ее внутри блока if
или for
, это как если бы вы обновили ту же переменную. Если вы сделаете то же самое с let
или const
, вы фактически создадите новую переменную в памяти. Учтите следующее:
let num = 15; let doubleDigits = false; if (num >= 10) { let doubleDigits = true; }; console.log(doubleDigits); // false
Сделаем то же самое с var
.
var num = 15; var doubleDigits = false; if (num >= 10) { var doubleDigits = true; }; console.log(doubleDigits); // true
Обратите внимание: поскольку var
имеет область видимости функции, а блок if
не является функцией, переменная находится в той же области видимости как внутри, так и вне оператора if
. Повторное объявление переменной с использованием var
в этом случае по существу обновляет ту же переменную.
С другой стороны, повторное объявление с let
создает новую переменную в памяти, которая доступна только в пределах блока (в данном случае оператор if
). Это относится и к const
.
Переназначение
Переназначение переменной let
работает так же, как var
.
let animal = 'monkey'; animal = 'duck'; console.log(animal); // duck
С const
дело обстоит иначе.
const animal = 'monkey'; animal = 'duck'; console.log(animal); // VM685:1 Uncaught TypeError: Assignment to constant variable.
Это делает const
полезным при создании чего-то вроде особого ключа, который не нужно менять.
А теперь самое распространенное заблуждение о const
. Люди часто думают, что const
переменные неизменяемы, то есть вообще не могут измениться. Это не так. Дело в том, что const
переменные нельзя полностью переназначить. Но если ваш const
является объектом или массивом, эти свойства можно изменить.
const ids = [5, 7, 9, 11] ids.push(13) console.log(ids) // [5, 7, 9, 11, 13]
Конечно, если вы попытаетесь полностью переназначить ids
, например: ids = { hello: "world" }
, вы получите ошибку «присвоение постоянной переменной».
При работе в ES6 бывает ли когда-нибудь вариант, когда var является лучшим выбором?
Ознакомьтесь с первым ответом здесь, чтобы получить подробный ответ с примером. Спойлер: ответ - нет. let
и const
были созданы для замены var
.
Надеюсь, это поможет!