JavaScript - Змінні. Константи. Типи даних. Граматика та типи Змінна var

💖 Подобається?Поділися з друзями посиланням

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

Створення змінної

Змінна створюється у два етапи: це оголошення змінної та присвоєння їй імені.

Для початку ми маємо задекларувати змінну, тобто оголосити її, це робиться за допомогою ключового слова var. Далі пишемо інструкцію, це ім'я змінної, її назву як до неї звертатимемося, для прикладу напишу dwstv.


Як називати змінні вирішувати, звичайно, вам, однак є кілька правил, яких необхідно дотримуватися, щоб працював.

  • перше правило, уникайте використання зарезервованих слів . Деякі слова в мові JavaScript використовуються в самій системі, наприклад слово var за допомогою якого ми оголошуємо змінну. Крім того, деякі слова, такі як alert, document, window, вважаються особливими властивостями веб-сторінки. Якщо ви спробуєте їх задіяти як змінні, отримайте повідомлення про помилку. Тут можна переглянути список зарезервованих слів.
  • друге правило, ім'я змінної повинне починатися з літери, символу $ або _ . Тобто змінна не може починатися з цифри або розділового знаку: ім'я 1dwstv і &dwstv працювати не будуть, а імена $dwstv і _dwstv будуть.
  • третє правило, в імені змінної можуть бути літери, цифри, символи $ і _, і не можуть бути використані в імені пробіли або інші спеціальні знаки : dws&tv і dws tv це неприпустимі імена, а такого формату можна, dws_tv і dwstv1 або dws_tv_1 .
  • четверте правило, імена змінних чутливі до регістру Інтерпретатор JavaScript по-різному сприймає малі та великі літери, тобто змінна DWSTV відрізняється від змінної dwstv, а також від змінної DwStv і Dwstv.
  • п'яте правило, не рекомендується використовувати символи, відмінні від латиниці, змінні, написані кирилицею, хоч і працюватимуть, але це не гарантовано, до того ж, колегам з інших країн зрозумілі не будуть.

Це основні п'ять правил, яких рекомендую дотримуватись, на додаток до них хочу ще сказати, привласнюйте до своїх змінних ясні та виразні імена. Називайте змінні відповідно до типу даних, які в них зберігаєте, це вам допоможе надалі розібратися в тому, що написано, і, дивлячись на такі змінні, буде зрозуміло, про що йдеться.

Називаючи змінні, намагайтеся, щоб вони були зручними для читання. При використанні кількох слів додавайте між ними символ нижнього підкреслення або починайте кожне слово після першого з великої літери. Наприклад, dwsTV або dws_tv .

Використання змінних

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

Для того щоб покласти в змінну дані, використовується спеціальний символ, знак рівності (= ), він називається операцією присвоювання , оскільки він використовується, щоб привласнити змінну якесь значення.


Наприклад покладемо в змінну dwstv цифрове значення, кількість передплатників 8500, оголошуємо змінну var dwstv; і другим рядком кладемо в неї значення dwstv = 8500;

Var dwstv; dwstv = 7200;

І так, першим рядком ми створили змінну, а другою зберегли значення. Ми також можемо створювати змінну і зберігати в ній значення за допомогою однієї інструкції, наприклад:

Var dwstv = 7200;

У змінній ми можемо зберігати будь-які типи даних, які проходили на попередніх уроках, це можуть бути числові, рядкові та логічні значення:

Var dwstv = 7200; var lessons = 'JavaScript'; var youtubeKanal = 'DwsTV'; var subscribers = '7700'; var content = true;

Ми можемо також заощаджувати місце, час, декларуючи змінні одним ключем var, приклад:

Var lessons = 'JavaScript', youtubeKanal = 'DwsTV', subscribers = '7700', content = true;

Після того як зберегли значення змінних, у нас з'являється можливість отримати доступ до цих даних. Для цього достатньо використати ім'я найзміннішої.

Наприклад, якщо нам потрібно відкрити діалогове вікно оповіщення та відобразити значення, збережене в змінній kanal, досить просто написати ім'я змінної функції alert .

Alert(kanal);

Зверніть увагу, що ми не укладаємо змінні в лапки - вони тільки для рядків, тому ми не пишемо alert('kanal') , тому що в цьому випадку ми отримаємо слова kanal, а не збережене значення змінної.

Тепер я думаю, ви розібралися, чому рядки слід укладати в лапки: інтерпретатор JavaScript сприймає слова без лапок або як спеціальні об'єкти (наприклад, команда alert() ), або як імена змінних.

Та й ще такий момент, коли ми задекларували змінну ключовим словом var , і хочемо поміняти в змінній значення, не обов'язково повторно її оголошувати, прописуючи слово var достатньо викликати ім'я змінної і привласнити їй нове значення.

Subscribers = '10000';

Після завершення цього уроку хочу сказати, вивчаючи будь-яку мову, ви не навчитеся програмувати. Безперечно, ви дізнаєтеся, щось нове, але швидше за все цю інформацію ваш мозок не запам'ятає, тому що з нею ви не працюєте. Неможливо вивчити якусь мову, не практикуючись, тому з цього уроку ви отримуєте маленьке завдання для того, щоб надана інформація у вас уклалася і ви могли з нею працювати.

Практичне завдання:

Створіть три змінні, одній привласніть числове значення, другий рядкове значення, а третій логічне. Усі змінні задекларуйте одним ключовим словом var і відобразіть їх на сторінці. Потім перевизначте змінну з числовим значенням і отриманий результат відобразіть за допомогою функції alert() .


На початку наступного відео розберемо це завдання, ділитесь вашими результатами в коментарях, пишіть, якщо у когось залишилися питання. Кому сподобався урок і хоче підтримати проект, для цього достатньо поділіться ним у соціальних мережах.

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

Урок підготував Горєлов Деніс.

Чесно сказати я спочатку не хотів вводити цю тему. Що можна говорити про змінні, особливо JavaScript? Але потім згадав, як іноді розбирався зі складними конструкціями і важко розумів деякі, здавалося б неприпустимі в інших мовах програмування висловлювання. Можна сказати так: тут вам не буде помилки "Невірний тип даних", а якщо і буде дуже рідко. Якщо ви працювали з іншими мовами програмування, тоді згадайте, як часто у вас виникала помилка про невірні типи даних. В мові JavaScript тип даних може легко перевизначатися, при цьому ви можете і не помітити в якому місці, - ось в цьому те і складність. З іншого боку, якщо ви добре орієнтуватиметеся в принципах перетворень типів, знати всі властивості змінних і масивів, ці можливості тільки принесуть вам впевненість у написанні програм.

Змінні мови JavaScript можуть зберігати значення різних типів:

  • Рядки – послідовність символів;
  • Числові значення-цілі та дійсні числа;
  • Булеві значення-тільки два значення true або false;
  • Масиви-множини однотипних змінних;
  • Дати - значення дати та часу.
Час життя змінної пов'язані з вікном, у якому створено і залежить від цього, де визначено. JavaScript-програми містяться в документах HTML, і при завантаженні нового документа до браузера будь-які змінні, створені в програмі, будуть видалені.
Щоб зберегти будь-які значення при завантаженні нового документа в JavaScript є лише 2 рішення:
  • шляхом створення змінних у фреймовмісному документі верхнього рівня;
  • шляхом використання "cookies";
Для збереження змінних та функцій за допомогою фреймосодержащих документів ці змінні та функції необхідно визначити в документі верхнього рівня, а потім використовувати властивості parent або top об'єкта window для звернення до них із документів, завантажених у фрейми. ВАЖЛИВО: такі змінні та функції потрібно задавати в заголовку документа верхнього рівня між тегами . . .. Звичайно, існує ймовірність, що документ може бути завантажений без кадру і тоді звернення до невизначеного об'єкта викличе помилку, але можна заздалегідь перевірити чи завантажений документ у кадр:



Cookies дозволяють зберігати невеликі фрагменти інформації на локальному дискукористувача. Встановлюючи значення cookies і прориваючи їх на наступних стадіях роботи, можна відновлювати необхідні значення. Докладніше про cookies говоритимемо пізніше.

Імена змінних, створення змінних

У мові JavaScript створити змінну набагато простіше, ніж у інших мовах програмування. Наприклад, при створенні змінної немає потреби вказувати її тип. Змінні визначають як із початковими значеннями, так і без них. У процесі виконання програми вже створені змінні можна навіть призводити до різних типів даних. Імена змінних можуть починатися з будь-якої літери (від a до z, або A-Z) або з символу підкреслення (_), частина може містити цифри, символи підкреслення і літери. Пам'ятайте те, що в іменах змінних розрізняються символи верхнього та нижнього регістру: наприклад MyVariable - це не те, що myvariable.
Змінну можна створити одним із способів:

  • за допомогою оператора var та операції присвоєння (=);
  • за допомогою операції присвоєння (=).
Оператор Var використовують як для створення змінної, а й її ініціалізації. Операція присвоєння (=) необхідна, щоб запам'ятати у змінній значення, і під час роботи зі змінними, створеними без початкового значення, використовувати не обов'язково. Наприклад:

Var MyVariable = 35

Створює змінну з ім'ям MyVariable, що містить числове значення 35. Змінна існує доти, доки завантажено поточний документ. Якщо ви створюєте цю змінну у документі верхнього рівня, що містить фреймо, до неї слід звертатися за допомогою виразу top.MyVariable, а ще краще parent.MyVariable для підстрахування від вкладених кадрів.

У мові JavaScript змінніможна визначати, навіть задаючи інший тип даних. Наприклад, після виконання оператора

Var MyVariable = "35"

Змінна буде зберігати рядок "35". Подібні перетворення і призводять іноді до непорозумінь. Ось наприклад:



Як ви думаєте, яке значення набуде змінна "c" після виконання програми? Якщо ви не знайомі з правилами перетворення змінних на JavaScript - не вгадаєте. Значення змінної "c" після завершення блоку дорівнюватиме числовому значенню 320. Про принципи перетворення типів змінних говоритимемо пізніше. Змінну можна визначити і не використовуючи оператор "Var", а просто достатньо присвоїти значення, причому який тип даних буде наданий, того типу і виявиться змінна. Оператор "Var" використовується переважно для читабельності JS-програми. Змінна може бути задана без початкових значень, наприклад:

Var MyVariable;

Створено змінну з ім'ям MyVariable, яка не має певного типу даних та початкового значення. Змінні, створювані з допомогою таких описів, відомі як невизначені (null variable). Наприклад, порівнюючи таку змінну зі значенням null, можна дізнатися, чи визначена змінна. Однак не можна плутати різні речі: "" - порожній рядок це рядковий тип і зовсім не null-значення.

Тип змінної може бути встановлений у будь-якому місці JS-програми, на відміну від інших мов програмування, що дає додаткову гнучкість, але й можливість заплутатися – пам'ятайте це. До змінної, яка не створена, звернутися неможливо. Якщо потрібно створити тимчасову змінну, наприклад, лічильник циклу, потрібно записати перед нею префікс var:
for (var i = 0; i "10"); Найпростішим та найпоширенішим способом створення об'єкта String є використання таких операторів, як

Var myVariable = "Гарне пиво";

Наведений оператор надає рядок "Хороше пиво" рядковою змінною myVariable. Змінна myVariable розглядається як рядковий об'єкт і може використовувати будь-який із стандартних методів об'єкта String мови JavaScript. Оператор Var можна пропустити, як і говорилося раніше, він потрібен в основному для читабельності програми.

Для створення рядкових об'єктів можна використовувати конструктор String() з оператором new. Насправді об'єкт String не відноситься до мови JavaScript, а є вбудованим об'єктом браузера головним чином тому, що рядки створюються тоді, коли користувач їх потребує. Розглянемо приклад:

Var myVariable = новий String();

Цей оператор створює новий об'єкт - порожній рядок з ім'ям myVariable. Спочатку це порожній рядок (""), а значення властивості myVariable.length дорівнює 0.

Конструктор String() допускає передачу заданого рядка у вигляді аргументу:

Var myVariable = new String("Правильне пиво");

Строковий об'єкт може містити спеціальні символи, що управляють форматуванням рядків:

  • \n - символ нового рядка;
  • r - символ повернення каретки;
  • \f - код переходу на нову сторінку;
  • \xnn - подання символу у вигляді шістнадцяткового ASCII-коду nn;
  • \ b - код клавіші .
ці символи будуть правильно інтерпретовані лише у контейнерах та методах "Alert". Форматування для document.write() здійснюється іншими методами або тегами HTML.
Об'єкт String має лише одну властивість - length, значенням якого є кількість символів у рядку, що міститься в об'єкті. Методи об'єкта String можна розділити на дві категорії:
  • методи форматування HTML-документу;
  • методи обробки рядків.
Методи форматування документа застосовуються для виведення рядків у документ, а методи керування рядками – для перевірки та зміни вмісту об'єкта String.
Наведемо перелік методів: (літера Ф – методи форматування, а літера У – управління рядками)
Метод Опис
anchor() У Створює іменовану мітку, тобто. тег із вмісту об'єкта
big() Ф Укладає рядок у контейнер. . . для відображення великим шрифтом
blink() Ф Укладає рядок у контейнер. . . , щоб вона відображалася миготливою.
bold() Ф Укладає рядок у контейнер. . . , щоб вона відображалася жирним шрифтом.
charAt() У Повертає символ, що знаходиться у заданій позиції рядка
fixsed() Ф Укладає рядок у контейнер. . . , щоб вона відображалася шрифтом постійної ширини.
fontcolor() Ф Укладає рядок у контейнер. . . , щоб вона відображалася певним кольором.
fontsize() Ф Укладає рядок у контейнер. . . , щоб вона відображалася шрифтом певного розміру.
IndexOf() У Повертає індекс першого заданого символу, знайденого у рядку.
italics() Ф Укладає рядок у контейнер . . . щоб вона відображалася курсивом.
lastIndexOf() У Повертає індекс останнього заданого символу, знайденого у рядку.
link() У Створює тег гіперзв'язку . . . і поміщає до нього вміст об'єкта
small() Ф Укладає рядок у тег. . . , щоб вона відображалася меншим шрифтом.
strike() Ф Укладає рядок у контейнер. . . , щоб вона відображалася закресленою.
sub() Ф Укладає рядок у контейнер. . . , щоб вона відображалась як нижній індекс.
substring() У Повертає підрядок текстового рядка.
sup() Ф Укладає рядок у контейнер. . . , щоб вона відображалася як верхній індекс.
доLowerCase() У Перетворює всі літери рядка на малі
toUpperCase() У Перетворює всі літери рядка в великі

Числові змінні

Числові значення можуть бути цілими або числами з плаваючою точкою. Числа з плаваючою точкою називають дійсними чи речовими. До числових значень застосовні операції:

  • множення (*);
  • поділу (/);
  • додавання (+);
  • віднімання (-);
  • збільшення (++);
  • зменшення (--);
Крім того, використовують операції множення, поділу, додавання та віднімання у поєднанні з присвоєнням (*=, /=, +=, -=), а також методи об'єкту Math.

Булеви змінні

Булеві, чи логічні, змінні містять лише літеральні значення - true і false - і використовують у логічних виразахта операторів.
Для перевірки значення булевої змінної використовують і операцію логічної рівності:
booleanVar == true
хоча у разі така операція перевірки зайва. Для перевірки значень, які є істинними, використовують знак логічного заперечення (!). Наприклад, вираз! booleanVar поверне значення true, якщо значення booleanVar дорівнює false. Замість слів "true" і "false" можна використовувати числові значення "1" і "2", оскільки саме такбулеві значення представлені в пам'яті комп'ютера: 1 = true і 0 = false.

Змінні масиви

Змінні масиви містять упорядковані набори значень одного типу, для зручності представлені у вигляді однієї змінної. Багато стандартних об'єктів-властивостей документа в мові JavaScript, зокрема гіперзв'язку та мітки, є масивами. У мові JavaScript до елемента масиву слід звертатися за допомогою виразу:

ArrayName

Де arrayName - ім'я масиву, а index - числова змінна чи число, що задає позицію елемента в масиві. Наприклад, arrayName є першим елементом цього масиву. Індекси елементів масиву у мові JavaScript починаються з нуля. Елементи масиву можуть бути будь-якого типу, наприклад, рядками або булевими змінними. З іншого боку, за певних умов масив може містити елементи різних типів даних. У мові JavaScript масивистворюються за допомогою:

  • конструктора Array ();
  • конструктора Object();
  • конструктора, визначеного користувачем.
За допомогою конструктора Array() не лише створюють об'єкт array, а й надають початкові значення його елементам. Існує можливість додавати елементи масив динамічно - шляхом присвоєння певних значень елементам масиву. Допускається також "пропускати" елементи масиву та задавати їх у будь-якій послідовності. Для створення нового екземпляра об'єкта array конструктор Array() необхідно використовувати з оператором new. Наприклад, у сивому прикладі створюється масив з ім'ям arrayImg, що містить два елементи, кожен з яких є об'єктом String

Var path = "c:/images/" ,
arrayImg = новий Array();
arrayImg = path + "img1.gif";
arrayImg = path + "img2.gif";

При використанні конструктора Array() значення властивості length встановлюється автоматично. Тому після ініціалізації елементів масиву у наведеному прикладі вираз arrayImg.length повертає значення 2. Елементи масиву також можуть бути задані як параметри конструктора:

Var path = "c:/images/" ,
arrayImg = новий Array(path+"img1.gif", path+"img2.gif");

Даний вираз є скороченим записом попереднього прикладу.
У мові JavaScript можна створювати масив, це масив, в якому елементи мають різний тип даних:

Var myArray = новий Array(3.14, true, 85, date(), "word");

Створює масив, елемент myArray якого є числом з плаваючою комою, елемент myArray – булевим значенням, елемент myArray – об'єктом Date.
Розмір масиву і, отже, значення якості length об'єкта, створюваного конструктором Array(), залежить від максимального значенняіндексу, що застосовувався для завдання елемента масиву Наприклад:

Var myArray = новий Array;
myArray = "Це 21 елемент масиву";

Двадцять першому елементу масиву присвоюється рядкове значення "Це 21 елемент масиву", а значення властивості myArray.length дорівнює 21 незалежно від того, чи мають значення елементи масиву з індексом менше 20.
Значення властивості length об'єкта Array автоматично встановлюється при явному вказівці кількості елементів конструктора Array():

MyArray = новий Array(10);

Оператор створює масив з 10-ти елементів від 0 до 9. Значення властивості length масиву не можна встановити шляхом присвоювання, тому що length є властивістю лише для читання. Наприклад, щоб задати значення 10 для властивості length потрібно тільки визначити значення останнього, в даному випадку 9 елемента масиву:

MyArray = новий Array();
myArray = 0;

Крім того, існує можливість встановити значення елементів масиву при його конструюванні:

MyArray = новий Array(0,0,0,0,0,0);

Конструктор Object()

Поняття об'єкт та масив рівнозначні, хоча конструктори Object() та Array() працюють по-різному. Конструктору Object() неможливо передати кілька елементів масиву, тому такий вираз
var myObj = новий Object(value1, value2);
працювати не буде. Масиви, створювані з допомогою конструктора Object(), немає властивості length. Тому, створюючи масив у такий спосіб, слід або організовувати обхід цього масиву за допомогою циклу forі підрахувати елементи масиву, або жорстко задати довжину масиву як значення першого елемента (зазвичай так роблять моделюючи властивість length), а потім звертатися до нього в міру необхідності для перевірки розміру масиву, збільшення значення при додаванні нового елемента, а також як параметр циклу при циклічному зчитуванні чи зміни значень елементів. Такий об'єкт часто буває неприйнятним для випадків, коли вміст масиву має динамічно змінюватися, тому здебільшого користуються конструктором Array(). Значення індексів масивів, створюваних у конструкторі Object(), також розпочинаються з нуля. Для створення масиву за допомогою конструктора Object() прийнято використовувати запис:

Var myObj = новий Object();
myObj = 2; // задаємо розмірність масиву
myObj = "Перший елемент";
myObj = "Другий елемент";

Щоб дізнатися про розмір масиву, створеного подібним чином, необхідно звернутися до елемента myObj. Значенням властивості myObj.length є null, оскільки значення не визначено.

Перетворення рядків та чисел

Нарешті підійшли до найцікавішої теми. Річ у тім, що у мові JavaScript на відміну інших мов немає функцій типу Val() і Str(). Одного разу я бачив програму на мові JavaScript, автора не називатиму, де за допомогою різноманітних перетворень типів даних була спроба заплутати програму для "непросунутих" користувачів. Так ось, потрібно запам'ятати два правила:

  • Перетворення числа в рядок символів здійснюється шляхом додавання числового аргументу з рядковим, незалежно від перестановки доданків. Наприклад, якщо змінна varI=123, то перетворити змінну і отже її значення в рядок символів можна: varI = varI + "" або навпаки: varI = "" + varI. Якщо скласти не з порожнім рядком: varI = varI + "456", то результатом значення змінної varI стане "123456". Це справедливо і навпаки: varI = "456" + varI - результат: "456123";
  • Перетворення рядка в число проводиться шляхом віднімання одного операнда з іншого і незалежно від їх позиції. Наприклад, якщо змінна varI = "123", то перетворити її на число можна, якщо відняти з неї значення 0: varI = varI - 0, і відповідно значення змінної з рядкового типу перетворюється на числове: 123. При перестановці операндів відповідно знак числового значення зміниться на протилежний. На відміну від перетворення числа в рядок у діях віднімання не можна застосовувати буквені значення. Так якщо "JavaScript" + 10 перетвориться на varI == "JavaScript10", то операція типу varI = "JavaScript" - 10 видасть значення "NON" - тобто така операція не допустима. І ще, при відніманні рядкового значення з рядкового також відбувається перетворення: varI = "20" - "15", значенням змінної varI стане число 5.

Змінна – це іменований ділянку пам'яті, куди можна як зберегти деяку інформацію, і отримати її з неї.

Оголошення (створення) змінних здійснюється за допомогою ключового слова var.

// message – ім'я змінної var message;

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

Надання змінної значення здійснюється за допомогою оператора «=».

// наприклад, створимо змінну email і надамо їй рядок " [email protected]" var email = " [email protected]// встановимо змінної email нове значення email = " [email protected]";

Щоб отримати значення змінної досить просто звернутися до неї на ім'я.

// Наприклад, виведемо в консоль браузера значення змінної email: console.log (email);

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

Var price = 78.55, quantity = 10, message;

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

Var output = "успіх"; // Змінна має рядковий тип даних output = 28; // ця змінна, але вже має тип даних «число» output = true; // ця ж змінна, але вже зберігає булевське значення

Значення змінної можна змінювати необмежену кількість разів.

// Створена змінна age var age; // змінної age присвоєно значення 67 age = 67; // змінною age встановлено значення "Пенсійний вік" age = "Пенсійний вік"; // змінної age встановлено число 55 age = 55;

Хорошою практикою розробки клієнтських вважається використання певної змінної лише однієї типу даних, тобто. не записувати в змінну значення, що мають різні типиданих. Щоб зрозуміти який тип даних варто очікувати змінної рекомендується під час створення змінної її відразу ініціалізувати певним значенням.

Ім'я змінної можна складати з літер, цифр та символів $ та _. При цьому перший символ змінної не може бути цифрою. Крім цього як ім'я змінної не можна використовувати зарезервовані слова.

// Створення двох змінних, перша змінна має ім'я phone, друга - meassage; var phone, message;

Регістр літер у імені змінної має значення. Тобто, наприклад, змінна phone та Phone - це дві різні змінні.

Якщо строгий режим не використовується, створити змінну з початковим значенням можна і без ключового слова var.

Price = 250.00; // Створили змінну та ініціалізували її числом 250.00 percent = "20%"; // створили змінну та ініціалізували її рядком «20%»

Але створювати таким чином змінні не рекомендується.

Типи даних

У JavaScript типиданих можна поділити на примітивні та об'єктні.

Змінні, що містять примітивні типи даних, зберігають значення явно.

JavaScript виділяють 5 примітивних типів даних:

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

Якщо одній змінній надати значення іншій, яка містить примітивний тип даних, то вона отримає власну копію цього значення.

Var x = 77, y = x; x = 55; y; // 77

Змінні, що містять об'єкт, насправді зберігають не сам об'єкт, а посилання на нього.

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

// Приклад 1 (з типом даних «об'єкт») var coord1 = (x: 77, y: 100), coord2 = coord1; coord1.x = 55; // Встановимо властивості x об'єкта нове значення coord2.x; // 55, т.к. coord1 і coord2 містять посилання на той самий об'єкт // приклад 2 (з типом даних «масив») var coord1 = , coord2 = coord1; coord1 = 55; // Встановимо елементу з індексом 0 нове значення coord2; // 55, т.к. coord1 і coord2 містять посилання на той самий об'єкт // приклад 3 (з типом даних «дата») var date1 = new Date(2018,00,01), date2 = date1; date2 = date2.setDate(date2.getDate()+7); // збільшимо дату на 7 днів date1; // 07.01.2018, т.к. date1 і date2 містять посилання на один і той самий об'єкт

Число (number)

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

Var int = 5; // ціле число var float = 5.98; // дробове число

Формат представлення чисел у JavaScript здійснюється відповідно до стандарту IEEE 754-2008.

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

Var int = 010; // 8 int = 055; // 45 int = 0xFF; //255 int = 0xB8; // 184

Записувати числа можна в експоненційній формі:

Var num = 2e3; // Експонентний запис числа 2 * 10 ^ 3 (2000) num = 2e-3; // Експонентний запис числа 2*10^-3 (0,002) num = 3.2e3; //3200 num = 1.5e-2; // 0.015

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

  • Infinity (позитивна нескінченність);
  • -Infinity (негативна нескінченність);
  • NaN (Not a Number – не число).

Спеціальне значення Infinity означає дуже велике додатне число, тобто. число, яке не може бути представлене в JavaScript через те, що воно занадто велике.

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

Приклад виразів у результаті обчислення яких буде повернено спеціальні числові значення:

5/0; //Infinity -5/0; //-Infinity Math.pow (10,399); // Infinity (10 у ступені 399) Math.pow(10,399); //-Infinity (-10 у ступені 399)

Значення NaN повертається внаслідок виконання математичних операцій, які JavaScript не може обчислити.

5 - "Hi"; // NaN (від числа 5 відібрати рядок) 1000 / "20px"; // NaN (число поділити на рядок) true * "1rem"; // NaN (логічне значення true помножити на рядок)

При цьому дуже цікавим є те, що значення NaN JavaScript не дорівнює нічому включаючи себе.

NaN = NaN; // false NaN === NaN; //false

Логічний тип даних (Boolean)

Boolean – примітивний тип даних, який має лише два значення: true (істина) та false (брехня).

Var a = true; var b = false;

Рядок (String)

Рядок (String) – це тип даних, який використовується в JavaScript для представлення тексту.

Рядок JavaScript може складатися з 0 або більше символів.

Як формат рядка в JavaScript завжди використовується кодування Unicode.

Створення рядка (літерала рядка) виконується укладанням тексту в одинарні чи подвійні лапки .

"JavaScript"; "ECMAScript";

У JavaScript немає різниці між одинарними та подвійними лапками.

Але в деяких випадках є сенс використовувати саме одинарні лапки, а не подвійні і навпаки.

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

"ECMAScript"; // без екранування (з використанням одинарних лапок) "ECMAScript"; // з екрануванням

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

"Ця пропозиція.\nА це теж пропозиція, але вона буде починатися з нової лінії.";

З рядками можна зробити операцію складання (об'єднання) або іншими словами конкатенацію. Для цього використовується оператор "+". Смисл цієї операції полягає в приєднанні другого рядка до кінця першого.

"Я люблю" + "JavaScript"; // Я люблю JavaScript

Значення "undefined"

undefined - спеціальний примітивний тип даних, який має одне значення, рівне undefined.

Цей тип даних має оголошена змінна, якій ще не надано значення.

Var num; // undefined

Значення undefined також буде повернуто при зверненні до неіснуючої властивості об'єкта.

Var obj = (); // Порожній об'єкт obj.prop; // undefined

Значення "null"

null - спеціальний примітивний тип даних, який має одне значення, що дорівнює null.

null - це спеціальне значення, що має сенс «нічого» чи «невідоме значення», тобто. воно явно нічого не означає.

Об'єкт (Object)

Об'єкт - це структура даних, що складається з пар ім'я-значення.

Створення об'єкта за допомогою нотації літералу об'єкта здійснюється так:

( ім'я_1: значення_1, ім'я_2: значення_2, ім'я_3: значення_3, ... )

Як видно, ім'я від значення відокремлюється за допомогою двокрапки, а пари між собою за допомогою коми.

При цьому якщо значення пари виступає функція, то вона називається методом цього об'єкта. Решта пари, тобто. пари в яких значення не використовується функція, називаються властивостями об'єкта.

Іншими словами, об'єкт - це структура даних, що складається з властивостей та методів.

Var person = ( name: "Віталій", age: 27, getAge: function () ( return "Вік: " + this.age; ) )

Звернення до властивостей об'єкта виконується через точку або за допомогою скобкового запису.

// виведемо значення якості age в консоль браузера // 1 метод (через точку) console.log(person.age); // 2 спосіб (за допомогою дужок) console.log(person["age"]); // Викликаємо метод getAge; значення, яке він поверне, виведемо у консоль console.log(person.getAge());

Оператор typeof

Оператор типувикористовується для отримання інформації про тип даних виразу у вигляді рядка.

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

Typeof вираз

Синтаксис оператора typeof (з використанням круглих дужок):

Typeof(вираз)

Var name, age = 37, email = " [email protected]", isLicense = true, interest: null, lastExperience: ( period: "June 2011 - June 2018", place: "ISACA, Moscow", position: "Web designer" ), getExperience: function() ( return lastExperience.period + "(" + lastExperience.position + " - " + lastExperience.place + ")"; ); typeof name; // "undefined" typeof age; // "number" typeof isLicense; / "object" (1) typeof lastExperience; // "object" typeof getExperience; // "function" (2) /* (1) - це помилка, яка присутня в мові, починаючи з її першої реалізації; З метою збереження сумісності і це необхідно враховувати при написанні сценаріїв, null - це примітивний тип даних, він не є об'єктом */ /* (2) - це дуже зручно, що оператор typeof виділяє функції окремо, але функція в JavaScipt - це теж об'єкт, в цьому легко переконатися, якщо виконати наступну конструкцію: */ typeof getExperience.__proto__.__proto__ // "object" (прототипом функції є об'єкт)

Константи

З виходом ECMAScript 6 з'явилася можливість створювати константи. Це здійснюється за допомогою ключового слова const.

Const COLOR_RED = "#ff0000";

Константа – це змінна, значення якої захищене від зміни. Тобто. при спробі змінити значення буде кинуто помилку.

Const COLOR_RED = "#ff0000"; COLOR_RED = "#f44336"; // Uncaught TypeError: Assignment to constant variable.

Якщо, наприклад, константа містить об'єкт, він не може бути змінений, а точніше посилання на нього. Але властивості цього об'єкта можна змінити.

Const COLORS = ( red: "#ff0000", green: "#00ff00", blue: "#00ff00") COLORS = ["#ff0000", "#00ff00", "#00ff00"]; // Uncaught TypeError: Assignment to constant variable. COLORS.green = "#4caf50";

Змінні JavaScript є контейнерами для зберігання різної інформації.

Змінні JavaScript

JavaScript змінні є "контейнерами", в які Ви можете завантажувати різну інформацію, а пізніше витягати її назад.

Кожна змінна JavaScript повинна мати власне унікальне ім'я, яке може починатися з латинської літери або символу "_".

Зверніть увагу: ім'я змінних JavaScript не може починатися з цифр.

Зверніть увагу: оскільки JavaScript чутливий до регістру, змінні з однаковими іменами, написаними в різному регістрі (наприклад var і VAR), будуть різними змінними.

Створення змінних

Створення змінних JavaScript часто називають "оголошенням"змінних.

Змінні JavaScript оголошуються за допомогою команди var .

/ / Створюємо змінну з ім'ям ex1 var ex1; / / Створюємо змінну з ім'ям ex2 var ex2;

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

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

//Створюємо змінну з ім'ям ex1, що містить значення 4 var ex1=4; //Створюємо змінну з ім'ям ex2, що містить значення 5 var ex2=5;

Щоб отримати значення зі створеної раніше змінної, необхідно звернутися до її імені.

У наступному прикладі ми будемо витягувати вміст змінних і відразу виводити його на сторінку за допомогою document.write.

//Запишемо число 4 змінну ex1 var ex1=4; //Запишемо число 5 змінну ex2 var ex2=5; //Виведемо вміст змінної ex1 на сторінку document.write(ex1+"
"); //Виведемо вміст змінної ex2 document.write(ex2+"
"); //Змінимо вміст змінної ex2 ex2=200; //Виведемо новий вміст змінної ex2 document.write(ex2);

Швидкий перегляд

Рядкові змінні

Крім чисел можна зберігати в змінних довільний текст. Змінні, які зберігають текст, називаються рядковими змінними .

При записі тексту в змінну обов'язково укладайте його в подвійні (") або одинарні лапки (").

//Запишемо в змінний ex рядок "Привіт усім!" var ex="Привіт усім!"; //Виведемо значення змінної ex на сторінку document.write(ex);

Швидкий перегляд

Визначення змінних з var та без нього

JavaScript Ви можете визначати змінні з var і без нього.

//Створимо нову змінну з var var ex = 123; // Створимо нову змінну без var ex2 = 20;

Вам може здатися, що оголошення змінних з var і без нього завжди призводять до однакового результату, але це дійсно так тільки коли оголошення відбувається в глобальному контексті (тобто за межами всіх функцій).

Якщо ж оголошення відбувається в локальному контексті (тобто в тілі якоїсь функції) оголошення з var створює локальну змінну (тобто змінну, яка буде доступна тільки в тілі даної функції і після виконання функції буде знищена), оголошення без var створює глобальну змінну (тобто змінну, яка буде доступна іншим функціям усередині цього скрипту).

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

Про видалення та перевизначення змінних

Перевизначаючи змінні Ви не переть значення, яке зберігаються в них.

Var ex = 123; var ex; document.write(ex); // Виведе 123

Якщо Ви бажаєте видалити змінну в JavaScript і вона не була оголошена за допомогою var, Ви можете використовувати оператор delete.

Ex = 123; delete ex;

Оператор delete не може видалити змінні оголошені за допомогою var, тому якщо змінна була оголошена за допомогою var, то єдиний спосіб видалити її - присвоїти їй значення null або undefined.

Var ex = 123; ex = null; // або ex=undefined

Зробіть самі

Завдання 1 . Виправте помилки в коді нижче:

Завдання 1

var 33var = 33; document.write(33var); document.write("
"); var str1=Привіт усім!; document.write(str1); document.write("
"); var vaR = 288; document.write(var); document.write("
");

Завдання 2 . У зовнішньому файлі secred1.js міститься змінні sec1, sec2, sec3 і sec4, які містять літери кодового слова (не по порядку). Підключіть зовнішній файл та дізнайтеся кодове слово шляхом виведення значень змінних на сторінку.

Останнє оновлення: 05.04.2018

Для зберігання даних у програмі використовуються змінні. Змінні призначені для зберігання будь-яких тимчасових даних або даних, які в процесі роботи можуть змінювати своє значення. Для створення змінних застосовуються ключові слова var та let. Наприклад, оголосимо змінну myIncome:

Var myIncome; // Інший варіант let myIncome2;

Кожна змінна має ім'я. Ім'я є довільним набором алфавітно-цифрових символів, символу підкреслення (_) або символу долара ($), причому назви не повинні починатися з цифрових символів. Тобто ми можемо використовувати у назві букви, цифри, підкреслення. Однак усі інші символи заборонені.

Наприклад, правильні назви змінних:

$commision someVariable product_Store income2 myIncome_from_deposit

Наступні назви є некоректними та не можуть використовуватися:

222lol @someVariable my%percent

Також не можна давати змінним такі імена, які збігаються із зарезервованими ключовими словами. У JavaScript не так багато ключових слів, тому дане правило не складно дотримуватися. Наприклад, наступна назва буде некоректною, тому що for - ключове слово в JavaScript:

Var for;

Список зарезервованих слів у JavaScript:

abstract, boolean, break, byte, case, catch, char, class, const, continue, debugger, default, delete, do, double, else, enum, export, extends, false, final, final, float, for, function, goto, if, implements, import, in, instanceof, int, inteface, довгий, природний, новий, null, package, private, protected, public, return, short, static, super, switch, synchronized, this, throw, throws, transient, true, try, typeof, var, volatile, void, while, with

При назві змінних треба враховувати, що JavaScript є реєстрозалежною мовою, тобто в наступному коді оголошено дві різні змінні:

Var myIncome; var MyIncome;

Через кому можна визначити відразу кілька змінних:

Var myIncome, відсоток, sum; let a, b, c;

За допомогою знака одно (який ще називають оператором присвоювання ) можна привласнити змінної будь-яке значення:

Var income = 300; let price = 76;

Процес присвоєння змінної початкового значення називається ініціалізацією.

Тепер змінна income зберігатиме число 300, а змінна price - число 76.

Відмінною рисою змінних є те, що ми можемо змінити їхнє значення:

Var income = 300; income = 400; console.log(income); let price = 76; price = 54; console.log(price);

Константи

За допомогою ключового слова const можна визначити константу, яка, як і змінна, зберігає значення, проте це значення не може бути змінено.

Const rate = 10;

Якщо ми спробуємо змінити її значення, ми зіткнемося з помилкою:

Const rate = 10; rate = 23; // помилка, rate - константа, тому ми можемо змінити її значення

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

Const rate; // помилка, rate не ініціалізована



Розповісти друзям