JavaScript Ключевое слово let
ECMAScript 2015
ES2015 представил два важных новых ключевых слова JavaScript: let и const.
Эти два ключевых слова предоставляют переменные (и константы) области действия блока в JavaScript.
До ES2015 у JavaScript было только два типа области видимости: глобальная область действия и область действия функции.
Глобальная область
Переменные, объявленные глобально (вне любой функции), имеют глобальную область действия.
Пример
var carName = "Volvo";
// код здесь может использовать carName
function myFunction() {
// код здесь также может использовать carName
}
Попробуйте сами »
Доступ к глобальным переменным можно получить из любого места в программе JavaScript.
Область функции
Переменные, объявленные локально (внутри функции), имеют область действия.
Пример
// код здесь НЕ может использовать carName
function myFunction() {
var carName = "Volvo";
// код здесь МОЖЕТ использовать carName
}
// код здесь НЕ МОЖЕТ использовать carName
Попробуйте сами »
Доступ к локальным переменным возможен только изнутри функции, в которой они объявлены.
Область действия блока JavaScript
Переменные, объявленные с помощью var ключевого слова,
не могут иметь область действия блока.
К переменным, объявленным внутри блока {}, можно получить доступ извне блока.
Пример
{
var x = 2;
}
// Здесь МОЖНО использовать x
До ES2015 в JavaScript не было области действия блока.
Переменные, объявленные с помощью let ключевого слова, могут иметь область действия блока.
К переменным, объявленным внутри блока {}, можно получить доступ извне блока.
Пример
{
let x = 2;
}
// x здесь НЕЛЬЗЯ использовать
Повторное объявление переменных
Повторное объявление переменной с использованием var ключевого слова может вызвать проблемы.
Повторное объявление переменной внутри блока также приведет к повторному объявлению переменной вне блока:
Пример
var x = 10;
// Здесь x равно 10
{
var x = 2;
// Здесь x равно 2
}
// Здесь x равно
Попробуйте сами »
Повторное объявление переменной с использованием let ключевого слова может решить эту проблему.
Повторное объявление переменной внутри блока не приведет к повторному объявлению переменной вне блока:
Пример
var x = 10;
// Здесь x равно 10
{
let x = 2;
// Здесь x равно 2
}
// Здесь x равно 10
Попробуйте сами »
Поддержка браузера
Ключевое слово let не полностью поддерживается в Internet Explorer 11 или более ранней версии.
В следующей таблице определены первые версии браузеров с полной поддержкой let ключевого слова:
| Chrome 49 | Edge 12 | Firefox 44 | Safari 11 | Opera 36 |
| Mar, 2016 | Jul, 2015 | Jan, 2015 | Sep, 2017 | Mar, 2016 |
Область цикла
Использование var в цикле:
Пример
var i = 5;
for (var i = 0; i < 10; i++) {
// некоторые заявления
}
// Здесь i равно 10
Попробуйте сами »
Использование let в цикле:
Пример
let i = 5;
for (let i = 0; i < 10; i++) {
// некоторые заявления
}
// Здесь i равно 5
Попробуйте сами »
В первом примере при использовании переменная var, объявленная в цикле,
повторно объявляет переменную вне цикла.
Во втором примере при использовании переменная let, объявленная в цикле,
не повторно объявляет переменную вне цикла.
Когда let используется для объявления переменной i в цикле,
переменная i будет видна только внутри цикла.
Область функции
Переменные, объявленные с помощью var и let,
очень похожи при объявлении внутри функции.
У них обоих будет область действия функции:
function myFunction() {
var carName = "Volvo";
// Область действия функции
}
function myFunction() {
let carName = "Volvo"; //
Область действия функции
}
Глобальная область
Переменные, объявленные с помощью var и let,
очень похожи, когда объявлены вне блока.
У них обоих будет глобальная область:
var x = 2;
// Глобальная область видимости
let x = 2;
// Глобальная область видимости
Глобальные переменные в HTML
В JavaScript глобальной областью видимости является среда JavaScript.
В HTML глобальной областью видимости является объект window.
Глобальные переменные, определенные с помощью var ключевого слова, принадлежат объекту window:
Глобальные переменные, определенные с помощью let ключевого слова, не принадлежат объекту window:
Повторное объявление
Повторное объявление переменной JavaScript с помощью var разрешено в любом месте программы:
Повторное объявление var переменной с let,
в той же области или в том же блоке не допускается:
Пример
var x = 2; // Разрешено
let x = 3; // Не разрешено
{
var x = 4; // Разрешено
let x = 5 // Не разрешено
}
Повторное объявление let переменной с let,
в той же области или в том же блоке не допускается:
Пример
let x = 2; // Разрешено
let x = 3; // Не разрешено
{
let x = 4; // Разрешено
let x = 5; // Не разрешено
}
Повторное объявление let переменной с var,
в той же области или в том же блоке не допускается:
Пример
let x = 2; // Разрешено
var x = 3; // Не разрешено
{
let x = 4; // Разрешено
var x = 5; // Не разрешено
}
Повторное объявление переменной let, в другой области или в другом блоке разрешено:
Пример
let x = 2; // Разрешено
{
let x = 3; // Разрешено
}
{
let x = 4; // Разрешено
}
Попробуйте сами »
Подъем
Переменные, определенные с помощью var,
поднимаются вверх и могут быть инициализированы в любое время
(если вы не знаете, что такое подъем, прочтите Главу о подъеме).
Значение: вы можете использовать переменную до ее объявления:
Переменные, определенные с помощью let,
поднимаются в верхнюю часть блока, но не инициализируются.
Значение: блоку кода известно о переменной, но ее нельзя использовать, пока она не будет объявлена.
Использование let
переменной до ее объявления приведет к созданию файла ReferenceError.
Переменная находится во "временной мертвой зоне" от начала блока до его объявления:
