Let js совместимость с браузерами
Обновлено: 08.07.2024
Ключевое слово let было введено в ES6 (2015).
Переменные, определенные с помощью let нельзя повторно объявить.
Переменные, определенные с помощью let должны быть объявлены перед использованием.
Переменные, определенные с помощью let имеют область действия блока.
Невозможно повторно объявить
Переменные, определенные с помощью let не могут быть объявлены повторно.
Вы не можете случайно повторно объявить переменную.
С помощью let вы не сможете этого сделать:
Пример
let x = "John Doe";
// SyntaxError: 'x' уже было объявлено
С помощью var вы можете:
Пример
var x = "John Doe";
Область действия блока
До ES6 (2015) в JavaScript были только Global Scope (Глобальная область) и Function Scope (область действия).
ES6 представил два важных новых ключевых слова JavaScript: let и const .
Эти два ключевых слова обеспечивают Block Scope (область действия блока) в JavaScript.
К переменным, объявленным внутри блока < >, нельзя получить доступ извне блока:
Пример
Переменные, объявленные с помощью ключевого слова var , НЕ могут иметь область действия блока.
Переменные, объявленные внутри блока < >, могут быть доступны вне блока.
Пример
Повторное объявление переменных
Повторное объявление переменной с помощью ключевого слова var может вызвать проблемы.
Повторное объявление переменной внутри блока также приведет к повторному объявлению переменной вне блока:
Пример
var x = 10;
// Здесь x равно 10
<
var x = 2;
// Здесь x равно 2
>
// Здесь x равно 2
Повторное объявление переменной с помощью ключевого слова let может решить эту проблему.
Повторное объявление переменной внутри блока не приведет к повторному объявлению переменной вне блока:
Пример
let 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 |
Повторное объявление
Повторное объявление переменной JavaScript с помощью var разрешено в любом месте программы:
Пример
var x = 2;
// Теперь x равно 2
var x = 3;
// Теперь x равно 3
С помощью let повторное объявление переменной в том же блоке ЗАПРЕЩЕНО:
Пример
var x = 2; // Разрешено
let x = 3; // Не разрешено
let x = 2; // Разрешено
let x = 3 // Не разрешено
>
let x = 2; // Разрешено
var x = 3 // Не разрешено
>
Повторное объявление переменной с помощью let в другом блоке РАЗРЕШЕНО:
Пример
let x = 2; // Разрешено
let x = 3; // Разрешено
>
let x = 4; // Разрешено
>
Подъём (хостинг) Let
Переменные, определённые с помощью var , поднимаются вверх и могут быть инициализированы в любое время.
Важно: вы можете использовать переменную до её объявления:
Пример
Если вы хотите узнать больше о подъёме, изучите главу JavaScript Подъём.
Переменные, определенные с помощью let также поднимаются в верхнюю часть блока, но не инициализируются.
Важно: использование переменной let перед её объявлением приведет к ошибке ReferenceError :
Пример
ПАЛИТРА ЦВЕТОВ
Получите ваш
Сертификат сегодня!
Связь с админом
Топ Учебники
Топ Справочники
Топ Примеры
Веб Сертификаты
Этот сайт оптимизирован для обучения и тестирования. Примеры могут быть упрощены для улучшения чтения и базового понимания. Учебные пособия, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность и работоспособность всего контента. Используя этот сайт, вы соглашаетесь с тем, что прочитали и приняли условия использования, cookie и политику конфиденциальности.
Также вы можете абсолютно бесплатно скачать офлайн версию сайта W3Schools на русском архивом с GitHub и пользоваться локально на своём компьютере.
Также доступна версия сайта W3Schools на украинском языке.
Copyright 1999-2021 by Refsnes Data. All Rights Reserved.
Сайт работает на фреймворке W3.CSS.
Директива let позволяет объявить локальную переменную с областью видимости, ограниченной текущим блоком кода . В отличие от ключевого слова var , которое объявляет переменную глобально или локально во всей функции, независимо от области блока.
Объяснение, почему было выбрано название "let" можно найти здесь.
Правила области видимости
Областью видимости переменных, объявленных ключевым словом let , является блок, в котором они объявлены, и все его подблоки. В этом работа директива let схожа с работой директивы var . Основная разница заключается в том, что областью видимости переменной, объявленной директивой var , является вся функция, в которой она объявлена:
Чище код во вложенных функциях
let иногда делает код чище при использовании вложенных функций.
Пример выше будет выполнен как и ожидается, так как пять экземпляров внутренней функции (анонимной) будут ссылаться на пять разных экземпляров переменной i . Пример будет выполнен неверно, если заменить директиву let на var, или удалить переменную i из параметров вложенной функции и использовать внешнюю переменную i во внутренней функции.
На верхнем уровне скриптов и функций let, в отличии от var, не создаёт свойства на глобальном объекте . Например:
В выводе программы будет отображено слово "global_x" для this.x , но undefined для this.y .
Эмуляция приватных членов
При взаимодействии с конструкторами можно использовать выражение let чтобы открыть доступ к одному или нескольким приватным членам через использование замыканий:
Эта техника позволяет получить только "статичное" приватное состояние - в примере выше, все экземпляры полученные из конструктора SomeConstructor будут ссылаться на одну и ту же область видимости privateScope .
Временные мёртвые зоны и ошибки при использовании let
Повторное объявление той же переменной в том же блоке или функции приведёт к выбросу исключения SyntaxError.
В стандарте ECMAScript 2015 переменные, объявленные директивой let, переносятся в начало блока. Но если вы сошлётесь в блоке на переменную, до того как она объявлена директивой let, то это приведёт к выбросу исключения ReferenceError , потому что переменная находится во "временной мёртвой зоне" с начала блока и до места её объявления. (В отличии от переменной, объявленной через var , которая просто будет содержать значение undefined )
Вы можете столкнуться с ошибкой в операторах блока switch , так как он имеет только один подблок.
Использование let в циклах for
Вы можете использовать ключевое слово let для привязки переменных к локальной области видимости цикла for . Разница с использованием var в заголовке цикла for , заключается в том, что переменные объявленные var , будут видны во всей функции, в которой находится этот цикл.
Правила области видимости
В этом примере expr2 , expr3, statement заключены в неявный блок, который содержит блок локальных переменных, объявленных конструкцией let expr1 . Пример приведён выше.
Примеры
let vs var
Когда let используется внутри блока, то область видимости переменной ограничивается этим блоком. Напомним, что отличие заключается в том, что областью видимости переменных, объявленных директивой var, является вся функция, в которой они были объявлены.
let в циклах
Вы можете использовать ключевое слово let для привязки переменных к локальной области видимости цикла for , вместо того что бы использовать глобальные переменные (объявленные с помощью var ).
Нестандартизированные расширения let
let блок
Поддержка let блоков была убрана в Gecko 44 баг 1023609.
let блок предоставляет способ, ассоциировать значения с переменными внутри области видимости этого блока, без влияния на значения переменных с теми же именами вне этого блока.
Синтаксис
Описание
let блок предоставляет локальную область видимости для переменных. Работа его заключается в привязке нуля или более переменных к области видимости этого блока кода, другими словами, он является блоком операторов. Отметим, что область видимости переменных, объявленных директивой var , в блоке let , будет той же самой, что и если бы эти переменные были объявлены вне блока let , иными словами областью видимости таких переменных по-прежнему является функция. Скобки в блоке let являются обязательными. Опускание их приведёт к синтаксической ошибке.
Пример
Правила для этого блока кода аналогичны как и для любого другого блока кода в JavaScript. Он может содержать свои локальные переменные, объявленные let .
Правила области видимости
Областью видимости переменных, объявленных директивой let , в блоке let является сам блок и все подблоки в нем, если они не содержат объявлений переменных с теми же именами.
let выражения
Поддержка let выражений была убрана в Gecko 41 баг 1023609.
let выражение позволяет объявить переменные с областью видимости ограниченной одним выражением.
Синтаксис
Пример
Вы можете использовать let для объявления переменных, областью видимости которых является только одно выражение:
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 ключевого слова, не могут иметь область действия блока.
К переменным, объявленным внутри блока <>, можно получить доступ извне блока.
Пример
До ES2015 в JavaScript не было области действия блока.
Переменные, объявленные с помощью let ключевого слова, могут иметь область действия блока.
К переменным, объявленным внутри блока <>, можно получить доступ извне блока.
Пример
Повторное объявление переменных
Повторное объявление переменной с использованием 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 , очень похожи, когда объявлены вне блока.
У них обоих будет глобальная область:
Глобальные переменные в HTML
В JavaScript глобальной областью видимости является среда JavaScript.
В HTML глобальной областью видимости является объект window.
Глобальные переменные, определенные с помощью var ключевого слова, принадлежат объекту window:
Пример
var carName = "Volvo";// код здесь может использовать window.carName
Глобальные переменные, определенные с помощью let ключевого слова, не принадлежат объекту window:
Пример
let carName = "Volvo";// код здесь не может использовать window.carName
Повторное объявление
Повторное объявление переменной JavaScript с помощью var разрешено в любом месте программы:
Пример
// Теперь x равно 2
// Теперь x равно 3
Повторное объявление 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 .
Переменная находится во "временной мертвой зоне" от начала блока до его объявления:
От автора: в этой статье я расскажу об использовании в ES6 let и const, двух новых ключевых слов, добавленных в JavaScript с приходом ES6. Они улучшают JavaScript, предоставляя способ определения переменных и констант области видимости блока.
Эта статья является одной из многих, в которых рассматриваются новые функции JavaScript, введенные в ES6, включая Map и WeakMap, Set и WeakSet, новые методы, доступные для String, Number и Array, и новый синтаксис, доступный для функций.
JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
После запуска этого кода вы увидите следующий вывод в консоли:
Эта ситуация изменилась в ES6 с введением области видимости блока. Члены организации ECMA понимали, что они не могут изменить поведение ключевого слова var, поскольку это приведет к потере обратной совместимости. Поэтому они решили ввести новое ключевое слово, let. Последнее может использоваться для определения переменных, ограничивая их область действия блоком, в котором они объявлены. Кроме того, в отличие от var, переменные, объявленные с использованием let, не поднимаются. Если вы ссылаетесь на переменную в блоке до того, как встретится объявление этой переменной, это приведет к созданию ReferenceError. Но что это означает на практике? Это полезно только для новичков? Вовсе нет!
Чтобы объяснить вам, чем полезно let, давайте рассмотрим следующий код, взятый из моей статьи 5 дополнительных заданий для собеседования по JavaScript:
Здесь вы можете узнать хорошо известную проблему, которая связана с объявлениями переменных, их областью действия и обработчиками событий. Если вы не знаете, о чем я говорю, перейдите к статье, о которой я упоминал выше, а затем возвращайтесь. Благодаря ES6 мы можем легко решить эту проблему, объявив переменную i в цикле for, используя let:
JavaScript. Быстрый старт
Изучите основы JavaScript на практическом примере по созданию веб-приложения
Оператор let поддерживается в Node и во всех современных браузерах. Однако есть несколько проблем, связанных с Internet Explorer 11, о которых вы можете узнать из таблицы совместимости ES6. Ниже приведена онлайн демо-версия, иллюстрирующая разницу между var и let, она доступна на JSBin:
const
const предназначена для удовлетворения общей потребности разработчиков связывать мнемоническое имя с заданным значением, так чтобы значение не могло быть изменено (или более простыми словами для определения константы). Например, если вы работаете с математическими формулами, вам может понадобиться создать объект Math. Внутри этого объекта вы хотите связать значения π и e с мнемоническим именем. const позволяет сделать это. Используя его, вы можете создать константу, которая может быть глобальной или локальной для функции, в которой она объявлена.
На константы, определенные с помощью const, распространяются те же правила области видимости, что и на переменные, но их нельзя переопределить. Константы также как и переменные, созданные с помощью let, имеют область видимости блока, а не функции (и, следовательно, они не поднимаются). Если вы попытаетесь получить доступ к константе до ее объявления, вы получите ReferenceError. Если вы попытаетесь назначить другое значение переменной, объявленной с помощью const, вы получите TypeError.
Однако обратите внимание, что const не являются неизменяемыми. Как утверждает Матиас Байненс в своем посте в блоге ES2015 const не являются неизменяемыми, const создает неизменную привязку, но это не значит, что само значение неизменно, как показывает следующий код:
Читайте также: