Переменные и константы в 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 нет ключевого слова для объявления констант, вместо констант используются обычные переменные. Чтобы константы отличались от переменных, их принято обозначать заглавными буквами, при необходимости используя знак подчеркивания:
Var DRUG_CHELOVEKA = "Собака"
Приведенный пример константы не совсем полноценный, так как слово «Собака» и так несложно запомнить и вставлять куда нужно. Использовать константы в JavaScript можно для записи и вставки более сложных значений, например, трудно запоминаемых кодов, наборов символов, длинного текста, веб-адресов, адресов электронной почты, телефонных номеров, различных коэффициентов.
В JavaScript константы можно перезаписывать, как переменные, но если это делать, тогда теряется смысл констант.
В 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 , существует две области видимости: локальная и глобальная. Зависит от того, где объявлена переменная, внутри функции или вне функции.
Если переменная объявлена внутри функции, то она называется локальной, если переменная объявлена вне функции, то она называется глобальной.
Современная концепция программирования, рекомендует чтобы все переменные в скриптах (программах) были локальными , а сама программа состояла лишь из функций, где каждая функция выполняла бы только одну задачу . Например в другом языке web-программирования PHP, вообще отказались от использования глобальных переменных.
Глобальные переменные объявляются вне функций и к ним можно обратиться (получить доступ) из любой функции или строки программы.
Var russia; russia = "Россия"; function getValueRussia() { alert(russia); } getValueRussia();
Здесь russia — это глобальная переменная, так как она объявлена вне функции. Чтобы доказать что переменная глобальная, мы обратились к ней изнутри пользовательской функции getValueRussia() , с помощью функции alert() которая вывела на экран значение переменной russia .
Локальные переменные в JavaScript, объявляются внутри функций. Получить доступ к локальным переменным можно только внутри той функции в которой они объявлены.
Function getValueRussia() { var russia; russia = "Россия"; } alert(russia);
В данном примере, ничего не произойдет (окошко с надписью «Россия» , не появится) , а если просмотреть скрипт через консоль, то он сообщит нам том что переменная russia — не определена (undefined), это означает что функция alert() (размещённая вне функции), не видит переменную russia , которую создали внутри функции.
Function getValueRussia() { var russia; russia = "Россия"; alert(russia); } getValueRussia();
Разместив функцию alert() внутри функции и затем вызвав функцию getValueRussia() , мы увидим окошко с надписью «Россия» . Данные примеры показывают нам, что к локальным переменным можно обращаться только внутри функции, в которой они созданы.
Здравствуйте! Сегодня у нас речь пойдет о области видимости переменных (что такое переменная читайте ). Дело в том, что когда вы создаете переменную в функции и ее имя совпадает с именем переменной вне функции, то вот тут могут быть различные интересные ситуации, связанные с глобальной и локальной областями видимости переменной.
Вот именно с этим мы с вами и будем разбираться в этом уроке.
К глобальным относятся все переменные, которые вы создаете вне функции. И обязательно надо создавать переменную через ключевое слово var, если этого не сделать то переменная будет видна везде в программе и более того при включенном режиме strict mode это вызовет ошибку. Для того чтобы включить режим strict mode достаточно в начале вашего сценария написать строку «use strict». Это будет указывать интерпретатору JavaScript, что надо строго соблюдать стандарт JavaScript. Вот пример с использованием глобальной переменной
Var a =6; //глобальная переменная function double() { return alert(a*a); //использование глобальной переменной } double();
В примере объявлена глобальная переменная а, которой присвоено значение 6. В функции мы можем получить доступ к этой переменной и даже более того изменить ее значение и это значение у нее изменится везде.
Давайте рассмотрим пример, где значение глобальной переменной меняются в функции, а потом мы обращаемся к глобальной переменной вне функции и видим то значение, которое ей было установлено в самой функции.
Var a =6; function double() { a = 5; //меняем значение глобальной переменной в функции return alert(a*a); } double(a); //вызываем функцию document.write(a); //значение глобальной переменной
Как можно видеть из примера если вы в функции меняете значение глобальной переменной оно уже у нее остается везде как в функции, так и вне ее.
Когда вы объявляете переменную в функции, то она становится локальной и к ней можно получить доступ только из функции. Стоит заметить, что операторы if/else , for, while, do…while не влияют на область видимость переменных.
Итак получается, что в функции можно получить доступ к глобальной переменной, а глобально вне функции нельзя получить доступ к локальной переменной, созданной в теле функции. Рассмотрим пример.
Function double() { var a =6; return alert(a*a); } double(); document.write(a); //пытаемся обратиться к локальной переменной
В примере глобально переменная не объявляется, а объявляется в функции, то есть локально. Затем вызываем функцию и пытаемся обратится к локальной переменной в результате ничего не получается, а в консоли видим ошибку, что переменная не определена.
И последний вариант это когда создается и глобальная переменная и локальная с одинаковым именем, что будет тогда. Давайте смотреть пример.
Var a =7; function double() { var a =6; return alert(a*a); } document.write(a);
Как видите здесь в функции создается как бы другая переменная несмотря на то, что ее имя совпадает с глобальной и в функции будет доступна именно локальная переменная она не сможет перезаписать глобальную, что и показывает этот пример.
Какой можно сделать из всего этого вывод. Это что нало стараться использовать и в функции и вне функции переменные с разными именами. Но знать про локальную и глобальную области видимости надо.
Переменная созданная вне функции является глобальной.
Из функции можно получить доступ к глобальной переменной и изменить ее значение.
Все глобальные переменные и функции на самом деле являются свойствами и методами специального объекта, который называется глобальным объектом .
Глобальный объект представляет собою обычный объект, который создаётся автоматически при запуске интерпретатора.
В JavaScript роль глобального объекта играет объект Window. Этот объект имеет свойство window, ссылающееся на сам объект Window. Объект Window одновременно является и глобальным объектом и помимо этого содержит ряд собственных свойств и методов для работы с окном браузера.
В программном коде верхнего уровня сослаться на глобальный объект можно также посредством ключевого слова this:
Alert(this === window); // true
Поскольку глобальные переменные являются свойствами глобального объекта то, работая с глобальной переменной, на самом деле, мы, работаем со свойствами window:
Var num = 10; alert(window.num); // 10
Вместо объявления переменной с помощью ключевого слова var, создать переменную можно и явно указав новое свойства объекту Window:
Window.num = 10; alert(num); // 10
Обратите внимание, что несмотря на то, что глобальные переменные на самом деле являются свойствами объекта Window, указывать его перед именем переменной необязательно:
Var num = 10; alert(num); // 10 alert(window.num); // 10. Тоже самое, что и alert(num);
Если глобальная переменная объявляется с помощью ключевого слова var или let , создаётся ненастраиваемое свойство, т. е. свойство, которое невозможно удалить с помощью оператора delete:
Var num = 10; alert(delete num); // false, переменная не удалена
Если необъявленной переменной присвоить некоторое значение, интерпретатор JavaScript автоматически создаст глобальную переменную. Переменные созданные таким способом, становятся обычными, настраиваемыми свойствами глобального объекта, т. е. могут быть удалены с помощью оператора delete:
Num = 10; alert(delete num); // true, переменная удалена
| Метод | Описание |
|---|---|
| decodeURI() | Возвращает строку, содержащую URI в декодированном виде. |
| decodeURIComponent() | Возвращает строку, содержащую часть URI в декодированном виде. |
| encodeURI() | Возвращает строку, содержащую URI в закодированном виде. |
| encodeURIComponent() | Возвращает строку, содержащую часть URI в закодированном виде. |
| eval() | Функция eval() выполняет код, переданный ей в виде строки. Код, переданный функции, выполняется в той области видимости, где была вызвана функция. |
| isFinite() | Преобразует аргумент в число (если это необходимо) и возвращает true, если аргумент содержит любое значение отличное от NaN, положительной и отрицательной бесконечности. В этих трех случаях возвращает false. |
| isNaN() | Определяет является передаваемый аргумент значением NaN или нет. |
| parseFloat() | Анализирует строковый аргумент и возвращает число с плавающей точкой или NaN. |
| parseInt() | Анализирует строковый аргумент и возвращает целое число или NaN. |
