Большую часть времени приложение должно работать с информацией.

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

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

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

Мы объявляем переменные для хранения данных, используя ключевые слова var, let, const.

  • let — это современное объявление переменной.
  • var — объявление переменной старой школы.
  • const — это как let, но значение переменной изменить нельзя.

Ключевое слово пусть

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

let information;

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

let information = "Hello you";

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

let user = 'John';
let age = 25;
let message = 'Hello motherfucker';

🚧 Двойное объявление вызывает ошибку
Переменная должна быть объявлена ​​только один раз, повторное объявление одной и той же переменной является ошибкой.

let information = 'coco banjo';
// repeated 'let' leads to an error
let information = 'baba banjo'; // SyntaxError: 'message' has already been declared

Константа ключевого слова

Чтобы объявить постоянную (неизменную) переменную, используйте const вместо let:

const myAddress = 'Sherbrooke, Canada';

Переменные, объявленные с использованием const, называются константами. Их нельзя переназначить. Попытка сделать это вызовет ошибку:

const myBirthday = 'Sherbrooke, Canada';
myBirthday = 'Frankfurt, Germany'; // error, can't reassign the constant!

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

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

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

Например, давайте сделаем константы для цветов в так называемом «сетевом» (шестнадцатеричном) формате:

const COLOR_BLUE = "#00F";
const COLOR_ORANGE = "#FF7F00";

// ...when we need to pick a color
let color = COLOR_ORANGE;
console.log(color); // #FF7F00

Преимущества:

  • COLOR_ORANGE запомнить намного легче, чем "#FF7F00".
  • Гораздо проще ошибиться при вводе "#FF7F00", чем COLOR_ORANGE.
  • При чтении кода COLOR_ORANGE имеет гораздо большее значение, чем #FF7F00.

🏷️ Когда мы должны использовать заглавные буквы для константы, а когда мы должны называть ее обычным образом?

Давайте проясним это.

constant просто означает, что значение переменной никогда не меняется. Но есть константы, которые известны до выполнения (например, шестнадцатеричное значение для красного цвета), и есть константы, которые вычисляются во время выполнения, во время выполнения, но не изменяются после их первоначального назначения.

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

Например:

const pageLoadTime = /* time taken by a webpage to load */;

Значение pageLoadTime неизвестно до загрузки страницы, поэтому оно называется нормально. Но это по-прежнему константа, потому что она не меняется после присваивания.

Правила именования переменных

Есть два ограничения на имена переменных в JavaScript:

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

Переменные должны быть названы таким образом, чтобы мы могли легко понять, что находится внутри них. Именование переменных — один из самых важных и сложных навыков в программировании. Беглый взгляд на имена переменных может показать, какой код был написан новичком, а какой — опытным разработчиком. Пожалуйста, потратьте время на обдумывание правильного имени для переменной перед ее объявлением. Это отплатит вам щедро 😉.

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

Что интересно — знак доллара '$' и знак подчеркивания '_' тоже можно использовать в именах. Это обычные символы, как и буквы, без особого значения.

Эти имена действительны:

let $ = 10; // declared a variable with the name "$"
let _ = 25; // and now a variable with the name "_"

Примеры некорректных имен переменных:

let 1a; // cannot start with a digit
let my-name; // hyphens '-' aren't allowed in the variable name

🏷️ Зарезервированные имена
Существует список зарезервированных слов, которые нельзя использовать в качестве имен переменных, поскольку они используются самим языком.
Например: let, class, return и function зарезервированы.

Код ниже дает синтаксическую ошибку:

let let = 50; // can't name a variable "let", error!
let return = 25; // also can't name it "return", error!

Области действия переменных

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

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

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

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

Рассмотрим код ниже:

if (true) {
   let y = 15;
   var x = 40;
   console.log(x);
   console.log(y);
}

console.log(x);
console.log(y);

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

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

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

// code here can NOT use barName
function randomFunction() {
   let barName = "Irish Pub";
   // code here CAN use barName
}
// code here can NOT use barName

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

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

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

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

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

Жизнь переменной JavaScript начинается с момента ее объявления. Функциональные (локальные) переменные удаляются, когда функция завершена. В веб-браузере глобальные переменные удаляются при закрытии окна браузера (или вкладки).

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

📬 Большое спасибо за внимание!
Прежде чем перейти к заключению, мне интересно узнать, помогло ли вам это руководство. Пожалуйста, поделитесь своими мыслями в разделе комментариев 💬.

Вы можете следить за мной в Twitter или подписаться на мою рассылку Dive In Craft ниже, чтобы не пропустить предстоящие сообщения, а также советы и рекомендации, которые я иногда делюсь в этом блоге.

Заворачивать

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

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