Уроки JavaScript – Все, що потрібно знати про змінні

Однією з найголовніших та фундаментальних концепцій будь-якої мови програмування є можливість зберігання значень, які пізніше можна багаторазово використовувати. Такі значення в програмуванні називаються змінними.

В сьогоднішньому уроці ми розглянемо змінні в JavaScript. В цій мові програмування для оголошення змінних використовуються три зарезервованих ключових слова: var, let або const.

Ви можете вільно використовувати кожен з цих видів змінних, оскільки всі вони «нетипізовані», — тобто, це означає, що змінна може містити значення будь-якого типу даних. Змінні JavaScript відрізняються один від одного тим, як ви можете взаємодіяти зі змінною пізніше.

Нижче показаний приклад синтаксису оголошення змінної в JavaScript.

ВАЖЛИВО! Ви повинні завжди спочатку оголошувати змінну, а потім тільки використовувати її.

var someVariable; // оголошення змінної
someVariable = 'якесь значення'; // привласнення значення змінній
var someVariable = 'якесь значення'; // скорочений варіант оголошення: одночасно оголошення та привласнення значення

 

Ви можете оголосити кілька змінних в одному виразі:

// Створюємо три змінні в одному виразі
var variableOne = 'Перша змінна',
   variableTwo = 'Друга змінна',
   variableThree = 'Третя змінна';

 

Змінні можуть бути повторно оголошено багато разів. В цьому випадку остання змінна перевизначає всі попередні значення:

var example = 'якесь значення'; // змінна example містить значення 'якесь значення'
example = 'нове значення'; // тепер змінна example містить значення 'нове значення'

 

Оголошення змінної за допомогою ключового слова let

Синтаксис змінної let виглядає так:

let someVariable = 'значення змінної';

У стандарті ECMAScript для JavaScript, який був представлений в 2015 році (ES2015), було введено ключове слово let для змінної. Нововведення було направлено на підтримку філософії, згідно з якою змінні повинні існувати тільки там, де вони необхідні.

Як і змінна var, змінні let також можуть бути перевизначені в будь-якій точці програмного коду. Є 3 основних відмінності між змінними let і var:

  • На верхньому рівні let, на відміну від var, не створює властивості для глобального об’єкту.
  • Змінні let не ініціалізуються, поки їх визначення не буде оцінено. Тому, на відміну від var, змінні let не «піднімаються» в верхню частину блоку. Спроба отримати до них доступ призведе до помилки ReferenceError.
  • Змінні, оголошені з використанням ключового слова var, потрапляють в безпосереднє тіло функції, а змінні let – в безпосередній обгортковий блок, який позначений символами {} (фігурні дужки).

 

Оголошення змінної за допомогою ключового слова const

Синтаксис змінної const виглядає так:

const someVariable = 'значення змінної';

У стандарті ECMAScript шостої версії (ES6) для JavaScript, що також був представлений в 2015 році, було введено ключове слово const, яке також дозволяє визначати нову змінну.

Як і в випадку зі змінною let, у змінної const є своя область дії блоку. Між цими змінними є одна принципова відмінність.

Як тільки змінна const ініціалізована, її значення не може бути змінене, якщо змінна не є частиною об’єкта, що надає методи, які змінюють її вміст. Візьмемо для прикладу наступний масив:

const arr = ['Іван', 'Степан', 'Олексій'];
// виклик в консолі логу для arr[1] поверне 'Іван'
// Метод нижче перевизначає 'Іван' в 'Михайло'
arr[1] = 'Михайло';
// виклик в консолі логу для arr[1] поверне 'Михайло'

 

 

Ось і все на сьогодні. Дякуємо, що читаєте нас!

 

Recent Posts

Використання запитів WP_Query у WordPress — частина 3 (основні функції класу)

Цей урок є продовженням серії про роботу з запитами до бази даних WP_Query у ВордПрес.…

9 години ago

Григорій Сковорода

Як ліки не завжди приємні, так і істина буває сувора Григорій Сковорода  

3 дні ago

Використання запитів WP_Query у WordPress — частина 2 (огляд циклу)

Цей урок є продовженням серії про роботу з запитами до бази даних WP_Query у ВордПрес.…

4 дні ago

5 плагінів, які зроблять ваш WordPress-сайт ідеальним у 2025

Без плагінів WordPress – це просто чистий аркуш. Щоб сайт працював швидко, був безпечним і…

5 днів ago

Використання запитів WP_Query у WordPress в теорії та на прикладах — частина 1 (вступ)

Клас WP_Query — це потужний інструмент, з допомогою якого можна максимально контролювати надсилання запитів до…

6 днів ago

Марк Аврелій

Твої думки стають твоїм життям Марк Аврелій  

1 тиждень ago