Примеры ошибок js глобальные переменные. JavaScript. Переменные (глобальные, локальные, константы). Особенности глобальных объектов

Глобальные переменные в 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), ошибка при обращении

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

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

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

Var num = 5; function foo() { console.log(num); } foo(); // 5 console.log(num); // 5 { console.log(num); // 5 }

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

Переменная, объявленная внутри функции, называется локальной . Локальная переменная доступна в любом месте внутри тела функции, в которой она была объявлена. Локальная переменная создаётся каждый раз заново при вызове функции и уничтожается при выходе из неё (при завершении работы функции):

Function foo() { var num = 5; console.log(num); } foo(); // 5 console.log(typeof num); // undefined

Локальная переменная имеет преимущество перед глобальной переменной с тем же именем, это означает, что внутри функции будет использоваться локальная переменная, а не глобальная:

Var x = "глобальная"; // Глобальная переменная function checkscope() { var x = "локальная"; // Локальная переменная с тем же именем, что и у глобальной document.write(x); // Используется локальная переменная, а не глобальная } checkscope(); // => "локальная" Попробовать »

Блочные переменные

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

Let num = 0; { let num = 5; console.log(num); // 5 { let num = 10; console.log(num); // 10 } console.log(num); // 5 } console.log(num); // 0

Повторное объявление

Если с помощью ключевого слова var повторно объявить переменную с тем же именем (в той же области видимости), то ничего не произойдёт:

Var a = 10; var a; console.log(a); // 10

Если повторное объявление сопровождается инициализацией, то такая инструкция действует как обычное присваивание нового значения:

Var a = 10; var a = 5; // Тоже самое, что и a = 5; console.log(a); // 5

Если с помощью ключевого слова let повторно объявить переменную с тем же именем (в той же области видимости), то будет вызвана ошибка:

Var a = 10; let a; // Ошибка.

Цепочка областей видимости

Рассмотрим следующий пример:

Var num = 5; function foo() { var num2 = 10; function bar() { var num3 = 15; } }

В этом коде три области видимости: глобальная, область видимости функции foo() и область видимости функции bar() . В глобальной области видимости определены переменная num и функция foo() . В области видимости функции foo() определены переменная num2 и функция bar() , в ней также доступна переменная num из глобальной области видимости. Область видимости функции bar() содержит одну переменную num3 , которая доступна только внутри функции bar() . В области видимости функции bar() также доступны переменные из двух других областей, потому что они являются родительскими по отношению к ней. Цепочка областей видимости для этого примера представлена на рисунке ниже:

На рисунке разные области видимости показаны прямоугольниками разного цвета. Внутренней области видимости в цепочке областей видимости доступно всё из внешних областей, но внешним областям не доступно ничего из внутренних областей видимости.

Цепочка областей видимости упорядочена. Интерпретатор производит поиск идентификаторов в цепочке областей видимости по направлению наружу, но не внутрь. Это означает, что поиск имени начинается с той области видимости, где было выполнено обращение к идентификатору. Если имя идентификатора обнаруживается, поиск прекращается. Если в текущей области видимости найти имя не удалось, выполняется поиск в следующей (во внешней) области видимости и т. д. Таким образом, будет использован идентификатор из той области видимости, в которой был найден. Если идентификатор не будет найден ни в одной из областей видимости JavaScript сгенерирует ошибку:

Var str = "глобальная"; var num = 5; function foo() { var str = "локальная"; // Используется локальная переменная str num = 10; // Используется глобальная переменная num // alert(x); // Ошибка. Переменной x нет ни в одной области видимости } foo(); alert(str); // "глобальная" alert(num); // 10

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

Function foo() { num = 2; } foo(); // Создана новая глобальная переменная num alert(num); // 2

Подъём объявлений

В JavaScript объявленные переменные доступны в любом месте относительно своей области видимости, это означает, что переменные оказываются видимы ещё до того, как будут объявлены в коде. Эта особенность JavaScript неофициально называется подъёмом: программный код ведёт себя так, как если бы объявления переменных неявно поднимались (без инициализации) на самый верх относительно своей области видимости.

Рассмотрим следующий фрагмент кода:

Var str = "глобальная"; function foo() { alert(str); // undefined var str = "локальная"; alert(str); // "локальная" } foo();

Посмотрев на код, можно было бы подумать, что первый alert должен вывести строку "глобальная", потому что объявление локальной переменной str ещё не было выполнено. Однако, на деле выводится значение undefined . Благодаря подъёму объявлений функция выше эквивалентна реализации, приведённой ниже, в которой объявление переменной поднято в начало функции:

Function foo() { var str; // Объявление локальной переменной в начале функции alert(str); // Здесь она доступна, но не инициализирована str = "локальная"; // Здесь она инициализируется alert(str); // А здесь она имеет ожидаемое значение - "локальная" }

Тоже самое касается и глобальной области видимости, переменная объявленная снизу, доступна наверху:

Alert(num); // undefined var num = 10; alert(num); // 10

Переменные и константы в JavaScript. Объявление переменных и присвоение им значений. Переменные глобальные и локальные. Использование констант.

Объявление переменных в JavaScript

Имена переменных в JavaScript могут состоять из букв, цифр, знака $ и знака _, причем имя переменной не может начинаться с цифры. Имейте в виду, что JavaScript чувствителен к регистру букв, и переменные a1 и A1 - это разные переменные. Кириллицу использовать не рекомендуется, хотя это возможно.
Переменные в JavaScript объявляются ключевым словом var:

Var Peremennaya_1 var Peremennaya_2

Использовать переменные в JavaScript без объявления не рекомендуется. Это возможно, но может привести к ошибкам.

Присвоение значения переменным

Присвоение значения объявленным переменным в JavaScript:

Peremennaya_1 = 25 Peremennaya_2 = "Присваиваемый текст заключаем в прямые кавычки"

Можно присваивать значение переменным сразу при объявлении:

Var Peremennaya_1 = 25 var Peremennaya_2 = "Присваиваемый текст заключаем в прямые кавычки"

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

Переменные локальные и глобальные

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

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

Константы в JavaScript

Константы предназначены для упрощения работы с кодом, когда приходится использовать повторяющиеся значения или выражения. Достаточно однократно задать константе значение и можно сколько угодно его использовать, вставляя в код своих программ. В JavaScript нет ключевого слова для объявления констант, вместо констант используются обычные переменные. Чтобы константы отличались от переменных, их принято обозначать заглавными буквами, при необходимости используя знак подчеркивания:

Var DRUG_CHELOVEKA = "Собака"

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

В 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 будет применяться только для этой функции

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

Все это относится к самым начальным, базовым знаниям языка. Без понимания всего этого вы не сможете двигаться дальше и развивать свои навыки программирования в js. К тому же ключевые понятия вам пригодятся не только в данной специализации, а еще и вообще в IT-шной области. Ну что ж, приступим!

Что из себя представляет переменная и как она создается?

Переменная – это такой элемент языка программирования, под который выделяется область памяти и в которой хранятся некие значения.

Переменных может быть огромное количество и все они должны быть с уникальным именем.

Существует два вида переменных: глобальные и локальные. Их разница состоит только в различной области видимости переменных. Так, глобальные элементы видны на протяжении всего кода, а локальные – только в небольшой области, где были объявлены.

Кстати, старайтесь с самого первого дня, с первого вашего кода называть элементы логичными и понятными именами. Потому что далее, когда вы будете работать с увесистыми программами, спустя какой-то промежуток времени вы не вспомните, что означает, к примеру, «aa1» или «perem3».

А из названия абсолютно ничего не ясно! Тут еще полбеды, все-таки в своей писанине не так сложно разобраться. А что вы будете делать, если вам дадут задание закончить таски в другой программе, о который даже раньше не слышали? С такими названиями разбор программной реализации убьет уйму полезного времени.

Нотацию прочитал, теперь вернемся к объявлению переменных.

Чтобы создать переменную нужно вначале написать ключевое слово var , а после само имя. Вот так это выглядит:

var text = “Hello, user!”

После этого обращение к text происходит без «var»:

text = “New text.”

В этом случае значение перезапишется.

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

1 2 3 4

var text = “Hello, user!”; alert(text); // выведет “Hello, user!” text= “New text!”; alert(text); // выведет “New text!”

var text = “Hello, user!”; alert(text); // выведет “Hello, user!” text= “New text!”; alert(text); // выведет “New text!”

Особенности глобальных объектов

Все созданные объекты в js-коде делятся на глобальные и локальные. Выше я объяснил, в чем заключается разница между ними. А теперь подробнее разберем глобальные объекты.

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

var price = 145; // создаем глобальную переменную

alert (window.price); // ответ: 145

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

Подводные камни и область видимости

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

function test() { p = 2; return p; } alert(p); // undefined p = “важный текст”; alert(p); // выведет «важный текст» test(); // вызываем функцию alert(p); // выведет 2

Изначально в функции test я инициализировал локальную переменную со значением 2, а после создал глобальную текстовую переменную, хранящую в себе какие-то важные данные.

И вот тут выскакивает вот та «подводная глыба».

Во-первых, из-за того, что я воспользовался созданием элементов по правилам устаревшего стандарта JavaScript, все переменные “p” были созданы только в момент присвоения (при использовании директивы var переменные создаются сразу со значением undefined, а во время инициализации через «=» значение перезаписывается).

Во-вторых, в этом случае для присвоения значения неявно созданным элементам в js используется существующая или создается новая глобальная переменная. Поэтому в приведенном примере после вызова функции test значение глобальной «p» затерлось.

Во избежание «крушения» всегда используйте ключевое слово var. Тогда все объекты будут объявляться явно и создаваться новые.

Вот исправленный пример:

function test() { var p = 2; alert (p); return p; } alert(p); // undefined var p = "важный текст"; alert(p); // выведет «важный текст» test(); // вызываем функцию, в этом случае выведет 2 alert(p); // выведет «важный текст»

Вот теперь код отрабатывает верно. Как вы заметили, область видимости локальной «p» находится в пределах функции test, а глобальной – во всем остальном коде.

Несколько слов о константах

Как и во всех других языках программирования, в JavaScript есть константы. Для тех, кто не знает, что это такое, я прикреплю определение.

Константа – это вид переменной, значение которой неизменное.

По правилам синтаксиса в js их название всегда пишется строчными (большими) буквами. Например,

var MAIN_COLOR = “#fff”

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

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