Константы в JavaScript


Содержание материала:

Переменные в JavaScript

Переменная — это поименованная область памяти, хранящая данные. Как и в любом языке программирования, переменные JavaScript похожи на контейнера. Этим контейнерам можно присваивать имена и впоследствии использовать их для извлечения и изменения хранимых данных.

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

Прежде чем использовать переменную в JavaScript, ее необходимо объявить. Для объявления или, другими словами, создания переменной используется ключевое слово var (от variable — переменная):

Переменной, объявляемой с помощью ключевого слова var , можно присвоить начальное значение (это называется инициализацией переменной):

Значение переменной сохраняется в соответствующей области памяти и в дальнейшем доступ к нему осуществляется при обращении по имени. Если же переменную не инициализировать, то ее начальное значение остается неопределенным undefined :

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

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

Значение в переменной можно изменять сколько угодно раз:

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

Когда одна переменная с примитивным значением присваивается другой, создается копия значения, хранящегося в ячейке памяти, а затем она записы­вается по адресу другой переменной, например:

Здесь msg1 содержит строковое значение «Строка». Когда переменная msg2 инициализируется значе­нием переменной msg1 , она также получает значение «Строка». ТОеперь переменная msg2 никак не связана с msg1 , потому что содержит копию значения.
В дальнейшем эти переменные можно использовать по отдель­ности без побочных эффектов для скрипта.

Имена переменных

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

  • буква в верхнем или нижнем регистре;
  • символ подчеркивания _ ;
  • знак доллара $ .

Вслед за первым символом имени переменной можно использовать последовательность букв, цифр и символа подчеркивания без пробелов и знаков препинания. Поскольку JavaScript чувствителен к регистру, буквы включают символы от «A» до «Z» (верхний регистр) и символы от «a» до «z» (нижний регистр). Вы можете использовать буквы ISO 8859-1 или Unicode, например, å или ü.

Примеры правильных имен переменных:

Примеры неправильных имен переменных:

При выборе имен переменных нельзя использовать ключевые слова, то есть слова, используемые в определениях конструкций языка. Например, нельзя выбирать слова var , return , class , const , true , false , function , super , switch и ряд других.

Например, следующий сценарий выдаст синтаксическую ошибку:

Имя переменной должно быть понятным и максимально чётко соответствовать хранимым в ней данным.

Существуют проверенные опытом правила именования перемененных:

  • Имена, состоящие из одной буквы, равно как и имена, не несущие смысловой нагрузки можно применять только в том случае, если они используются в небольшом фрагменте кода и их применение очевидно.
  • Используйте составные имена из нескольких слов, чтобы как можно точнее описать назначение переменных.
    Возможны два способа объединения слов для создания имени: использование «верблюжьей нотации» (англ. camelCase) или запись слов через символ подчеркивания. Обычно применяют первый из них.
  • При выборе имен применяйте только английский язык, т.к. среди разработчиков всего мира принято использовать английский язык для имён переменных.

Область видимости переменной

Как и в других языках программирования, в JavaScript существуют локальные и глобальные переменные. Ключевую роль здесь играет понятие области видимости переменной. Область видимости (scope) переменной — это та часть программы, для которой эта переменная определена.

В JavaScript существует два типа области видимости:

  • Глобальные переменные имеют глобальную область видимости – они могут использоваться в любом месте программы, а также в вызываемых программах из других файлов.
  • Локальные переменные имеют локальную область видимости — это переменные, определенные только в коде функции с помощью ключевого слова var либо только в рамках блока <. >, в котором объявлена переменная с помощью ключевого слова let .

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

Ключевое слово const

В редакции ES2015 были добавлены два новых важных ключевых слова JavaScript — let и const.

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

Область видимости внутри блока

Относительно области видимости внутри блока поведение переменных, декларированных при помощи ключевого слова const, похоже на поведение переменных, декларированных при помощи ключевого слова let.

В следующем примере переменная x, декларированная внутри блока, не то же самое, что переменная x, декларированная вне этого блока:

Подробнее об области видимости внутри блока см. главу Ключевое слово let.

Присваивание во время декларации

Значения для JavaScript переменных с ключевым словом const должны присваиваться во время декларации:

Не настоящие константы

Ключевое слово const может вводить в заблуждение.

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

В связи с этим мы не можем изменять примитивные константные значения, но можем изменять свойства константных объектов.

Примитивные значения

Если мы присваиваем константе примитивное значение, то впоследствии мы не можем его изменить:

Константные объекты можно изменять

Свойства константных объектов можно изменять:

Но вы НЕ МОЖЕТЕ присвоить константному объекту новое значение:

Константные массивы можно изменять

Элементы константного массива можно изменять:

Но вы НЕ МОЖЕТЕ переприсвоить константный массив:

Передекларирование

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

Нельзя передекларировать или переприсвоить существующую переменную, декларированную при помощи ключевого слова var или let, с ключевым словом const в той же области видимости или в том же блоке:

Нельзя передекларировать или переприсвоить существующую переменную, декларированную при помощи ключевого слова const, в той же области видимости или в том же блоке:

Передекларировать переменную с ключевым словом const в другой области видимости или в другом блоке можно:

Поднятие

Переменные, декларированные при помощи ключевого слова var, «поднимаются» в верх JavaScript кода (если вы не знаете, что такое «поднятие» в JavaScript, то см. главу Поднятие переменных в Javascript).

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

Переменные, декларированные при помощи ключевого слова const, не «поднимаются» в верх JavaScript кода.

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

Существуют ли константы в JavaScript?

Есть ли способ использовать константы в JavaScript?

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

ES2015, последняя версия JavaScript, имеет понятие const :

Это будет работать в почти во всех браузерах, кроме IE 8, 9 и 10. Некоторым может также понадобиться строгий режим.

Вы можете использовать соглашения, такие как ALL_CAPS, чтобы показать, что определенные значения не должны быть изменены, если вы не пишете код ES2015:

Вы пытаетесь защитить переменные от модификации? Если это так, то вы можете использовать шаблон модуля:

Используя этот подход, значения не могут быть изменены. Но вы должны использовать метод get() для CONFIG: (.

Если вам не нужно строго защищать значение переменных, тогда просто сделайте так, как было предложено, и используйте соглашение ALL CAPS.

Ключевое слово const находится в проекте ECMAScript 6, но до сих пор оно только немного смахивает на поддержку браузера: http://kangax.github.io/compat-table/es6/. Синтаксис:

IE поддерживает константы, вроде, например:

См. Object.freeze. Вы можете использовать const , если хотите сделать ссылку constants только для чтения.

Нет, не в общем. Firefox реализует const , но я знаю, что IE этого не делает.

@John указывает на обычную практику именования для констант, которая в течение многих лет использовалась на других языках, я не вижу причин, по которым вы не мог использовать это. Конечно, это не значит, что кто-то все равно не будет писать значение переменной.:)

Mozillas MDN Web Docs содержат хорошие примеры и пояснения о const . Выдержки:

Но грустно, что IE9/10 по-прежнему не поддерживает const . И причина, по которой это абсурдно:

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

В конце концов, это кажется лучшим долгосрочное решение для Интернета — это оставьте это и дождитесь стандартизации для запуска их Конечно.

Они не реализуют его, потому что другие браузеры не реализовали его правильно?! Слишком бояться сделать это лучше? Определения стандартов или нет, константа является константой: устанавливается один раз, никогда не менялась.

И ко всем идеям: каждая функция может быть перезаписана (XSS и т.д.). Таким образом, нет разницы в var или function() . const — единственная действительная константа.

Обновление: IE11 поддерживает const :

IE11 включает поддержку четко определенных и часто используемых функций нового стандарта ECMAScript 6, включая let, const , Map , Set и WeakMap , а также как __proto__ для улучшения взаимодействия.

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

с «новым» объектом api вы можете сделать что-то вроде этого:

взгляните на этот на Mozilla MDN для более подробной информации. Это не первая переменная уровня, поскольку она привязана к объекту, но если у вас есть область действия, что угодно, вы можете прикрепить ее к этому. this должен работать. Так, например, если сделать это в глобальной области действия, будет объявлено псевдооднозначное значение в окне (это действительно плохая идея, вы не должны объявлять глобальные вары небрежно)

note: назначение вернет вам назначенное значение в консоли, но значение переменной не изменится

Если вы не против использования функций:

Этот подход дает вам функции вместо обычных переменных, но гарантирует * что никто не может изменить значение после его установки.

Я лично считаю это довольно приятным, особенно после того, как привык к этому шаблону от наблюдаемых нокаутом.

* Если кто-то не переопределил функцию constant , прежде чем вы ее вызвали

Групповые константы в структурах, где это возможно:

Пример, в моем текущем игровом проекте, который я использовал ниже:

Совсем недавно я использую для сравнения:

IE11 с новым стандартом ES6, который имеет объявление ‘const’.
Выше работает в более ранних браузерах, таких как IE8, IE9 и IE10.

Вы можете легко оборудовать свой script механизмом для констант, который можно установить, но не изменить. Попытка изменить их приведет к ошибке.

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

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

Собственные имена, такие как

поэтому при использовании будет iw_constant.name или iw_constant.age

Вы также можете заблокировать добавление нового ключа или изменение любого ключа внутри iw_constant с помощью метода Object.freeze. Однако он не поддерживается в устаревшем браузере.

Для более старого браузера вы можете использовать polyfill для метода замораживания.

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

//для использования значения iw_constant(‘name’) или iw_constant(‘age’)

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

Некоторое время я указывал «константы» (которые по-прежнему не были константами) в объектных литералах, переданных в выражения with() . Я думал, что это так умно. Вот пример:

В прошлом я также создал пространство имен CONST , где я бы поместил все мои константы. Опять же, с накладными расходами. Sheesh.

Теперь я просто делаю var MY_CONST = ‘whatever’; в KISS.


Забудьте IE и используйте ключевое слово const .

Мое мнение (работает только с объектами).

Попробуйте! Но поймите — это объект, но не простая переменная.

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

Похоже, что большинство ответов, с которыми я сталкивался, — это использование функций для хранения констант. Как и многие пользователи форумов MANY, функции могут быть легко записаны пользователями на стороне клиента. Я был заинтригован ответом Кейта Эветта о том, что объект констант не может быть доступен снаружи, но только из функций внутри.

Итак, я придумал это решение:

Поместите все внутри анонимной функции таким образом, чтобы переменные, объекты и т.д. не могли быть изменены на стороне клиента. Также скрыть «реальные» функции, если другие функции вызовут «реальные» функции изнутри. Я также думал об использовании функций для проверки того, была ли функция изменена пользователем на стороне клиента. Если функции были изменены, измените их, используя переменные, которые «защищены» внутри и не могут быть изменены.

Переменные, области и поднятие переменных в JavaScript

Переменные – фундаментальная составляющая многих языков программирования; они являются одним из наиболее важных понятий для начинающих программистов. В JavaScript существует множество различных свойств переменных, а также несколько правил, которые необходимо соблюдать при их именовании. В JavaScript есть три ключевых слова, используемые для объявления переменной — var, let и const — и каждое из них влияет на то, как будет интерпретироваться переменная в коде.

Данный мануал ознакомит вас с переменными, научит их объявлять и именовать, а также объяснит разницу между var, let и const. Кроме того, вы узнаете, что такое поднятие переменных и как область влияет на поведение переменной.

Что такое переменные

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

До спецификации языка ECMAScript 2015 (ES6), на котором основан JavaScript в данный момент, существовал только один способ объявить переменную – с использованием ключевого слова var. Потому большинство старых кодов и мануалов используют для объявления переменных только var. Давайте рассмотрим различия между var, let и const.

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

// Assign the string value 8host to the username identifier
var username = «8host_blog»;

Это выражение состоит из нескольких частей:

  • Объявление переменной с помощью ключевого слова var;
  • Имя переменной (или идентификатор), username;
  • Операция присваивания, представленная синтаксисом =;
  • Присваиваемое значение, «8host_blog».

Теперь можно использовать переменную username в коде. JavaScript запомнит, что username представляет значение 8host_blog.

// Check if variable is equal to value
if (username === «8host_blog») <
console.log(true);
>
true

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

// Assignment of various variables
var name = «Morty»;
var spartans = 300;
var kingdoms = [ «mammals», «birds», «fish» ];
var poem = < roses: "red", violets: "blue" >;
var success = true;
var nothing = null;

С помощью console.log можно просмотреть значение любой переменной:

// Send spartans variable to the console
console.log(spartans);
300

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

// Assign value to password variable
var password = «hunter2»;
// Reassign variable value with a new value
password = «hunter3»;
console.log(password);
‘hunter3’

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

Именование переменных

В JavaScript имена переменных называются идентификаторами. Несколько правил именования идентификаторов можно найти в мануале Синтаксис и структура кода JavaScript. Вот они вкратце:

  • Имена переменных могут состоять только из букв, цифр (0-9), символа доллара ($) и подчеркивания (_).
  • Имена переменных не могут содержать пробельные символы.
  • Имя переменной не должно начинаться с числа.
  • Существует несколько зарезервированных ключевых слов, которые нельзя использовать как имена переменных.
  • Имена переменных чувствительны к регистру.

JavaScript также имеет соглашение об использовании верблюжьего регистра (camelCase) в именах функций и переменных, объявленных с помощью var или let. При этом первое слово пишется в нижнем регистре, а каждое следующее слово начинается с заглавной буквы (слова пишутся без пробелов между ними). Большинство переменных, которые не являются константами, будут следовать этому соглашению, за некоторыми исключениями. Имена переменных, которые являются константами (объявлены ключевым словом const), обычно записываются в верхнем регистре.

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

Разница между var, let и const

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

Ключевое слово Область видимости Поднятие Переназначение Обновление
var На уровне функции Да Да Да
let На уровне блока Нет Да Нет
const На уровне блока Нет Нет Нет

Возможно, вам интересно, какое из трех ключевых слов вы должны использовать в своих программах. Принято использовать const как можно чаще, а let – в циклах и для переназначения. Как правило, var используется в устаревшем коде.

Область видимости JavaScript

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

  • Глобальные переменные – это те, которые объявлены вне блока.
  • Локальные переменные – это те, которые объявлены внутри блока.

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

// Initialize a global variable
var creature = «wolf»;

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

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

// Initialize a global variable
var species = «human»;
function transform() <
// Initialize a local, function-scoped variable
var species = «werewolf»;
console.log(species);
>
// Log the global and local variable
console.log(species);
transform();
console.log(species);
human
werewolf
human

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

Однако новые ключевые слова let и const относятся к области на уровне блока. Это означает, что новая локальная область создается из любого блока, включая функциональные блоки, операторы if, а также циклы for и while.

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

var fullMoon = true;
// Initialize a global variable
let species = «human»;
if (fullMoon) <
// Initialize a block-scoped variable
let species = «werewolf»;
console.log(`It is a full moon. Lupin is currently a $.`);
>
console.log(`It is not a full moon. Lupin is currently a $.`);
It is a full moon. Lupin is currently a werewolf.
It is not a full moon. Lupin is currently a human.

В этом примере переменная species имеет одно глобальное значение (human) и одно локальное значение (werewolf). Однако если использовать var, будет другой результат.

// Use var to initialize a variable
var species = «human»;
if (fullMoon) <
// Attempt to create a new variable in a block
var species = «werewolf»;
console.log(`It is a full moon. Lupin is currently a $.`);
>
console.log(`It is not a full moon. Lupin is currently a $.`);
It is a full moon. Lupin is currently a werewolf.
It is not a full moon. Lupin is currently a werewolf.

В результате как глобальная переменная, так и переменная на уровне блока выдают одно значение, werewolf. Это связано с тем, что вместо создания новой локальной переменной var переназначает ту же переменную в той же области. var не понимает, что if должен быть частью другой, новой области. Обычно рекомендуется объявлять переменные на уровне блоков, поскольку это уменьшает риск непреднамеренно переопределить значения переменных.

Поднятие переменных

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

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

// Attempt to use a variable before declaring it
console.log(x);
// Variable assignment
var x = 100;
undefined

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

// Attempt to use a variable before declaring it
console.log(x);
// Variable assignment without var
x = 100;
ReferenceError: x is not defined

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

Чтобы лучше продемонстрировать это понятие, мы написали следующий код и объяснили, как его читает JavaScript:

// The code we wrote
console.log(x);
var x = 100;
// How JavaScript interpreted it
var x;
console.log(x);
x = 100;

Перед выполнением скрипта JavaScript сохраняет x в памяти как переменную. Поскольку переменная вызывалась до того, как была определена, результат возвращается undefined, а не 100. Однако это не вызывает ReferenceError и не останавливает скрипт. Хотя ключевое слово var фактически не изменило местоположение var, это демонстрирует, как работает поднятие. Это поведение может вызвать проблемы, потому что программист, который написал этот код, скорее всего, ожидает, что вывод х будет true, а не undefined.

Также поднятие может привести к непредсказуемым результатам, как в следующем примере:

// Initialize x in the global scope
var x = 100;
function hoist() <
// A condition that should not affect the outcome of the code
if (false) <
var x = 200;
>
console.log(x);
>
hoist();
undefined

В этом примере глобальная переменная x равна 100. В зависимости от оператора if x может измениться на 200, но поскольку условие было false, оно не должно влиять на значение x. Вместо этого x был поднят до начала функции hoist(), и значение стало undefined.

Это непредсказуемое поведение может вызвать ошибки в программе. Поскольку let и const определяются на уровне блока, они не будут подниматься таким образом, как в примере ниже.

// Initialize x in the global scope
let x = true;
function hoist() <
// Initialize x in the function scope
if (3 === 4) <
let x = false;
>
console.log(x);
>
hoist();
true

Дублируемое объявление переменных, которое возможно с var, вызовет ошибку с let и const.

// Attempt to overwrite a variable declared with var
var x = 1;
var x = 2;
console.log(x);
2
// Attempt to overwrite a variable declared with let
let y = 1;
let y = 2;
console.log(y);

Uncaught SyntaxError: Identifier ‘y’ has already been declared
Итак, на переменные, объявленные с var, может повлиять поднятие. Поднятие – это механизм в JavaScript, в котором объявления переменных сохраняются в памяти. Это может привести к неопределенным переменным в коде. Ключевые слова let и const решают эту проблему, вызывая ошибку при попытке использовать переменную перед ее объявлением или объявить переменную более одного раза.

Константы

Многие языки программирования используют константы – это значения, которые нельзя изменить. То есть значения, назначенные константе, не могут быть переназначены.

По общему соглашению идентификаторы const пишутся в верхнем регистре. Это отличает их от других переменных.

В приведенном ниже примере переменная SPECIES инициализируется как константа с помощью ключевого слова const. Попытка переназначить переменную приведет к ошибке.

// Assign value to const
const SPECIES = «human»;
// Attempt to reassign value
SPECIES = «werewolf»;
console.log(SPECIES);
Uncaught TypeError: Assignment to constant variable.

Поскольку значения const нельзя переназначить, их необходимо объявить и инициализировать в одно и то же время, иначе возникнет ошибка.

// Declare but do not initialize a const
const TODO;
console.log(TODO);
Uncaught SyntaxError: Missing initializer in const declaration

Значения, которые не могут измениться при программировании, называются неизменяемыми, а значения, которые могут быть изменены – изменяемыми (это очевидно). Значения константы не могут быть переназначены, однако они изменяемы, поскольку свойства объектов, объявленных с помощью const, можно изменять.

// Create a CAR object with two properties
const CAR = <
color: «blue»,
price: 15000
>
// Modify a property of CAR
CAR.price = 20000;
console.log(CAR);

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

Заключение

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

JavaScript. Переменные (глобальные, локальные, константы)

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

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

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

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

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

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

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

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

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

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

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

Константы в JavaScript

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

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

В JavaScript константы можно перезаписывать, как переменные, но если это делать, тогда теряется смысл констант.

JavaScript — Переменные. Константы. Типы данных

Переменные

Переменная – это именованный участок памяти, в который можно как сохранить некоторую информацию, так и получить её из неё.

Объявление (создание) переменных осуществляется с помощью ключевого слова var .

При создании переменной ей сразу же можно присвоить значение.

Присвоение переменной значения осуществляется с помощью оператора «=».


Для того чтобы получить значение переменной достаточно просто обратиться к ней по имени.

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

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

Значение переменной можно изменять неограниченное количество раз.

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

Имя переменной можно составлять из букв, цифр и символов $ и _. При этом первый символ переменной не должен быть цифрой. Кроме этого в качестве имени переменной нельзя использовать зарезервированные слова.

Регистр букв в имени переменной имеет значение. Т.е., например, переменная phone и Phone — это две разные переменные.

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

Но создавать, таким образом, переменные не рекомендуется.

Типы данных

В JavaScript типы данных можно разделить на примитивные и объектные.

Переменные, содержащие примитивные типы данных хранят значение явно.

В JavaScript выделяют 5 примитивных типов данных:

  • число (number);
  • строка (string);
  • булевый тип (boolean);
  • null;
  • undefined.

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

Переменные, содержащие объект, на самом деле хранят не сам объект, а ссылку на него.

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

Число (number)

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

Формат представления чисел в JavaScript осуществляется в соответствии со стандартом IEEE 754-2008.

Целые числа в JavaScript можно задавать не только в десятичной системе счисления, но и в восьмеричной (0) или шестнадцатеричной системе счисления (0x) с использованием префиксов, указанных в круглых скобках:

Записывать числа возможно в экспоненциальной форме :

Числовой тип данных кроме чисел содержит ещё специальные числовые значения :

  • Infinity (положительная бесконечность);
  • -Infinity (отрицательная бесконечность);
  • NaN (Not a Number – не число).

Специальное значения Infinity означает очень большое положительное число, т.е. число, которое не может быть представлено в JavaScript по причине того, что оно слишком велико.

Специальные значения -Infinity означает наоборот очень большое отрицательное число, т.е. число, которое не может быть представлено JavaScript по причине того, что оно тоже слишком велико.

Пример выражений в результате вычисления которых будет возвращены специальные числовые значения :

Значение NaN возвращается в результате выполнения математических операций, которые JavaScript не может вычислить.

При этом очень интересным является то, что значение NaN в JavaScript не равно ничему включая себя.

Логический тип данных (Boolean)

Boolean – примитивный тип данных, который имеет всего два значения: true (истина) и false (ложь).

Строка (String)

Строка (String) – это тип данных, который используется в JavaScript для представления текста.

Строка JavaScript может состоять из 0 или большего количества символов.

В качестве формата строки в JavaScript всегда использутся кодировка Unicode.

Создание строки (литерала строки) выполняется посредством заключения текста в одинарные или двойные кавычки .

В JavaScript нет разницы между одинарными и двойными кавычками.

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

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

Строка в JavaScript может содержать специальные символы. Например, \n (перевод строки), \t (табуляция), \r (возврат каретки) и др.

Со строками можно произовдить операцию сложения (объединения) или другими словами конкатенацию. Для этого используется оператор «+». Сымысл данной операции заключается в присоединении второй строки к концу первой.

Значение «undefined»

undefined — специальный примитивный тип данных, который имеет одно значение, равное undefined .

Этот тип данных имеет объявленная переменная, которой ещё не присвоено значение.

Значение undefined также будет возвращено при обращении к несуществующему свойству объекта.

Значение «null»

null — специальный примитивный тип данных, который имеет одно значение, равное null .

null — это просто специальное значение, которое имеет смысл «ничего» или «неизвестное значение», т.е. оно явно ничего не означает.

Объект (Object)

Объект – это структура данных, состоящая из пар имя-значение.

Создание объекта с помощью нотации литерала объекта осуществляется следующим образом:

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

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

Другими словами, объект — это структура данных, состоящая из свойств и методов.

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

Оператор typeof

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

Синтаксис оператора typeof (вариант без круглых скобок):

Синтаксис оператора typeof (с использованием круглых скобок):

Константы

С выходом ECMAScript 6 появилось возможность создавать константы. Осуществляется это с помощью ключевого слова const.

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

Константа – это переменная, значение которой защищено от изменения. Т.е. при попытке поменять значение будет брошена ошибка.

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

JavaScript Const

ECMAScript 2015

ES2015 introduced two important new JavaScript keywords: let and const .

Variables defined with const behave like let variables, except they cannot be reassigned:

Example

Block Scope

Declaring a variable with const is similar to let when it comes to Block Scope.

The x declared in the block, in this example, is not the same as the x declared outside the block:

Example

You can learn more about Block Scope in the previous chapter: JavaScript Let.

Assigned when Declared

JavaScript const variables must be assigned a value when they are declared:

Incorrect

Correct

Not Real Constants

The keyword const is a little misleading.

It does NOT define a constant value. It defines a constant reference to a value.

Because of this, we cannot change constant primitive values, but we can change the properties of constant objects.

Primitive Values

If we assign a primitive value to a constant, we cannot change the primitive value:

Example

Constant Objects can Change

You can change the properties of a constant object:

Example

// You can change a property:
car.color = «red»;

// You can add a property:
car.owner = «Johnson»;

But you can NOT reassign a constant object:

Example

Constant Arrays can Change

You can change the elements of a constant array:

Example

// You can create a constant array:
const cars = [«Saab», «Volvo», «BMW»];

// You can change an element:
cars[0] = «Toyota»;

// You can add an element:
cars.push(«Audi»);

But you can NOT reassign a constant array:

Example

Browser Support

The const keyword is not supported in Internet Explorer 10 or earlier.

The following table defines the first browser versions with full support for the const keyword:


Chrome 49 IE / Edge 11 Firefox 36 Safari 10 Opera 36
Mar, 2020 Oct, 2013 Feb, 2015 Sep, 2020 Mar, 2020

Redeclaring

Redeclaring a JavaScript var variable is allowed anywhere in a program:

Example

Redeclaring or reassigning an existing var or let variable to const , in the same scope, or in the same block, is not allowed:

Example

Redeclaring or reassigning an existing const variable, in the same scope, or in the same block, is not allowed:

Example

const x = 2; // Allowed
const x = 3; // Not allowed
x = 3; // Not allowed
var x = 3; // Not allowed
let x = 3; // Not allowed

<
const x = 2; // Allowed
const x = 3; // Not allowed
x = 3; // Not allowed
var x = 3; // Not allowed
let x = 3; // Not allowed
>

Redeclaring a variable with const , in another scope, or in another block, is allowed:

Example

const x = 2; // Allowed

<
const x = 3; // Allowed
>

<
const x = 4; // Allowed
>

Hoisting

Variables defined with var are hoisted to the top (if you don’t know what Hoisting is, read our Hoisting Chapter).

You can use a var variable before it is declared:

Example

Variables defined with const are not hoisted to the top.

A const variable cannot be used before it is declared:

Example

COLOR PICKER

HOW TO

SHARE

CERTIFICATES

Your Suggestion:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Web Certificates

W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use, cookie and privacy policy. Copyright 1999-2020 by Refsnes Data. All Rights Reserved.
Powered by W3.CSS.

Are there constants in JavaScript?

Is there a way to use constants in JavaScript?

If not, what’s the common practice for specifying variables that are used as constants?

33 Answers 33

Since ES2015, JavaScript has a notion of const :

This will work in pretty much all browsers except IE 8, 9 and 10. Some may also need strict mode enabled.

You can use var with conventions like ALL_CAPS to show that certain values should not be modified if you need to support older browsers or are working with legacy code:

Are you trying to protect the variables against modification? If so, then you can use a module pattern:

Using this approach, the values cannot be modified. But, you have to use the get() method on CONFIG :(.

If you don’t need to strictly protect the variables value, then just do as suggested and use a convention of ALL CAPS.

The const keyword is in the ECMAScript 6 draft but it thus far only enjoys a smattering of browser support: http://kangax.github.io/compat-table/es6/. The syntax is:

See Object.freeze. You can use const if you want to make the constants reference read-only as well.

IE does support constants, sort of, e.g.:

ECMAScript 5 does introduce Object.defineProperty :

No, not in general. Firefox implements const but I know IE doesn’t.

@John points to a common naming practice for consts that has been used for years in other languages, I see no reason why you couldn’t use that. Of course that doesn’t mean someone will not write over the variable’s value anyway. 🙂

Mozillas MDN Web Docs contain good examples and explanations about const . Excerpt:

But it is sad that IE9/10 still does not support const . And the reason it’s absurd:

So, what is IE9 doing with const? So far, our decision has been to not support it. It isn’t yet a consensus feature as it has never been available on all browsers.

In the end, it seems like the best long term solution for the web is to leave it out and to wait for standardization processes to run their course.

They don’t implement it because other browsers didn’t implement it correctly?! Too afraid of making it better? Standards definitions or not, a constant is a constant: set once, never changed.

And to all the ideas: Every function can be overwritten (XSS etc.). So there is no difference in var or function() . const is the only real constant.

Update: IE11 supports const :

IE11 includes support for the well-defined and commonly used features of the emerging ECMAScript 6 standard including let, const , Map , Set , and WeakMap , as well as __proto__ for improved interoperability.

In JavaScript, my preference is to use functions to return constant values.

If you don’t mind using functions:

This approach gives you functions instead of regular variables, but it guarantees * that no one can alter the value once it’s set.

I personally find this rather pleasant, specially after having gotten used to this pattern from knockout observables.

*Unless someone redefined the function constant before you called it

with the «new» Object api you can do something like this:

take a look at this on the Mozilla MDN for more specifics. It’s not a first level variable, as it is attached to an object, but if you have a scope, anything, you can attach it to that. this should work as well. So for example doing this in the global scope will declare a pseudo constant value on the window (which is a really bad idea, you shouldn’t declare global vars carelessly)

note: assignment will give you back the assigned value in the console, but the variable’s value will not change

‘ if you try that. either you’re doing it wrong, or your ff implemented it incorrectly. I guess it’s a mix of both. – tenshou Dec 17 ’13 at 21:48

Group constants into structures where possible:

Example, in my current game project, I have used below:

More recently I am using, for comparision:

IE11 is with new ES6 standard that has ‘const’ declaration.
Above works in earlier browsers like IE8, IE9 & IE10.

You can easily equip your script with a mechanism for constants that can be set but not altered. An attempt to alter them will generate an error.

Forget IE and use the const keyword.

Yet there is no exact cross browser predefined way to do it , you can achieve it by controlling the scope of variables as showed on other answers.

But i will suggest to use name space to distinguish from other variables. this will reduce the chance of collision to minimum from other variables.

Proper namespacing like

so while using it will be iw_constant.name or iw_constant.age

You can also block adding any new key or changing any key inside iw_constant using Object.freeze method. However its not supported on legacy browser.

For older browser you can use polyfill for freeze method.

If you are ok with calling function following is best cross browser way to define constant. Scoping your object within a self executing function and returning a get function for your constants ex:

//to get the value use iw_constant(‘name’) or iw_constant(‘age’)

** In both example you have to be very careful on name spacing so that your object or function shouldn’t be replaced through other library.(If object or function itself wil be replaced your whole constant will go)

For a while, I specified «constants» (which still weren’t actually constants) in object literals passed through to with() statements. I thought it was so clever. Here’s an example:

In the past, I also have created a CONST namespace where I would put all of my constants. Again, with the overhead. Sheesh.

Now, I just do var MY_CONST = ‘whatever’; to KISS.

My opinion (works only with objects).

Try! But understand — this is object, but not simple variable.

I too have had a problem with this. And after quite a while searching for the answer and looking at all the responses by everybody, I think I’ve come up with a viable solution to this.

It seems that most of the answers that I’ve come across is using functions to hold the constants. As many of the users of the MANY forums post about, the functions can be easily over written by users on the client side. I was intrigued by Keith Evetts’ answer that the constants object can not be accessed by the outside, but only from the functions on the inside.

So I came up with this solution:

Put everything inside an anonymous function so that way, the variables, objects, etc. cannot be changed by the client side. Also hide the ‘real’ functions by having other functions call the ‘real’ functions from the inside. I also thought of using functions to check if a function has been changed by a user on the client side. If the functions have been changed, change them back using variables that are ‘protected’ on the inside and cannot be changed.

htmllab

Свойства объектов в JavaScript и константы

JavaScript — объектно-ориентированный язык программирования. Для того, чтобы хорошо его знать, нужно понимать как создаются, модифицируются объекты. Поговорим о создании свойств объектов, настройке их (будут ли свойства изменяемыми, будут ли они перечисляться в цикле for/in), а также поговорим о создании констант в ECMA-262 в редакции 2015 года и более ранней версии. Конечный результат можно посмотреть http://codepen.io/htmllab/pen/ORwjrG.

Свойства объектов в JavaScript и константы

Константы в JavaScript

В стандарте ecma-262 описывается возможность создания констант.

Добавить комментарий Отменить ответ

Для отправки комментария вам необходимо авторизоваться.

Для чего объявляют функции через константы?

Доброй ночи! Хочется получить ответ на вопрос, для чего функции объявляются через константы, это для того, чтобы они не переопределялись в других файлах или нет? Подход меня привлёк, но не могу понять его плюсы.

  • Вопрос задан более двух лет назад
  • 510 просмотров

В этом и плюс const, что нельзя переопределить.

Вчера сам уже на собственном примере понял все прелести:

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

Лично я, хоть и использую довольно часто. Но в Вашем случае я бы написал так:

Топ-пост этого месяца:  Как добавить рамки на все фото сайта WordPress
Добавить комментарий