Простое объяснение области действия JavaScript с использованием иллюстрации
Привет, меня зовут Мусуми Рой, ведущий консультант в фирме MNC.
Цель написания этой статьи - круто понять SCOPE.
Как это круто?
В этой статье я не написал ни одного фрагмента кода, но я его проиллюстрировал. Я считаю, что визуализация помогает людям запоминать вещи быстрее, чем запоминание кода.
Что такое объем?
Область видимости в JavaScript определяет, к каким переменным у вас есть доступ, т.е. область видимости управляет доступностью переменных.
В этой статье я расскажу
Глобальная область действия, Локальная область действия, Область действия блока, Вложенная область действия, Лексическая область действия с несколькими иллюстрациями
Глобальный охват:
Иногда интервьюеры могут попросить вас привести мне пример в реальном времени, где вы можете увидеть глобальный масштаб, тогда как в большинстве случаев люди не могут ответить. Нет проблем, теперь вы начнете мыслить нестандартно. Из приведенной выше иллюстрации вы можете видеть, что я нарисовал глаз, чтобы определить внутреннюю область видимости, а внешнюю область действия - это все, что является глобальным. Это означает, что ваши глаза могут видеть внешний мир, но внешний мир не может видеть, что находится внутри ваших глаз. Это все о Global Scope.
Локальный охват:
Здесь я проиллюстрировал папку сообщений Instagram для определения локальной области видимости. Вы можете увидеть эти сообщения только тогда, когда откроете Instagram, иначе вы не сможете увидеть и прочитать эти сообщения. Без входа в систему вы не сможете получить доступ к этим сообщениям. Эти сообщения доступны для чтения только в определенной части ваших приложений. И эта локальная область видимости создается внутри вашего приложения Instagram.
Область действия блока:
Что происходит в области видимости блока? В области видимости блока, если вы объявляете переменную с let или const внутри фигурных скобок {}, вы можете получить доступ к этим переменным только в фигурных скобках. Если вы попытаетесь получить доступ за пределами этих переменных, это вызовет ошибку.
Вложенная область:
На этой иллюстрации вы можете увидеть, как девушка смотрит Netflix на своем ноутбуке. Она смеется, когда смотрит комедию Ladies Up, но эти комики не видят ее. Nested Scope работает как одностороннее зеркало, где изнутри вы можете получить доступ к внешним переменным, но снаружи вы не можете сделать то же самое.
Лексический объем:
Lexical Scope очень интересен. Когда функция определена в другой функции, внутренняя функция имеет доступ к переменным внешних функций. Такое поведение называется лексической областью видимости. Пример в реальном времени: вы пошли в магазин и купили продукты. Здесь продукты - это переменные из внешней области видимости, и теперь вы используете эти продукты внутри дома, что находится во внутренней области действия.
На этом я заканчиваю писать. Я надеюсь, что это будет интересное чтение и изучение JavaScript Scope. Спасибо! Ваше здоровье!
