Вступ до JavaScript

Розгляньмо, що такого особливого в мові JavaScript, чого ми можемо досягти за її допомогою та які ще технології пов’язані з нею.

Що таке JavaScript?

JavaScript було створено для того, щоб “оживити вебсторінки”.

Програми цією мовою називаються скриптами. Їх можна писати прямо в коді HTML-сторінок і вони автоматично виконуватимуться при їх завантаженні.

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

У цьому плані JavaScript дуже відрізняється від іншої мови програмування — Java.

Коли мову JavaScript було створено, спочатку вона мала іншу назву: “LiveScript”. Тоді була дуже популярна мова програмування Java, тому було вирішено, що позиціонування нової мови як “молодшої сестри” Java допоможе в її популяризації.

Згодом JavaScript стала повністю незалежною мовою програмування зі своєю специфікацією ECMAScript і зараз не має нічого спільного з Java.

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

Браузер має вбудований рушій, який інколи називають “віртуальною машиною JavaScript”.

Різні рушії мають різні “кодові назви”. Наприклад:

V8 – в Chrome, Opera та Edge.
SpiderMonkey – в Firefox.
…Є також інші кодові назви як “Chakra” для IE, “JavaScriptCore”, “Nitro” і “SquirrelFish” для Safari, та інші.

Терміни вище добре було б запам’ятати, оскільки вони використовуються в статтях розробників на просторах інтернету. Ми також будемо їх використовувати. Наприклад, якщо “можливість X підтримується в V8”, то, імовірно, вона працюватиме в Chrome, Opera та Edge.

Рушії складні. Але принцип роботи простий.

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

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

Що може вбудований у браузер JavaScript?

Сучасний JavaScript – це “безпечна” мова програмування. Вона не надає низькорівневого доступу до пам’яті чи процесора, оскільки була створена для браузерів, які цього не потребують.

Можливості JavaScript значно залежать від середовища, у якому виконується скрипт. Наприклад, Node.js підтримує функції, які дозволяють JavaScript читати/записувати довільні файли, здійснювати мережеві запити тощо.

Вбудована в браузер JavaScript може робити все, що пов’язано з управлінням вебсторінками, взаємодією з користувачем та вебсервером.

Наприклад, JavaScript може:

Додавати новий HTML-код на сторінку, змінювати наявний вміст, змінювати стилі.
Реагувати на дії користувача, опрацьовувати натискання миші, переміщення вказівника, натискання на клавіші клавіатури.
Надсилати запити мережею до віддалених серверів, викачувати та надсилати файли (так звані технології AJAX і COMET).
Отримувати та надсилати куки, ставити запитання відвідувачам, показувати повідомлення.
Запам’ятовувати дані на стороні клієнта (“local storage”), які будуть доступні в майбутніх сесіях на цьому вебсайті.

Що НЕ може JavaScript?

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

Приклади таких обмежень:

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

Сучасні браузери дозволяють працювати з файлами, але доступ до них обмежений і надається тільки тоді, коли користувач виконав відповідні дії, наприклад, перетягнув файл у вікно браузера чи вибрав його через теґ <input>.

Є шляхи взаємодії з камерою/мікрофоном та іншими пристроями, але для цього потрібен явний дозвіл користувача. Тому сторінка з JavaScript не може нишком увімкнути вебкамеру, спостерігати за оточенням і надсилати інформацію до СБУ.
Різні вкладки/вікна зазвичай не знають одне про одного. Іноді це можливо, наприклад, коли одне вікно використовує JavaScript, щоб відкрити інше. Але навіть у такому випадку JavaScript з однієї сторінки не має доступу до іншої, якщо вони з різних сайтів (мають різні домени, протоколи чи порти).

Це називається “Політикою того ж походження (Same Origin Policy)”. Щоб обійти це обмеження, обидві сторінки мають погодитися на обмін даними та містити спеціальний JavaScript-код, який здійснюватиме це. Ми розглянемо цю тему в посібнику.

Знову-таки, це обмеження існує задля безпеки користувача. Сторінка за адресою http://anysite.com, яку відкрив користувач, не повинна мати доступ до іншої вкладки браузера з URL-адресою http://gmail.com і викрадати звідти інформацію.
JavaScript може легко спілкуватися мережею з сервером, від якого отримана поточна сторінка. Але здатність скрипту отримувати дані з інших сайтів/доменів обмежена. Такі запити можливі, але потребують спеціальної згоди (вираженої в HTTP-заголовках) від віддаленого сервера. Це також зроблено задля безпеки.

Таких обмежень немає, якщо JavaScript використовується за межами браузера, наприклад, на сервері. Сучасні браузери дозволяють установлювати плагіни/розширення, які мають розширені можливості, проте вимагають розширених прав.

Що робить мову JavaScript унікальною?

Є принаймні три чудові особливості JavaScript:

Цілковита інтеграція з HTML/CSS.
Прості речі робляться просто.
Підтримується всіма сучасними браузерами та є типово увімкненою.

JavaScript – це єдина браузерна технологія, яка суміщає ці три речі.

Це й робить її унікальною. Ось чому JavaScript – найбільш поширений засіб створення браузерних інтерфейсів.

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

Мови “над” JavaScript

Синтаксис JavaScript не задовольняє потреби кожного. Різні люди хочуть різних функцій.

Цього слід очікувати, тому що проєкти та вимоги різні для кожного.

Останнім часом з’явилося безліч нових мов, які транспілюються (конвертуються) в JavaScript перед виконанням у браузері.

Сучасні інструменти роблять транспіляцію дуже швидкою та прозорою, дозволяючи розробникам писати код іншою мовою й автоматично конвертувати його “під капотом”.

Приклади таких мов:

CoffeeScript – це “синтаксичний цукор” для JavaScript. Вона вводить коротший синтаксис, дозволяючи нам писати прозорий та точний код. Зазвичай це до вподоби програмістам, які пишуть на Ruby.
TypeScript зосереджена на додаванні “строгої типізації даних” для спрощення розробки та підтримки складних систем. Розробляється Microsoft.
Flow також додає типізацію даних, але іншим способом. Розробляється Facebook.
Dart – це автономна мова, яка має власний рушій, що працює в не браузерних середовищах (як-от мобільні застосунки), але також може транспілюватися в JavaScript. Розробляється Google.
Brython – це транспілятор коду Python у JavaScript, що дозволяє писати застосунки на чистому Python без використання JavaScript.
Kotlin – це сучасна, лаконічна та безпечна мова програмування, яку можна компілювати для браузера або NodeJS.

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

Підсумки

Мова JavaScript спочатку була створена лише як мова для браузера, але зараз її також використовують в інших середовищах.
Сьогодні JavaScript вважається найбільш поширеною мовою для браузера, яка повністю інтегрована з HTML/CSS.
Існує багато мов, які “транспілюються” в JavaScript і надають певні функції. Рекомендується переглянути їх, хоча б мигцем, після освоєння JavaScript.