JavaScript
| JavaScript | |
|---|---|
| Парадигма | імперативна, елементи функціональної, об'єктно-орієнтована (прототип-орієнтована) |
| Дата появи | 1995 |
| Творці | Брендан Айк |
| Розробник | Netscape Communications Corporation, Mozilla Foundation |
| Останній реліз | ECMAScript 2018[1] (червень 2018) |
| Тестова версія | (27 липня 2010) |
| Система типізації | динамічна, качина |
| Основні реалізації | V8, SpiderMonkey, Rhino, KJS, Carakan, Chakra (Microsoft) |
| Під впливом від | Scheme, Self, Java, C, Python |
| Вплинула на | ActionScript, CoffeeScript, Dart, JScript .NET, Objective-J, QML, TypeScript, LiveScript |
| Звичайні розширення файлів | .js[2] або .mjs[2] |
| Вебсайт | ecma-international.org/publications-and-standards/standards/ecma-262/ |
| Розширення: | .js |
|---|---|
| MIME-тип: | |
| Узагальнений ідентифікатор типу: | com.netscape.javascript-source[4] |
| Тип формату: | текстовий файл |
| Сайт: | ecma-international.org/publications-and-standards/standards/ecma-262/(англ.) |
JavaScript (JS) — динамічна, об'єктно-орієнтована[5] прототипна мова програмування. Реалізація стандарту ECMAScript. Найчастіше використовується для створення сценаріїв веб-сторінок, що надає можливість на боці клієнта (пристрої кінцевого користувача) взаємодіяти з користувачем, керувати браузером, асинхронно обмінюватися даними з сервером, змінювати структуру та зовнішній вигляд веб-сторінки.
JavaScript класифікують як прототипну (підмножина об'єктно-орієнтованої), скриптову мову програмування з динамічною типізацією. Окрім прототипної, JavaScript також частково підтримує інші парадигми програмування (імперативну та частково функціональну) і деякі відповідні архітектурні властивості, зокрема: динамічна та слабка типізація, автоматичне керування пам'яттю, прототипне наслідування, функції як об'єкти першого класу.
Застосування
Мова JavaScript використовується для:
- написання сценаріїв веб-сторінок для надання їм інтерактивності;
- створення односторінкових веб-застосунків (React, AngularJS, Vue.js);
- програмування на боці сервера (Node.js(Express.js));
- стаціонарних застосунків (Electron, NW.js);
- мобільних застосунків (React Native, Cordova);
- сценаріїв в прикладних програмах (наприклад, в програмах зі складу Adobe Creative Suite чи Apache JMeter);
- всередині PDF-документів тощо.
Незважаючи на схожість назв, мови Java та JavaScript є двома різними мовами, що мають відмінну семантику, хоча й мають схожі риси в стандартних бібліотеках та правилах іменування. Синтаксис обох мов отриманий «у спадок» від мови С, але семантика та дизайн JavaScript є результатом впливу мов Self та Scheme.[6]
Історія
Поява в Netscape
1995 року компанія Netscape поставила завдання вбудувати мову програмування Scheme чи «якусь схожу» в браузер Netscape. Для цього був запрошений Брендан Айк, американський розробник, що спеціалізувався на системному програмуванні. Також, для прискорення розробки, Netscape почали співробітництво з компанією Sun Microsystems.
З часом, концепція розроблюваної мови програмування була розширена до можливості використання безпосередньо в HTML-коді сторінки. Компанії мали на меті створити мову, що могла зв'язати різні частини веб-сайтів: зображень, Java-аплетів, об'єктної моделі документа. Ця мова повинна була стати зручною для веб-дизайнерів та некваліфікованих програмістів. Робочою назвою нової мови була Mocha, яка була змінена на LiveScript в перших двох бета-версіях браузера Netscape 2.0. А дещо пізніше, користуючись популярністю бренду Java, LiveScript був перейменований на JavaScript і третя бета-версія (2.0B3) Netscape 2.0 вже вийшла з сучасною назвою[7][8]. Для цього була придбана відповідна ліцензія у компанії Sun Microsystems, що володіла брендом Java.
1992 року компанією Nombas була розроблена скриптова мова програмування Cmm (англ. С-minus-minus, гра слів навколо мови С++), яка пізніше була перейменована на ScriptEase та могла вбудовуватися в веб-сторінки. Існує хибна думка, що JavaScript був створений під впливом Cmm. Насправді, Брендан Айк ніколи не чув про Cmm до того, як він створив LiveScript[9]. Пізніше, Nombas зупинили розробку Cmm та почали використовувати JavaScript, а згодом брали участь у групі зі стандартизації JavaScript.
Стандартизація
У листопаді 1996 року Netscape заявила, що відправила JavaScript в організацію Ecma International для розгляду мови як промислового стандарту. В результаті подальшої роботи з'явилась стандартизована мова з назвою ECMAScript. У червні 1997 року, Ecma International опублікувала першу редакцію специфікації ECMA-262. Рік по тому, у червні 1998 року, щоб адаптувати специфікацію до стандарту ISO/IEC-16262, були внесені деякі зміни і випущена друга редакція. Третя редакція побачила світ в грудні 1999 року.[10]
Четверта версія стандарту ECMAScript так і не була закінчена і четверта редакція не вийшла[11]. Тим не менш, п'ята редакція з'явилася в грудні 2009 року.
У червні 2015 року[12] вийшла шоста версія, починаючи з якої комітет ECMAScript прийняв рішення перейти на щорічні оновлення і нова версія отримала назву ES2015. Вона отримала цілу низку нововведень, серед яких: об'єкт Promise для зручного асинхронного виконування коду, деструктуруюче присвоювання, стрілочні функції, функції-генератори, шаблонні рядки, оператори оголошення змінних let та const тощо.
Версія ES2016 вийшла у червні 2016 року, серед нововведень оператор піднесення до степеня ** та метод Array.prototype.includes, який перевіряє, чи міститься переданий аргумент в масиві.
Версія ES2017, що вийшла в червні 2017 року і на сьогодні є актуальною версією стандарту додала можливість використання асихронних функцій, «висячих» ком в параметрах функцій, об'єкт Atomics, декількох нових методів для роботи з рядками.
Актуальний стан
JavaScript, наразі, є однією з найпопулярніших мов програмування в інтернеті[13]. Але спочатку багато професійних програмістів скептично ставилися до мови, цільова аудиторія якої складалася з програмістів-любителів[14]. Поява AJAX змінила ситуацію та повернула увагу професійної спільноти до мови, а подальші модифікації мови за стандартами ES2015 та ES2017 внесли багато корисних можливостей, яких не вистачало для ефективного програмування. В результаті, були розроблені та покращені багато практик використання JavaScript (зокрема, тестування та налагодження), створені бібліотеки та фреймворки, поширилося використання JavaScript поза браузером.
Опис
JavaScript має низку властивостей об'єктно-орієнтованої мови, але завдяки концепції прототипів підтримка об'єктів в ній відрізняється від традиційних мов ООП. Крім того, JavaScript має кілька властивостей, притаманних функціональним мовам, — функції як об'єкти першого класу, об'єкти як списки, каррінг, анонімні функції, замикання (closures) — що додає мові додаткову гнучкість.
JavaScript має C-подібний синтаксис, але в порівнянні з мовою C має такі корінні відмінності:
- об'єкти, з можливістю інтроспекції і динамічної зміни типу через механізм прототипів
- функції як об'єкти першого класу
- обробка винятків
- автоматичне приведення типів
- автоматичне збирання сміття
- анонімні функції
JavaScript містить декілька вбудованих об'єктів: Global, Object, Error, Function, Array, String, Boolean, Number, Math, Date, RegExp. Крім того, JavaScript містить набір вбудованих операцій, які, грубо кажучи, не обов'язково є функціями або методами, а також набір вбудованих операторів, що управляють логікою виконання програм. Синтаксис JavaScript в основному відповідає синтаксису мови Java (тобто, зрештою, успадкований від C), але спрощений порівняно з ним, щоб зробити мову сценаріїв легкою для вивчення. Так, приміром, декларація змінної не містить її типу, властивості також не мають типів, а декларація функції може стояти в тексті програми після неї.
Семантика мови схожа з семантикою мови Self.
Приклад оголошення і використання класу в JavaScript:
class MyClass {
constructor () {
this.myValue1 = 1;
this.myValue2 = 2;
}
}
const mc = new MyClass();
mc.myValue1 = mc.myValue2 * 2;
Одна з популярних технологій, що дозволила зробити сторінки динамічнішими і забезпечити нові можливості — це динамічне завантаження і вставка даних в документ, що отримала назву AJAX.
Використання в HTML
При використанні в рамках технології DHTML JavaScript код включається в HTML-код сторінки і виконується інтерпретатором, вбудованим в браузер. Код JavaScript вставляється в теги <script></script> хоча в більшості браузерів мова сценаріїв за умовчанням саме JavaScript.
Скрипт, що виводить модальне вікно з класичним написом «Hello, World!» усередині браузера:
<script>
alert("Hello, World!");
</script>
Є ще одна можливість підключення JavaScript — написати скрипт окремим файлом, та підключити його за допомогою конструкції:
<script src="text/javascript">//Шлях_до_файла_зі_скриптом
</script>
Слідуючій концепції інтеграції JavaScript в існуючі системи, браузери підтримують включення скрипту, наприклад, в значення атрибуту події:
<a href="delete.php" onclick="return confirm('Ви впевнені?');">Видалити</a>
Тут, після натискання на посилання, функція confirm('Ви впевнені?'); викликає модальне вікно з написом «Ви впевнені?», а return false блокує перехід за посиланням. Зрозуміло, цей код працюватиме тільки якщо в браузері є та увімкнена підтримка JavaScript, інакше перехід за посиланням відбудеться без попередження.
Асинхронні скрипти: defer/async
Спеціальні атрибути async і defer використовуються для того, щоб поки вантажиться зовнішній скрипт — браузер показав іншу (наступну за ним) частину сторінки. Без них цього не відбувається.
Атрибут async
Підтримується всіма браузерами, крім IE9-. Скрипт виконується повністю асинхронно. Тобто, при виявленні <script async src = "..."> браузер не зупиняє обробку сторінки, а спокійно працює далі. Коли скрипт буде завантажений — він виконається.
Атрибут defer
Підтримується всіма браузерами, включаючи самі старі IE. Скрипт також виконується асинхронно, не змушує чекати сторінку, але є дві відмінності від async.
Перше — браузер гарантує, що відносний порядок скриптів з defer буде збережений.
Тобто, в такому коді (з async) першим працюватиме той скрипт, котрий швидше завантажиться.
<script src="1.js" async></script>
<script src="2.js" async></script>
А в такому коді (з defer) першим спрацює завжди 1.js, а скрипт 2.js, навіть якщо завантажився раніше, буде його чекати.
<script src = "1.js" defer> </ script> <script src = "2.js" defer> </ script>
Тому атрибут deferвикористовують в тих випадках, коли другий скрипт 2.js залежить від першого 1.js, наприклад — використовує щось, описане першим скриптом.
Друга відмінність — скрипт з defer спрацює, коли весь HTML-документ буде оброблений браузером.
Наприклад, якщо документ досить великий …
<script src = "async.js" async> </ script> <script src = "defer.js" defer> </ script>
… Той скрипт async.js виконається, як тільки завантажиться — можливо, до того, як весь документ готовий. А defer.js почекає готовності всього документа.
Це буває зручно, коли ми в скрипті хочемо працювати з документом, і повинні бути впевнені, що він цілком отриманий.
Відлагодження
При розробці великих і нетривіальних веб-застосунків з використанням JavaScript, критично важливим є доступ до інструментів відлагодження. Оскільки браузери, від різних виробників, дещо відрізняються у поведінці JavaScript і реалізації Об'єктної моделі документа, необхідно мати відлагоджувач для кожного браузера, якщо веб-застосування орієнтовано на нього.
На даний час Firefox, Opera, Google Chrome, Edge та Safari мають зневаджувачі для себе.
Також існують такі корисні інструменти, як:
- ESLint — перевірка якості коду, що сканує JavaScript програму, шукаючи проблеми коду;
- Prettier — автоматичне форматування коду у коректний вигляд;
- Babel — транспайлер Javascipt коду до старіших версій стандартів ECMAScript, який допомагає розробникам використовувати найновіші можливості мови для оточення, що не встигло реалізувати останній стандарт.
Оскільки JavaScript є інтерпретатором, без строгої типізації, і може виконуватися в різних середовищах, кожне зі своїми власними особливостями сумісності, програміст має бути уважним, і повинен перевіряти, що його код виконується як очікується в широкому переліку можливих конфігурацій.
Кожен блок сценарію інтерпретатор розбирає окремо. На веб-сторінках, коли треба комбінувати блоки JavaScript та HTML, синтаксичні помилки знайти легше, якщо тримати функції сценарію в окремому блоці коду, або (ще краще) використовувати багато малих пов'язаних .js файлів. В такий спосіб синтаксична помилка не спричинятиме «падіння» цілої сторінки, і можна надати допомогу, елегантно вийшовши зі сторінки.
Див. також
- ActionScript — реалізація від Adobe для Flash.
- WebAssembly
- Rhino — реалізація на Java.
- JScript — реалізація в Internet Explorer від Microsoft.
- DOM — об'єктна модель документа.
- Firebug
- AJAX
- JSON
Примітки
- ↑ Standard ECMA-262. www.ecma-international.org. Процитовано 28 квітня 2019. (англ.)
- ↑ а б M. Miller, M. Borins, M. Bynens et al. Updates to ECMAScript Media Types — IETF, 2022. — doi:10.17487/RFC9239
- ↑ RFC 4329. tools.ietf.org.
- ↑ System-Declared Uniform Type Identifiers. Mac OS X Reference Library. Apple Inc. Процитовано 5 березня 2010.
- ↑ ECMAScript Language Specification (PDF). Архів оригіналу (PDF) за 12 квітень 2015. Процитовано 20 серпень 2014.
- ↑ ECMAScript Language Overview (PDF). 23 жовтня 2007. с. 4. Архів оригіналу (PDF) за 13 липня 2010. Процитовано 3 травня 2009.
- ↑ Press release announcing JavaScript, «Netscape and Sun announce Javascript», PR Newswire, December 4, 1995
- ↑ TechVision: Innovators of the Net: Brendan Eich and JavaScript. Web.archive.org. Архів оригіналу за 8 лютого 2008.
- ↑ Brent Noorda's Answers on ECMA. Quora. Процитовано 13 квітня 2014.
- ↑ ECMAScript 3rd Edition specification (PDF). Архів оригіналу (PDF) за 12 квітня 2015. Процитовано 26 травня 2013.
- ↑ Documentation. ECMAScript. Архів оригіналу за 26 квітня 2011. Процитовано 13 квітня 2014.
- ↑ ES6, ES8, ES2017: что такое ECMAScript и чем это отличается от JavaScript. Tproger (рос.). 7 вересня 2017. Процитовано 8 жовтня 2017.
- ↑ 15 самых популярных языков программирования по версии GitHub (рос.). Процитовано 8 жовтня 2017.
- ↑ JavaScript: The World's Most Misunderstood Programming Language. Crockford.com. Процитовано 19 травня 2009.
Посилання
- Основи JavaScript. https://developer.mozilla.org/. MDN Web Docs.
{{cite web}}: Зовнішнє посилання в(довідка); символ пробілу нульової ширини в|website=|title=на позиції 12 (довідка) - ECMA-262, ECMAScript Language Specification. (англ.)
- Стандарт ECMA-262 (англ.) (третє видання; формат PDF)
- JavaScript домашня сторінка, JavaScript довідник на mozilla.org. (англ.)
- Довідник з JavaScript версії 1.5: 1.5 (англ.)
- Зміни в нових версіях JavaScript: 1.7, 1.6 (англ.)
- JScript та JScript .NET довідники на сайті MSDN Library (англ.)
- www.nakedjavascript.com(англ.)
- Mozilla JavaScript shells (англ.)
- Mozilla (Rhino engine) JavaScript shell (англ.)
- JavaScript довідка українською
| Це незавершена стаття про програмування. Ви можете допомогти проєкту, виправивши або дописавши її. |