Переменные в JavaScript необходимы для хранения и обработки данных. Важно понимать, где эти переменные действительны и к каким областям вашего кода они могут обращаться. Учитывая различные типы переменных - глобальные и локальные - понимание "области действия" (области видимости) является основополагающим. Так что давайте погрузимся внутрь и узнаем, что такое глобальные и локальные переменные.
Основные выводы
- Глобальные переменные доступны везде в коде, в то время как локальные переменные видны только в пределах своей функции.
- Определение переменной вне функции делает ее глобальной, а определение внутри функции - локальной.
- Чтобы структура кода была понятной и удобной, лучше всего объявлять глобальные переменные в начале скрипта.
Пошаговые инструкции
Определение переменных и их видимость
На первом этапе мы рассмотрим, как можно создать переменную и что означает ее видимость. Если вы объявляете переменную вне какой-либо функции, как показано в следующем примере, она является глобальной.

Здесь мы создаем глобальную переменную под названием myVariable.
Создание функций с локальными переменными
Далее мы создадим две функции. Одну функцию мы назовем localFunction, в которой создадим локальную переменную. Эта переменная видна только внутри функции. Давайте определим нашу функцию.
В localFunction создадим локальную переменную localV со значением 5 и выведем ее.
Вызов функций
Теперь мы хотим вызвать функцию localFunction для вывода числа 5. После вызова функции в коде вывод выглядит следующим образом:
Проверка видимости локальной переменной
Теперь мы попытаемся использовать локальную переменную localV в другой функции. Вы заметите, что это не сработает. Давайте сделаем вызов otherFunction и посмотрим, что произойдет.
Мы получим ошибку, потому что переменная localV видна только в localFunction.
Проверка ошибок в консоли
Чтобы лучше понять, почему возникает ошибка, давайте проверим код в консоли. Щелкнув правой кнопкой мыши и выбрав "Examine", вы можете открыть проводник DOM и консоль, чтобы проанализировать ошибку.

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

Теперь эту глобальную переменную можно вызывать в обеих функциях, и результат будет одинаковым. Давайте проверим это один раз.

Определение переменной и порядок вызова
Важно отметить, что порядок определения переменных и функций имеет решающее значение. Если вы создадите глобальную переменную позже ее использования, это приведет к проблеме неопределенности.
Это произойдет потому, что функция, которой нужна глобальная переменная, вызовет ее раньше, чем ее определение. Чтобы избежать этого, рекомендуется определять глобальные переменные в верхней части кода.
Подробнее о локальных переменных и их использовании
Теперь мы создадим еще одну локальную переменную в другой функции. Здесь мы назовем ее localVariable и установим ее значение 12.
Мы также можем использовать эту локальную переменную, но только внутри своей функции, а не в других. Если вы используете обе локальные переменные, это может обеспечить терпение и порядок в ваших программах, в зависимости от их сложности.
Обобщение понятий
Теперь вы понимаете основные понятия о видимости и области видимости переменных в JavaScript. Глобальные переменные видны всем функциям, в то время как локальные переменные существуют только в пределах своей функции. Рекомендуется определять глобальные переменные в центральном месте кода для улучшения читабельности и удобства сопровождения.
Резюме - видимость переменных в JavaScript
Подводя итог, вы узнали, что способ определения переменных напрямую влияет на их видимость и область применения. Всегда обращайте внимание на то, где вы размещаете свои переменные, чтобы избежать ошибок.
Часто задаваемые вопросы
Что такое глобальные переменные?Глобальные переменные - это переменные, которые объявляются вне функций и поэтому доступны во всем скрипте.
Что такое локальные переменные?Локальные переменные - это переменные, которые создаются внутри функции и видны только в этой функции.
Как лучше использовать глобальные переменные?Рекомендуется определять глобальные переменные в начале сценария, чтобы обеспечить четкую структуру и лучшую сопровождаемость.
Могу ли я использовать локальные переменные вне их функции?Нет, локальные переменные видны только в пределах функции, в которой они были определены.
Как бороться с ошибками неопределенности?Обратите внимание на порядок определения переменных и функций, чтобы убедиться, что необходимые переменные определены до их использования.