Js jquery как сделать переменную var глобальной. Область видимости переменных функции в JavaScript - Глобальные и локальные переменные. Минимизация использования глобальных переменных


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

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

Что такое глобальные переменные? Рассмотрим пример...

var global = 21 ; /* Создаем Глобальную переменную */

function myFun () /* Создаем функцию, которая выводит на экран переменную */
{
document.write (global );
}

myFun (); /* Вызываем функцию */

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

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

Что такое локальные переменные? И снова рассмотрим пример...

function myFun _2 () /* Создаем функцию */
{

var local = 42 ;
document.write (local );
}

myFun _2(); /* Вызываем функцию */

Этот пример иллюстрирует создание локальной переменной local . Она локальная, так как создана внутри функции . И только внутри нее может использоваться.

Если эту переменную попробовать вывести за пределами функции, то в окне браузера мы ничего не увидим.

function myFun _2 () /* Создаем функцию */
{

var local = 42 ; /* Создаем Локальную переменную */
document.write (local );
}

document.write (local ); /* Пробуем вывести Локальную переменную за пределами функции */

На этих простых примерах мы рассмотрели понятие область видимости переменных в JavaScript . Еще раз озвучим его суть: если мы создаем переменную внутри какой-либо функции, то она является локальной, и работать с ней мы сможем только внутри этой функции.

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

Последнее обновление: 05.04.2018

Все переменные в JavaScript имеют определенную область видимости, в пределах которой они могут действовать.

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

Все переменные, которые объявлены вне функций, являются глобальными:

var x = 5; let d = 8; function displaySquare(){ var z = x * x; console.log(z); }

Здесь переменные x и d являются глобальными. Они доступны из любого места программы.

А вот переменная z глобальной не является, так как она определена внутри функции.

Локальные переменные

Переменная, определенная внутри функции, является локальной:

Function displaySquare(){ var z = 10; console.log(z); let b = 8; console.log(b); }

Переменные z и b являются локальными, они существуют только в пределах функции. Вне функции их нельзя использовать:

Function displaySquare(){ var z = 10; console.log(z); } console.log(z); //ошибка, так как z не определена

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

Сокрытие переменных

Что если у нас есть две переменных - одна глобальная, а другая локальная, которые имеют одинаковое имя:

Var z = 89; function displaySquare(){ var z = 10; console.log(z); // 10 } displaySquare(); // 10

В этом случае в функции будет использоваться та переменная z, которая определена непосредственно в функции. То есть локальная переменная скроет глобальную.

var или let

При использовании оператора let каждый блок кода определяет новую область видимости, в которой существует переменная. Например, мы можем одновременно определить переменную на уровне блока и на уровне функции:

Let z = 10; function displayZ(){ let z = 20; { let z = 30; console.log("Block:", z); } console.log("Function:", z); } displayZ(); console.log("Global:", z);

Здесь внутри функции displayZ определен блок кода, в котором определена переменная z. Она скрывает глобальную переменную и переменную z, определенную на уровне функции. В реальной программе блок мог быть предеставлять вложенную функцию, блок цикла for или конструкции if. Но в любом случае такой блок определяет новую область видимости, вне которого переменная не существует.

И в данном случае мы получим следующий консольный вывод:

Block: 30 Function: 20 Global: 10

С помощью оператора var мы не можем определить одновременно переменную с одним и тем же именем и в функции, и в блоке кода в этой функции:

Function displaySquare(){ var z = 20; { var z = 30; // Ошибка! Переменная z уже определена console.log("Block:", z); } console.log("Function:", z); }

То есть с помощью var мы можем определить переменную с одним именем либо на уровне функции, либо на уровне блока кода.

Константы

Все, что относится к оператору let, относится и к оператору const, который позволяет определить константы. Блоки кода задают область видимости констант, а константы, определенные на вложенных блоках кода, скрывают внешние константы с тем же именем:

Const z = 10; function displayZ(){ const z = 20; { const z = 30; console.log("Block:", z); // 30 } console.log("Function:", z); // 20 } displayZ(); console.log("Global:", z); // 10

Необъявленные переменные

Если мы не используем это ключевое слово при определении переменной в функции, то такая переменная будет глобальной. Например:

Function bar(){ foo = "25"; } bar(); console.log(foo); // 25

Несмотря на то, что вне функции bar переменная foo нигде не определяется, тем не менее она доступна вне функции во внешнем контексте.

Иначе было бы если бы мы не только присваивали значение переменной, но и определяли бы ее:

Function bar(){ var foo = "25"; } bar(); console.log(foo); // ошибка

strict mode

Определение глобальных переменных в функциях может вести к потенциальным ошибкам. Чтобы их избежать используется строгий режим или strict mode:

"use strict"; function bar(){ foo = "25"; } bar(); console.log(foo);

В этом случае мы получим ошибку SyntaxError: Unexpected identifier , которая говорит о том, что переменная foo не определена.

Установить режим strict mode можно двумя способами:

    добавить выражение "use strict" в начало кода JavaScript, тогда strict mode будет применяться для всего кода

    добавить выражение "use strict" в начало тела функции, тогда strict mode будет применяться только для этой функции

Переменные служат "контейнерами" для хранения информации.

Вы Помните Школьную Алгебру?

Вы помните школьную алгебру? x=5, y=6, z=x+y

Вы помните, что буква (например x) могла бы использоваться для хранения значения (например 5), и что вы могли бы использовать информацию выше, чтобы вычислить, что значение z равно 11?

Эти буквы называются переменными , и переменные могут использоваться для хранения значений (x=5) или выражений (z=x+y).

Переменные JavaScript

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

Переменная может иметь короткое имя, например x, или более информативное имя, например carname (название автомобиля).

Правила для имен переменных JavaScript:

  • Имена переменных чувствительны к регистру (y и Y это две разных переменных)
  • Имена переменных должны начинаться с буквы или символа подчеркивания

Замечание: Поскольку JavaScript чувствителен к регистру, имена переменных также чувствительны к регистру.

Пример

Значение переменной может изменяться во время выполнения скрипта. Вы можете ссылаться на переменную по ее имени для отображения или изменения ее значения.

Объявление (Создание) Переменных JavaScript

Создание переменных в JavaScript более часто называют "объявлением" переменных.

Вы объявляете переменные JavaScript с помощью ключевого слова var :

После выполнения предложений выше, переменная x будет содержать значение 5 , и carname будет содержать значение Мерседес .

Замечание: Когда вы присваиваете текстовое значение переменной, заключайте его в кавычки.

Замечание: Если вы объявляете переменную повторно, она не потеряет свое значение.

Локальные Переменные JavaScript

Переменная, объявленная внутри функции JavaScript становится ЛОКАЛЬНОЙ и будет доступна только в пределах этой функции. (переменная имеет локальную область видимости).

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

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

Вы узнаете больше о функциях в последующих уроках JavaScript.

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

Переменные объявленные вне функции становятся ГЛОБАЛЬНЫМИ , и все скрипты и функции на странице могут к ним обращаться.

Глобальные переменные уничтожаются когда вы закрываете страницу.

Если вы объявляете переменную, не используя "var", переменная всегда становится ГЛОБАЛЬНОЙ .

Присваивание Значений Необъявленным Переменным JavaScript

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

Эти предложения:

Вы узнаете больше об операторах в следующем уроке JavaScript.

В JavaScript , существует две области видимости: локальная и глобальная. Зависит от того, где объявлена переменная, внутри функции или вне функции.

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

Современная концепция программирования, рекомендует чтобы все переменные в скриптах (программах) были локальными , а сама программа состояла лишь из функций, где каждая функция выполняла бы только одну задачу . Например в другом языке web-программирования PHP, вообще отказались от использования глобальных переменных.

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

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

Var russia; russia = "Россия"; function getValueRussia() { alert(russia); } getValueRussia();

Здесь russia — это глобальная переменная, так как она объявлена вне функции. Чтобы доказать что переменная глобальная, мы обратились к ней изнутри пользовательской функции getValueRussia() , с помощью функции alert() которая вывела на экран значение переменной russia .

Локальные переменные в JavaScript

Локальные переменные в JavaScript, объявляются внутри функций. Получить доступ к локальным переменным можно только внутри той функции в которой они объявлены.

Function getValueRussia() { var russia; russia = "Россия"; } alert(russia);

В данном примере, ничего не произойдет (окошко с надписью «Россия» , не появится) , а если просмотреть скрипт через консоль, то он сообщит нам том что переменная russia — не определена (undefined), это означает что функция alert() (размещённая вне функции), не видит переменную russia , которую создали внутри функции.

Function getValueRussia() { var russia; russia = "Россия"; alert(russia); } getValueRussia();

Разместив функцию alert() внутри функции и затем вызвав функцию getValueRussia() , мы увидим окошко с надписью «Россия» . Данные примеры показывают нам, что к локальным переменным можно обращаться только внутри функции, в которой они созданы.

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

Что есть глобальные переменные: переменные "видимые" в любой точке выполнения программы, везде из можно прочитать и перезаписать.
Обычно глобальные переменные определяются в самом начале программы, вне всяких блоков ({})
в случае Js, они задаются после script, или все всяких функций

hello = "Hello"; //задаем глобальную переменную и проверяем ее
document.writeln("->1 "+ hello +" every one
");//->1 Hello every one

If(true)
//if(false)
{
var hello = "Hello Dolly and "; //это тоже глобальная
world = "world"; //глобальная
var cont = ", we continue" //глобальная
document.writeln("->1.2 " + hello + world + cont+"
");
//1.
}
document.writeln("->2 " + hello + world + cont+"
");
//->2 Hello Dolly and world, we continue

При условии true мы получаем ответ

->1 Hello every one
->1.2 Hello Dolly and world, we continue
->2 Hello Dolly and world, we continue

Выполнение обрывается

Таким образом, получается, что на глобальную область использование var никак не влияет. Переменная, упомянутая в script вне процедур считается глобальной даже, если она заключения в скобочки {} блока if while for и других области останется глобальной даже внутри циклов

Выводы, кратко

* для переменных используемых в зоне глобальной видимости не важно наличие var.
* Блоки после if while for не создают локальной зоны видимости, (как это происходит в других языках)

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

Boy = "Jhone";
did = "kills Kenny"; //итак мы имеем 2 глобальных переменных
function doit()
{
//уже прошла печать --1, и мы меняем данные меняем данные
var boy = "Gary"; //создаем локаль
did = "helps Anny"; //изменяем глобаль
;
document.writeln("--2 " + boy + " " + did + "
");
//--2 Gary helps Anny
;
//теперь внутри функции зададим локальную и глобальные переменные
var good = "he was a good boy
";//локаль!
bad = "he likes a bad girls
";//глобаль
}
;
document.writeln("--1 " + boy + " " + did + "
");
//--1 Jhone kills Kenny
doit();
//--2 Gary helps Anny
document.writeln("--3 " + boy + " " + did + "
");
//--3 Jhone helps Anny
;
if(!true)
//if(!false)
{
document.writeln("--4 " + good);
//выполнение этого блока вызовет ошибку.
//мы сейчас находимся вне локальной области видимости
//функции doit(), поэтому для нас заданной через var
//переменной good просто не существует
}
document.writeln("--5 " + bad);
//--5 he likes a bad girls

Результат:

1 Jhone kills Kenny
--2 Gary helps Anny
--3 Jhone helps Anny
--5 he likes a bad girls

Локальные переменные в javascript

* var работает внутри функции, объявляя локальную переменную. Это основная его задача

* Яваскрип сильно отличается от си уже тем что только(?) внутри функции возможны локальные переменные.
* использование var или не использование в глобальной области видимости зависит только от вашего личного опыта. Но по мне так лучше не ленится. в перле это называется use strict

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

Важно. Во-первых, “вары” нельзя удалить (с помощью delete). Во-вторых, их конкретизация происходит на “нулевой строке” (до начала работы “построчно”), где им сразу же присваивается значение undefined, и только потом переменная может получить (а может не получить) новое значение:

Var glb_1 = 1;
if (false) {var glb_2 = 2; glb_3 = 3;}

Alert(glb_1) // конкретизирована и получила значение 1
alert(glb_2) // конкретизировна и получила значение ‘undefined’
alert(glb_3) // вообще не переменная (нет var), ошибка при обращении