Что такое область видимости JavaScript

1️⃣ Как кратко ответить

Область видимости в JavaScript определяет доступность переменных и функций в различных частях кода. Существует три основных типа области видимости: глобальная, функциональная и блочная. Глобальная область видимости доступна везде, функциональная ограничена функцией, а блочная — блоком кода, например, в условных операторах или циклах.

2️⃣ Подробное объяснение темы

Область видимости в JavaScript — это концепция, которая определяет, где в коде можно использовать переменные и функции. Понимание области видимости важно для управления доступом к данным и предотвращения конфликтов имен переменных.

Глобальная область видимости

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

var globalVar = 'I am global';
​
function showGlobalVar() {
  console.log(globalVar); // 'I am global'
}
​
showGlobalVar();
console.log(globalVar); // 'I am global'

• var globalVar = 'I am global';: Переменная globalVar объявлена в глобальной области видимости, поэтому она доступна как внутри функции showGlobalVar, так и вне её.

Функциональная область видимости

Переменные, объявленные внутри функции, доступны только внутри этой функции. Это называется функциональной областью видимости.

function myFunction() {
  var functionVar = 'I am local to myFunction';
  console.log(functionVar); // 'I am local to myFunction'
}
​
myFunction();
console.log(functionVar); // Ошибка: functionVar is not defined

• var functionVar = 'I am local to myFunction';: Переменная functionVar объявлена внутри функции myFunction, поэтому она доступна только внутри этой функции. Попытка доступа к ней вне функции вызывает ошибку.

Блочная область видимости

С введением let и const в ES6, JavaScript поддерживает блочную область видимости. Переменные, объявленные с помощью let или const внутри блока (например, в цикле или условии), доступны только внутри этого блока.

if (true) {
  let blockVar = 'I am block-scoped';
  console.log(blockVar); // 'I am block-scoped'
}
​
console.log(blockVar); // Ошибка: blockVar is not defined

• let blockVar = 'I am block-scoped';: Переменная blockVar объявлена внутри блока if, поэтому она доступна только внутри этого блока. Попытка доступа к ней вне блока вызывает ошибку.

Зачем это нужно

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