Учебник по JS

ГЛАВНАЯ JS Введение JS Куда Вывод JS Заявления JS JS-синтаксис JS-комментарии JS-переменные JS Пусть Константа JS JS-операторы JS-арифметика Назначение JS JS-типы данных JS-функции JS-объекты JS-события JS-строки Строковые методы JS Поиск строки JS Шаблоны строк JS JS-номера Методы номеров JS JS-массивы Методы массива JS Сортировка массива JS Итерация массива JS Константа массива JS JS-даты Форматы даты JS Методы получения даты JS Методы установки даты JS JS-математика JS Случайный JS Булевы значения Сравнение JS JS-условия JS-переключатель JS цикл для Цикл JS для входа Цикл JS для Цикл JS во время Перерыв JS JS-итерации JS-наборы JS-карты JS Typeof Преобразование типов JS JS побитовый JS регулярное выражение JS-ошибки Область JS JS-подъем Строгий режим JS JS это ключевое слово Функция стрелки JS JS-классы JS JSON JS-отладка Руководство по стилю JS Лучшие практики JS JS-ошибки JS-производительность Зарезервированные слова JS

JS-версии

JS-версии JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE/пограничный История JS

JS-объекты

Определения объектов Свойства объекта Методы объекта Отображение объекта Средства доступа к объектам Конструкторы объектов Прототипы объектов Итерации объектов Наборы объектов Карты объектов Ссылка на объект

JS-функции

Определения функций Параметры функции Вызов функции Вызов функции Функция Применить Закрытие функций

JS-классы

Введение в класс Наследование классов Статический класс

JS асинхронный

Обратные вызовы JS JS асинхронный JS-обещания JS асинхронный/ожидание

JS HTML DOM

Дом Введение DOM-методы Документ DOM DOM-элементы DOM HTML DOM-формы ДОМ CSS DOM-анимации События ДОМ Слушатель событий DOM DOM-навигация DOM-узлы Коллекции DOM Списки узлов DOM

Спецификация браузера JS

JS-окно JS-экран Местоположение JS История JS JS-навигатор Всплывающее оповещение JS JS Тайминг JS-куки

JS-веб-API

Введение в веб-API API веб-форм API истории веб-поиска API веб-хранилища API веб-работника API веб-выборки API веб-геолокации

JS АЯКС

Введение в АЯКС AJAX XMLHttp АЯКС-запрос AJAX-ответ XML-файл AJAX АЯКС PHP АЯКС АСП База данных AJAX AJAX-приложения Примеры AJAX

JS JSON

Введение в JSON Синтаксис JSON JSON против XML Типы данных JSON Анализ JSON Строковая JSON JSON-объекты JSON-массивы JSON-сервер JSON PHP JSON HTML JSON JSONP

JS против JQuery

Селекторы jQuery JQuery HTML jQuery CSS JQuery DOM

JS-графика

JS-графика JS Холст JS сюжет JS Chart.js JS Google Диаграмма JS D3.js

JS-примеры

JS-примеры JS HTML DOM JS HTML-ввод HTML-объекты JS HTML-события JS JS-браузер JS-редактор JS-упражнения JS-викторина JS-сертификат

JS-ссылки

Объекты JavaScript HTML DOM-объекты


Область действия JavaScript

Область видимости определяет доступность (видимость) переменных.

JavaScript имеет 3 типа области видимости:

  • Область блока
  • Объем функций
  • Глобальный охват

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

До ES6 (2015) у JavaScript были только Global Scope и Function Scope .

ES6 представил два важных новых ключевых слова JavaScript: letи const.

Эти два ключевых слова обеспечивают область действия блока в JavaScript.

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

Пример

{
  let x = 2;
}
// x can NOT be used here

Переменные, объявленные с помощью varключевого слова, НЕ могут иметь область действия блока.

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

Пример

{
  var x = 2;
}
// x CAN be used here

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

Переменные, объявленные в функции JavaScript, становятся ЛОКАЛЬНЫМИ для этой функции.

Пример

// code here can NOT use carName

function myFunction() {
  let carName = "Volvo";
  // code here CAN use carName
}

// code here can NOT use carName

Локальные переменные имеют область действия :

Доступ к ним возможен только из самой функции.

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

Локальные переменные создаются при запуске функции и удаляются по завершении функции.


Объем функций

В JavaScript есть область видимости функции: каждая функция создает новую область видимости.

Переменные, определенные внутри функции, недоступны (видимы) снаружи функции.

Переменные, объявленные с помощью var, let и constочень похожи при объявлении внутри функции.

Все они имеют область действия :

function myFunction() {
  var carName = "Volvo";   // Function Scope
}
function myFunction() {
  let carName = "Volvo";   // Function Scope
}
function myFunction() {
  const carName = "Volvo";   // Function Scope
}

Глобальные переменные JavaScript

Переменная, объявленная вне функции, становится GLOBAL .

Пример

let carName = "Volvo";
// code here can use carName

function myFunction() {
// code here can also use carName
}

Глобальная переменная имеет глобальную область видимости :

Все сценарии и функции на веб-странице могут получить к ней доступ. 


Глобальный масштаб

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

Доступ к глобальным переменным можно получить из любого места в программе JavaScript.

Переменные, объявленные с помощью var, let и constочень похожи при объявлении вне блока.

Все они имеют глобальную область видимости :

var x = 2;       // Global scope
let x = 2;       // Global scope
const x = 2;       // Global scope

Переменные JavaScript

В JavaScript объекты и функции также являются переменными.

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



Автоматически глобальный

Если вы присвоите значение переменной, которая не была объявлена, она автоматически станет ГЛОБАЛЬНОЙ переменной.

В этом примере кода будет объявлена ​​глобальная переменная carName, даже если значение присваивается внутри функции.

Пример

myFunction();

// code here can use carName

function myFunction() {
  carName = "Volvo";
}

Строгий режим

Все современные браузеры поддерживают запуск JavaScript в строгом режиме.

Вы узнаете больше о том, как использовать строгий режим, в следующей главе этого руководства.

В «строгом режиме» необъявленные переменные автоматически не становятся глобальными.


Глобальные переменные в HTML

В JavaScript глобальная область видимости — это среда JavaScript.

В HTML глобальная область видимости — это объект окна.

Глобальные переменные, определенные с помощью varключевого слова, принадлежат объекту окна:

Пример

var carName = "Volvo";
// code here can use window.carName

Глобальные переменные, определенные с помощью letключевого слова, не принадлежат объекту окна:

Пример

let carName = "Volvo";
// code here can not use window.carName

Предупреждение

НЕ создавайте глобальные переменные, если вы не собираетесь это делать.

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


Время жизни переменных JavaScript

Время жизни переменной JavaScript начинается с момента ее объявления.

Функциональные (локальные) переменные удаляются, когда функция завершена.

В веб-браузере глобальные переменные удаляются при закрытии окна браузера (или вкладки).


Аргументы функции

Аргументы функций (параметры) работают как локальные переменные внутри функций.