TLDR
JavaScript має лексичне (також його називають статичним) визначення і закриття. Це означає, що ви можете вказати область ідентифікатора, переглянувши вихідний код.
Чотири сфери застосування:
- Глобальний - видно всім
- Функція - видима в межах функції (та її підфункцій та блоків)
- Блок - видимий всередині блоку (та його підблоків)
- Модуль - видно в модулі
Поза окремими випадками глобальної та модульної області, змінні оголошуються за допомогою var(область функцій), let(область блоку) та const(область блоку). Більшість інших форм декларації ідентифікатора мають жорсткий режим блоку.
Огляд
Область застосування - область кодової бази, над якою діє ідентифікатор.
Лексичне середовище - це відображення між іменами ідентифікаторів та пов'язаними з ними значеннями.
Область застосування складається з пов'язаного гніздування лексичних середовищ, причому кожен рівень вкладеності відповідає лексичному середовищу контексту виконання предків.
Ці пов'язані лексичні середовища утворюють сферу "ланцюга". Розв’язання ідентифікатора - це процес пошуку уздовж цього ланцюга для відповідного ідентифікатора.
Роздільна здатність ідентифікатора відбувається лише в одному напрямку: назовні. Таким чином, зовнішнє лексичне середовище не може "бачити" внутрішнє лексичне середовище.
У вирішенні сфери дії ідентифікатора в JavaScript є три важливі фактори :
- Як оголошено ідентифікатор
- Де оголошено ідентифікатор
- Незалежно від того, чи перебуваєте ви в суворому режимі або в не строгому режимі
Деякі із способів визначити ідентифікатори:
var, letіconst- Параметри функції
- Параметр блоку лову
- Декларації функцій
- Іменні вирази функцій
- Неявно визначені властивості глобального об'єкта (тобто відсутні
varв нестрогому режимі)
import заявиeval
Деякі з ідентифікаторів локацій можна оголосити:
- Глобальний контекст
- Функціональний орган
- Звичайний блок
- Верхня частина керуючої структури (наприклад, цикл, якщо, під час тощо)
- Орган управління структурою
- Модулі
Стилі декларації
вар
Ідентифікатори, оголошені за допомогою, var мають область функцій , за винятком випадків, коли вони оголошуються безпосередньо в глобальному контексті, і в цьому випадку вони додаються як властивості глобального об'єкта і мають глобальну область застосування. Існують окремі правила їх використання у evalфункціях.
хай і const
Ідентифікатори, задекларовані за допомогою letта const мають блок-сферу , за винятком випадків, коли вони оголошені безпосередньо в глобальному контексті, і в цьому випадку вони мають глобальну сферу застосування.
Примітка: let, constі var все піднімають . Це означає, що їх логічне положення визначення є вершиною сфери їх застосування (блоком або функцією). Однак змінні, оголошені використаними, letі constне можуть бути прочитані або призначені доти, поки контроль не передає точку декларації у вихідний код. Проміжний період відомий як часова мертва зона.
function f() {
function g() {
console.log(x)
}
let x = 1
g()
}
f() // 1 because x is hoisted even though declared with `let`!
Імена параметрів функції
Назви параметрів функції присвоюються тілу функції. Зауважте, що в цьому є невелика складність. Функції, оголошені як аргументи за замовчуванням, близькі до списку параметрів , а не тіла функції.
Декларації функцій
Оголошення функцій мають область блоку в суворому режимі, а функціональну область - в не строгому режимі. Примітка: нестрогий режим - це складний набір нових правил, заснованих на химерних історичних реалізаціях різних браузерів.
Іменні вирази функцій
Визначені вирази функцій визначаються для себе (наприклад, з метою рекурсії).
Неявно визначені властивості глобального об'єкта
У нестрогому режимі неявно визначені властивості глобального об'єкта мають глобальну сферу застосування, оскільки глобальний об'єкт розташований у верхній частині ланцюга області. У суворому режимі це заборонено.
eval
У evalрядках змінні, оголошені за допомогою, varбудуть розміщені в поточному діапазоні або, якщо evalвони використовуються опосередковано, як властивості глобального об'єкта.
Приклади
Нижче буде кидати ReferenceError , тому що імена x, yі zне має ніякого значення поза функцією f.
function f() {
var x = 1
let y = 1
const z = 1
}
console.log(typeof x) // undefined (because var has function scope!)
console.log(typeof y) // undefined (because the body of the function is a block)
console.log(typeof z) // undefined (because the body of the function is a block)
Нижче наведено ReferenceError для yта z, але не для x, оскільки видимість xне обмежена блоком. Блоки, що визначають тіла керуючих структур, як if, forі while, поводяться аналогічно.
{
var x = 1
let y = 1
const z = 1
}
console.log(x) // 1
console.log(typeof y) // undefined because `y` has block scope
console.log(typeof z) // undefined because `z` has block scope
Далі xвидно зовні циклу, оскільки varмає область функцій:
for(var x = 0; x < 5; ++x) {}
console.log(x) // 5 (note this is outside the loop!)
... через таку поведінку вам потрібно бути обережним щодо закриття змінних, оголошених використанням varв циклі. Тут xзадекларований лише один екземпляр змінної , і він логічно розташований поза циклом.
Наступні друкуються 5п'ять разів, а потім 5шостий раз друкуються для console.logзовнішньої петлі:
for(var x = 0; x < 5; ++x) {
setTimeout(() => console.log(x)) // closes over the `x` which is logically positioned at the top of the enclosing scope, above the loop
}
console.log(x) // note: visible outside the loop
Наступні відбитки, undefinedоскільки xце блок-область. Зворотні дзвінки виконуються по черзі асинхронно. Нова поведінка для letзмінних означає , що кожна анонімна функція зімкнулася над іншою змінною з ім'ям x( в відміну від неї зробили б з var), і так цілих чисел 0через 4роздруковуються.:
for(let x = 0; x < 5; ++x) {
setTimeout(() => console.log(x)) // `let` declarations are re-declared on a per-iteration basis, so the closures capture different variables
}
console.log(typeof x) // undefined
Наведене нижче НЕ кине а, ReferenceErrorтому що видимість xне обмежується блоком; однак вона буде надрукована, undefinedоскільки змінна не була ініціалізована (через ifвисловлювання).
if(false) {
var x = 1
}
console.log(x) // here, `x` has been declared, but not initialised
Змінна, оголошена вгорі forциклу за допомогою let, прив'язується до тіла циклу:
for(let x = 0; x < 10; ++x) {}
console.log(typeof x) // undefined, because `x` is block-scoped
Наступне буде кидати a, ReferenceErrorоскільки видимість xобмежується блоком:
if(false) {
let x = 1
}
console.log(typeof x) // undefined, because `x` is block-scoped
Змінні, задекларовані за допомогою модулів var, letабо constвсі вони відносяться до:
// module1.js
var x = 0
export function f() {}
//module2.js
import f from 'module1.js'
console.log(x) // throws ReferenceError
Далі буде оголошено властивість глобального об'єкта, оскільки змінні, оголошені з використанням varу глобальному контексті, додаються як властивості до глобального об'єкта:
var x = 1
console.log(window.hasOwnProperty('x')) // true
letі constв глобальному контексті не додають властивості до глобального об'єкта, але все ж мають глобальний обсяг:
let x = 1
console.log(window.hasOwnProperty('x')) // false
Параметри функції можна вважати оголошеними в тілі функції:
function f(x) {}
console.log(typeof x) // undefined, because `x` is scoped to the function
Параметри блоку лову відносяться до тіла лову блоку:
try {} catch(e) {}
console.log(typeof e) // undefined, because `e` is scoped to the catch block
Ім'яні вирази функцій присвоюються лише самому виразу:
(function foo() { console.log(foo) })()
console.log(typeof foo) // undefined, because `foo` is scoped to its own expression
У не строгому режимі неявно визначені властивості глобального об'єкта мають загальний обсяг. У суворому режимі ви отримуєте помилку.
x = 1 // implicitly defined property on the global object (no "var"!)
console.log(x) // 1
console.log(window.hasOwnProperty('x')) // true
У не строгому режимі декларації функцій мають область функцій. У суворому режимі вони мають блок-сферу.
'use strict'
{
function foo() {}
}
console.log(typeof foo) // undefined, because `foo` is block-scoped
Як це працює під кришкою
Обсяг визначається як лексична область коду, над якою діє ідентифікатор.
В JavaScript, кожна функція-об'єкт має приховану [[Environment]]посилання , яка є посиланням на лексичну середу з контексті виконання (кадрі стеки) , в протягом якого він був створений.
Коли ви викликаєте функцію, викликається прихований [[Call]]метод. Цей метод створює новий контекст виконання та встановлює зв'язок між новим контекстом виконання та лексичним середовищем функції-об'єкта. Це робиться шляхом копіювання [[Environment]]значення на об'єкт функції у зовнішнє посилання поле на лексичне середовище нового контексту виконання.
Зауважимо, що цей зв’язок між новим контекстом виконання та лексичним середовищем об’єкта функції називається a закриттям .
Таким чином, в JavaScript обсяг реалізується через лексичні середовища, пов'язані разом у "ланцюжку" за допомогою зовнішніх посилань. Цей ланцюжок лексичних середовищ називається ланцюжком дії, і роздільна здатність ідентифікатора відбувається шляхом пошуку ланцюга для відповідного ідентифікатора.
Дізнайтеся більше .
