JavaScript Змінні
4 способи оголосити змінну JavaScript:
- Використовуючи
var - Використовуючи
let - Використовуючи
const - Нічого не використовуючи
Що таке змінні?
Змінні — це контейнери для зберігання даних (зберігання значень даних).
У цьому прикладі, x, y та z є змінними, оголошеними за допомогою ключового слова var:
В цьому прикладі x, y та z є змінними, оголошеними за допомогою ключового слова let:
В цьому прикладі x, y та z є неоголошеними змінними:
З усіх наведених вище прикладів ви можете здогадатися:
- x зберігає значення 5
- y зберігає значення 6
- z зберігає значення 11
Коли використовувати змінну JavaScript?
Завжди оголошуйте змінні JavaScript за допомогою var, let або const.
Ключове слово var використовувалось у всьому JavaScript коді з 1995 по 2015 рік.
Ключові слова let та const було додано до JavaScript у 2015 році.
Якщо ви хочете, щоб ваш код запускався в старішій версії веб-браузера, ви повинні використовувати var.
Коли використовувати JavaScript const?
Якщо вам потрібне загальне правило: завжди оголошуйте змінні за допомогою const.
Якщо ви вважаєте, що значення змінної може змінитися, використовуйте let.
У цьому прикладі price1, price2 та total є змінними:
Дві змінні price1 та price2 оголошуються за допомогою ключового слова const.
Це постійні значення, які не можуть бути змінені.
Змінна total оголошується за допомогою ключового слова let.
Це значення можна змінити.
Як алгебра
Як і в алгебрі, змінні містять значення:
let x = 5;
let y = 6;
Як і в алгебрі, у виразах використовуються змінні:
let z = x + y;
З наведеного вище прикладу ви можете здогадатися, що загальна сума дорівнює 11.
Примітка
Змінні є контейнерами для зберігання значень.
Ідентифікатори JavaScript
Усі змінні JavaScript мають бути ідентифіковані за допомогою унікальних імен.
Ці унікальні імена називаються ідентифікаторами.
Ідентифікатори можуть бути короткими іменами (наприклад, x та y) або більш описовими іменами: age (вік), sum (сума), totalVolume (загальний обсяг).
Загальні правила побудови імен для змінних (унікальних ідентифікаторів) такі:
- Імена можуть містити літери, цифри, підкреслення та знаки долара.
- Імена мають починатися з літери
- Імена також можуть починатися з $ та _ (але ми не будемо використовувати їх у цьому посібнику)
- Імена чутливі до регістру (y та Y - це різні змінні)
- Зарезервовані слова (наприклад, ключові слова JavaScript) не можна використовувати як імена
Примітка
Ідентифікатори JavaScript чутливі до регістру.
Оператор присвоєння
В JavaScript знак рівності (=) є оператором "присвоєння", а оператором "дорівнює".
Це відрізняється від алгебри. Наступне не має сенсу в алгебрі:
x = x + 5
Однак у JavaScript це має сенс: він присвоює x + 5 значення x.
(Він обчислює значення x + 5 та поміщає результат в x. Значення x збільшується на 5.)
Примітка
Оператор "дорівнює" в JavaScript записується як == (тобто, два знака "дорівнює").
Типи даних JavaScript
Змінні JavaScript можуть містити числа, як-от 100, і текстові значення, як-от "John Doe".
У програмуванні текстові значення називають текстовими рядками.
JavaScript може обробляти багато типів даних, але наразі подумайте лише про числа та рядки.
Рядки записуються в подвійних або одинарних лапках. Числа пишуться без лапок.
Якщо ви берете число в лапки, воно розглядатиметься як текстовий рядок.
Оголошення змінної JavaScript
Створення змінної в JavaScript називається "оголошенням" змінної.
Ви оголошуєте змінну JavaScript за допомогою ключового слова var або let:
var carName;
або:
let carName;
Після оголошення змінна не має значення (технічно вона undefined - невизначена).
Щоб присвоїти значення змінній, використовуйте знак рівності:
carName = "Volvo";
Ви також можете призначити значення змінній під час її оголошення:
let carName = "Volvo";
У наведеному нижче прикладі ми створюємо змінну під назвою carName і присвоюємо їй значення "Volvo".
Тоді ми "виводимо" значення всередині параграфу HTML з id="demo":
Приклад
<p id="demo"></p>
<script>
let carName = "Volvo";
document.getElementById("demo").innerHTML = carName;
</script>
Спробуйте самі »
Примітка
Хорошою практикою програмування є оголошення всіх змінних на початку скрипту.
Одна інструкція, багато змінних
Ви можете оголосити багато змінних в одній інструкції.
Почніть інструкцію з let і розділіть змінні комою:
Оголошення може займати кілька рядків:
Значення = undefined
У комп’ютерних програмах змінні часто оголошуються без значення. Значення може бути чимось, що потрібно обчислити, або тим, що буде надано пізніше, як-от введення користувача.
Змінна, оголошена без значення, матиме значення undefined (невизначено).
Змінна carName матиме значення undefined після виконання цієї інструкції:
Повторне оголошення змінних JavaScript
Якщо ви повторно оголосите змінну JavaScript, оголошену за допомогою var, вона не втратить свого значення.
Змінна carName усе ще матиме значення "Volvo" після виконання цих інструкцій.
Примітка
Ви не можете повторно оголосити змінну, оголошену за допомогою let або const.
Це не буде працювати:
let carName = "Volvo";
let carName;
JavaScript Арифметика
Як і з алгеброю, ви можете виконувати арифметику зі змінними JavaScript, використовуючи такі оператори, як = та +:
Ви також можете додати рядки, але рядки будуть об’єднані:
Також спробуйте це:
Примітка
Якщо взяти число в лапки, решта чисел розглядатиметься як рядки та об’єднано.
Тепер спробуйте це:
JavaScript Знак долара $
Оскільки JavaScript розглядає знак долара як літеру, ідентифікатори, що містять $, є дійсними іменами змінних:
Використання знака долара не дуже поширене в JavaScript, але професійні програмісти часто використовують його як псевдонім для основної функції в бібліотеці JavaScript.
Наприклад, у бібліотеці JavaScript jQuery основна функція $ використовується для вибору елементів HTML. У jQuery $("p"); означає "вибрати всі елементи p".
JavaScript Підкреслення (_)
Оскільки JavaScript сприймає підкреслення як літеру, ідентифікатори, що містять _, є дійсними іменами змінних:
Використання підкреслення не дуже поширене в JavaScript, але серед професійних програмістів прийнято використовувати його як псевдонім для "приватних (прихованих)" змінних.
Примітка. Також ви можете переглянути архівну (застарілу) версію даної теми.
JavaScript — Змінні. Відеоурок W3Schools
У цьому відео пояснюються та демонструються змінні JavaScript.
Частина серії відеоуроків для вивчення JavaScript для початківців!
