Category: JavaScript
Класи в JavaScript є однією з найпопулярніших функцій, і сьогодні ми зробимо їх короткий огляд. Ми розглянемо такі частини і концепції, як конструктор, властивості і методи класу, успадкування, суперклас і підкласи, а також способи перевизначення властивостей і методів конструктора і класу. Створення об’єктів по-старому (за допомогою конструкторів функцій) Як розробники створювали об’єкти до введення класів в JavaScript? Вони використовували конструктори функцій. Потім, коли потрібно було додати деякі властивості або методи до об’єкта, вони...
Об’єктно-орієнтоване програмування – це популярний стиль програмування, який був впроваджений в JavaScript на самих ранніх етапах. Зараз багато вбудованих функцій та методів JavaScript написані в об’єктно-орієнтованому стилі. Об’єктно-орієнтоване програмування в JavaScript сильно відрізняється від об’єктно-орієнтованого програмування в інших мовах. І в сьогоднішній статті ми коротко розглянемо основи об’єктно-орієнтованого програмування (ООП) в JavaScript. Що таке об’єктно-орієнтоване програмування в JavaScript Об’єктно-орієнтоване програмування – це дві складові: створення окремих об’єктів із загального об’єкта та успадкування. У...
Якщо ви використовуєте AJAX на своєму сайті, майте на увазі, що такі події, як клік (click), надсилання (submit), наведення (hover), можуть не працювати, якщо ви не прикріпите їх правильно. У сьогоднішній статті ми розглянемо практичне рішення проблеми, коли не спрацьовують події в jQuery після динамічної зміни сторінки (або AJAX). Опис задачі Припустимо, у нас є блоки з заголовком і прихованим контентом в тегові <p>. По кліку на заголовку, прихований контент показується/ховається за допомогою...
У сьогоднішній статті ми розглянемо регулярні вирази в JavaScript, а також побачимо практичні приклади використання регулярних виразів в JavaScript скриптах. Регулярні вирази бувають досить корисними, і їх можна використовувати практично у всіх своїх скриптах. Але, для цього потрібна практика, тому нижче представлені основні приклади регулярних виразів, які допоможуть вам в цьому. Шпаргалка регулярних виразів в JavaScript Скорочений запис пошуку символів let regex; regex = /\d/; // відповідає будь-якій цифрі regex = /\D/;...
Коли розробник пише скрипти в строгому режимі, це полегшує йому створення «безпечного» JavaScript. За замовчуванням JavaScript дозволяє програмісту писати код трохи недбало, наприклад, не оголошувати змінні за допомогою var при першій їх появі. Хоча це може здатися зручним для деяких розробників, такий підхід може бути причиною багатьох помилок, коли ім’я змінної написано з помилкою або випадково зазначено поза її області дії. Програмісти люблять змушувати комп’ютер робити за них нудні речі і автоматично перевіряти їх роботу...
Однією з найцікавіших речей в JavaScript є отримання доступу до дати і часу, та подальша робота з ними. Насправді це дуже легко, і в сьогоднішній статті ми розглянемо цей процес дуже детально. В JavaScript вже є вбудований об’єкт, який отримує дату і час – все, що вам потрібно зробити, це просто використовувати його! Об’єкт дати Date() в JavaScript Щоб використовувати цей об’єкт дати, ви повинні спочатку створити його екземпляр. Для цього виконайте наступне:...
Коли ви пишете додаток на JavaScript, дуже корисно використовувати налагоджувач (або дебаґер, від англ. debugger), тобто, програму, яка призначена для пошуку помилок в інших програмах. Всі браузери поставляються з подібною програмою, яка виконує функції налагоджувача, — мова йде про Консоль (Console). Тут ви знайдете всі помилки, які виникають при взаємодії браузера з сайтом. Наприклад, тут ви можете побачити недоступні ресурси сайту (які повертають 404 помилку), помилки в JavaScript коді та масу інших корисних даних. Крім...
У попередніх статтях категорії Уроки JavaScript ми розглянули основні принципи DOM, дізналися, як можна взаємодіяти і маніпулювати елементами DOM за допомогою простого JavaScript. У цій статті ми трохи розширимо цю тему і розглянемо приклади маніпулювання елементами DOM за допомогою потужної бібліотеки JavaScript – jQuery. Бібліотека jQuery має потужні інструменти для знаходження елементів і роботи з ними для досягнення потрібної мети. За допомогою методів jQuery завдання обходу і маніпуляції елементами DOM вирішуються досить простими та інтуїтивно...
Досить часто при написанні коду JavaScript вам потрібно перевіряти, що DOM повністю завантажений. Це робиться для того, щоб бути впевненим, що всі елементи DOM доступні, і ви можете отримати доступ до цих елементів і вже можете ними маніпулювати. Всякий раз, коли ви використовуєте JavaScript для маніпулювання вашою сторінкою, вам потрібно дочекатися події готовності документа. Подія готовності документа сигналізує про завантаження DOM сторінки, після якого ви вже можете маніпулювати ним. Зверніть увагу, що подія готовності документа...
Діалогові вікна дозволяють взаємодіяти з користувачем і працювати з даними, які отримані від цього користувача. Ви, безсумнівно, бачили їх, використовували їх і вони вас завжди дратували, коли вони з’являлися на якомусь сайті. Тепер прийшов час навчитися самому їх створювати. За допомогою діалогових вікон JavaScript ви можете взаємодіяти з відвідувачем вашого сайту досить простим і тривіальним способом. Наприклад, ви можете запитувати ім’я відвідувача, а потім якось його відображати на сайті. Або ви можете зробити діалогове вікно...
В попередній статті ми розглянули основні події в браузері. Сьогодні ми розширимо цю тему, та коротко розглянемо Об’єкт події (Event Object), який є одним з важливих аспектів обробки подій. Всякий раз, коли ви прив’язуєте функцію до події, тобто коли ви створюєте обробник подій, функція буде передана об’єкту. Це трапляється на самому початку, тому нам не потрібно робити для цього додаткових кроків. Цей об’єкт події містить різноманітну інформацію про подію, яка тільки що відбулася; він також...
Перш, ніж ми перейдемо до розгляду даної теми, важливо зробити акцент на одній речі: дерево DOM і мова JavaScript – це дві різні сутності. Події браузера є частиною API DOM, але вони не є частиною JavaScript. Події браузера є основою будь-якого веб-додатку і вони дуже часто використовуються в JavaScript. Саме через ці події ми визначаємо те, що має статися. Якщо у вашому документі є кнопка, і вам потрібна перевірка форми при її натисканні, ви повинні...
Минулого разу ми розглянули деякі основи JavaScript і торкнулися різних аспектів об’єктної моделі документа, в тому числі способи доступу до вузлів і переміщення по DOM. Сьогодні ми поговоримо про те, як маніпулювати елементами в DOM. Елементи для маніпулювання В останньому уроці ми розглянули кроки, пов’язані з доступом до колекції вузлів DOM або окремого вузла DOM. Справжня магія виникає, коли ми потім маніпулюємо певними властивостями, що призводить до так званої «поведінки». Кожен окремий вузол...
У цій статті ми продовжимо говорити про об’єктну модель документів (DOM) і розглянемо основні способи доступу до неї за допомогою JavaScript. Давайте для прикладу візьмемо невеликий HTML документ, в якому є абзац та невпорядкований список: <!DOCTYPE html> <html lang="uk-UA"> <head> <meta charset="UTF-8"> <title>JavaScript – доступ до вузлів DOM</title> </head> <body> <p id="paragraph">Перший тестовий параграф</p> <ul> <li>Пункт 1 невпорядкованого списку</li> <li>Пункт 2 невпорядкованого списку</li> <li>Пункт 3 невпорядкованого списку</li> <li>Пункт 4 невпорядкованого списку</li> <li>Пункт 5...
В цьому уроці ми розглянемо базові поняття про деякі основи JavaScript. Сьогодні ми приділимо увагу різним типам даних JavaScript, визначенню функцій, побачимо, що таке масиви і об’єкти, познайомимося з операторами в JavaScript, умовою if/else, а також з циклами for і while. В JavaScript ви можете мати різні типи значень. Існують такі типи даних: числа, рядки, логічні значення (boolean), об’єкти, невизначені та нульові (NULL): Однорядкові коментарі пишуться з використанням двох косих рисок (//), весь...