Что такое охват?

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

Контекст выполнения

Контекст выполнения — это абстрактное понятие, которое просто описывает среду, в которой выполняется ваш код. Существует два типа: глобальный и локальный контекст выполнения. Глобальный контекст выполнения создается первым при запуске кода. Локальный контекст выполнения создается при вызове функции.

Глобальная и локальная область действия

В Javascript глобальной областью действия считается вся область программы или документа, в котором вы кодируете, в то время как локальная область относится к отдельной функции или объекту. Может быть только одна глобальная область, в то время как в вашей программе может быть много локальных областей. Простая аналогия, с которой можно связать это понятие, может быть следующей: рассмотрим зоопарк с множеством разных видов животных и смотрителя зоопарка. В этой аналогии каждый вид животных имеет свою собственную среду (локальную область действия), которая будет функцией, животные внутри являются локальными переменными, доступными только в пределах их среды. Zookeeper будет глобальной переменной, которая имеет доступ ко всему зоопарку (глобальная область).

// Global scope
let zooKeeper = "I'm global!"
function zooAnimalEnivornment() {
  // Local scope
  let zooAnimal = "I'm a local!"
}
console.log(zooKeeper) // I'm global!
console.log(zooAnimal) // Uncaught ReferenceError: zooAnimal is not defined

В приведенном выше примере кода мы объявляем глобальную переменную и присваиваем ей строку. Далее, функция, которую мы объявляем zooAnimalEnivornment(), объявляется также в глобальной области видимости, но она создает свою собственную область видимости, локальную для себя, это область действия функции. Когда мы регистрируем глобальную переменную zooKeeper, она выводится на консоль без каких-либо ошибок, потому что она доступна для всей программы, но когда мы пытаемся зарегистрировать локальную переменную zooAnimal , она выдает Reference Error, потому что она не видна нигде, кроме своей собственной функции. .

Область блока

Когда переменные объявляются внутри блока кода, такого как условный оператор, или даже внутри цикла for, они доступны только в локальной области действия этого блока. Это верно при объявлении с помощью let и const, но при использовании var для объявления ваших переменных он все равно будет доступен за пределами блока.

if (true) {
  let blockScopedVar = "I'm block scoped!"
  const anotherBlockScopedVar = "I'm also block scoped!"
}
console.log(blockScopedVar) // Uncaught ReferenceError: blockScopedVar is not defined
console.log(anotherBlockScopedVar) // Uncaught ReferenceError: anotherBlockScopedVar is not defined
for (let i = 0; i < 3; i++) {
  console.log(i) // logs: 0 1 2
}
console.log(i) // Uncaught ReferenceError: i is not defined
if (true) {
  var notBlockScopedVar = "I'm not block scoped!"
}
console.log(notBlockScopedVar) // I'm not block scoped!

Лексическая область видимости (вложенные функции)

В Javascript мы можем объявлять функции внутри других функций. При этом создается вложенная область или лексическая область, как это называется в Javascript. Это означает, что любые внутренние функции будут иметь доступ ко всем переменным своих внешних функций, но не наоборот. Это верно независимо от того, насколько глубоко вложена внутренняя функция. Простой пример показан ниже:

function outer() {
    let outerVar = 1
    
    function inner() {
        let innerVar = 2
        
        console.log(outerVar, innerVar) // 1 2
    }
    inner()
}
outer() // 1 2

Когда вызывается outer(), он записывает содержимое обеих переменных в консоль, потому что inner() имеет доступ к своей собственной локальной переменной и переменной, назначенной во внешней области. Тема лексической области действия приводит к понятию замыкания, которое определяется веб-документами MDN как Замыкание — это комбинация функции, связанной вместе (вложенной) со ссылками на ее окружающее состояние (лексическое окружение). ' Подробнее о замыканиях можно прочитать «здесь.

Избегайте использования var

До Javascript ES6 (ECMAScript 2015) не было поддержки let и const, при создании переменных использовалась только var. Var относится к области действия функции и позволяет переназначать переменные по сравнению с let и const, которые являются областью действия блока и не допускают переназначения. Так что лучше не использовать var, чтобы избежать множества возможных багов и ошибок, которые могут возникнуть из-за этого.

Вывод

Область видимости — чрезвычайно важная концепция в любом языке программирования. В общих чертах область действия В Javascript — это то, что определяет видимость и доступность переменных. Двумя основными типами области являются глобальная и локальная области. Для дальнейшего чтения о области видимости в Javascript перейдите по ссылкам ниже:

Первоначально опубликовано на https://coderjay06.github.io 25 января 2021 г.