Давайте рассмотрим пример, чтобы получить краткое представление о том, что такое область действия в Javascript. Для следующего кода ниже, как вы думаете, какой результат будет, когда вы «console.log(person)»?

function greet(){
  let person = 'James' 
  console.log(person, 'nice to meet you')
}

console.log(person) // ?

Если вы думали, что результатом будет «Джеймс», вы немного ошиблись. Обычно, если вы вызываете переменную, она должна работать, поскольку «человек» определяется со значением «Джеймс», поэтому она не должна быть неопределенной.

console.log(person) // undefined

Однако это работает по-другому, если они находятся в функции. Он недоступен, так как находится внутри функции, потому что функции создают свою собственную лексическую среду (к этому мы еще вернемся), которая блокирует доступ извне.

Вот что такое Scope в JavaScript! И эти доступные области могут быть классифицированы как:

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

Любые переменные, объявленные внутри блока кода { }, можно считать областью действия блока. Кроме того, есть:

  1. если операторы () {}
  2. для циклов () {}
  3. функция () {}

Любые переменные внутри области блока могут быть ссылками друг на друга. Однако если у вас есть переменная вне блока кода и вы хотите получить доступ к переменной внутри блока кода, это невозможно. Вы получите значение undefined.

function greet(){
  let person = 'James' 
  console.log(person, 'nice to meet you')
}

console.log(person) // undefined
{
 const a = 'a'
}
const b = 'b'
console.log(a) // app crashed... a is not defined

Удивительно то, что вы можете получить доступ к переменной вне блока кода из блока кода, если они не находятся внутри другого блока кода.

const outside = 'free variable'

function invisibleWall(){
  const inside = 'cannot reach from outside'
  console.log(outside) // 'free variable'
  return
}

console.log(inside) // undefined

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

глобальная область

Глобальные области расположены за пределами блока кода { }, который доступен из всего кода.

локальная область

Локальные области расположены внутри блока кода { } и недоступны извне.

Пример глобальной и локальной области действия

const text = 'global scope'  
console.log(textTwo) // crash...undefined 
console.log(textOne) // crash...undefined

function outer () {
 const textOne = 'local block scope1'
 console.log(text) // 'global scope'
    
    function inner () {
     const textTwo = 'local block scope2' 
     console.log(textOne) // 'local block scope1'
     console.log(text) // 'global scope'
    }
}

лексическое окружение

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