diff options
Diffstat (limited to 'files/uk/web/javascript/guide/introduction/index.html')
| -rw-r--r-- | files/uk/web/javascript/guide/introduction/index.html | 147 |
1 files changed, 147 insertions, 0 deletions
diff --git a/files/uk/web/javascript/guide/introduction/index.html b/files/uk/web/javascript/guide/introduction/index.html new file mode 100644 index 0000000000..8f1d97d352 --- /dev/null +++ b/files/uk/web/javascript/guide/introduction/index.html @@ -0,0 +1,147 @@ +--- +title: Вступ +slug: Web/JavaScript/Guide/Introduction +tags: + - JavaScript + - Вступ + - Початківець + - Путівник +translation_of: Web/JavaScript/Guide/Introduction +--- +<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</div> + +<p class="summary">Цей розділ розповідає про мову JavaScript та деякі засадничі її поняття.</p> + +<h2 id="Необхідний_рівень_підготовки">Необхідний рівень підготовки</h2> + +<p>Цей навчальний посібник передбачає, що ви маєте деякі початкові знання:</p> + +<ul> + <li>Загальне уявлення про {{Glossary("Internet", "Інтернет")}} та ({{Glossary("World_Wide_Web", "Всесвітнє павутиння")}});</li> + <li>Практичний досвід використання мови розмітки гіпертексту ({{Glossary("HTML")}});</li> + <li>Певний досвід программування. Якщо ви у цьому новачок, то спробуйте один з посібників із <a href="/uk/docs/Web/JavaScript">JavaScript</a> на головній сторінці.</li> +</ul> + +<h2 id="Де_знайти_інформацію_з_JavaScript">Де знайти інформацію з JavaScript</h2> + +<p>Документація з JavaScript на ресурсі MDN містить таке:</p> + +<ul> + <li><a href="/uk/Learn">Вивчення Web</a> містить інформацію для початківців, а також ознайомлює з основними концепціями програмування та Інтернету;</li> + <li><a href="/uk/docs/Web/JavaScript/Guide">Навчальний посібник з JavaScript</a> (цей посібник) містить огляд мови JavaScript та її об'єктів;</li> + <li><a href="/uk/docs/Web/JavaScript/Reference">Довідник з JavaScript</a> містить докладні довідкові матеріали з JavaScript.</li> +</ul> + +<p>Якщо ви новачок у JavaScript, почніть із вивчення статей, розміщених у <a href="/uk/Learn">навчальній секції</a> (learning area) та <a href="/uk/docs/Web/JavaScript/Guide">Посібника з JavaScript</a>. Опанувавши основи, можете використовувати <a href="/uk/docs/Web/JavaScript/Reference">Довідник з JavaScript</a> для отримання більш детальної інформації про конкретні об'єкти та вирази (конструкції мови).</p> + +<h2 id="Що_таке_JavaScript">Що таке JavaScript?</h2> + +<p>JavaScript — кроссплатформна об'єктно-зорієнтована мова сценаріїв (скриптів). Рушій JavaScript підключається до об'єктів свого середовища виконання (зазвичай, веб-переглядача) та надає можливість керування ними.</p> + +<p>Мова JavaScript має стандартну бібліотеку об'єктів (таких як <code>Array</code>, <code>Date</code> та <code>Math</code>) і основний набір елементів мови програмування, таких як оператори, керівні структури та вирази.</p> + +<p>Ядро JavaScript може бути розширене для різних потреб шляхом доповнення його додатковими об'єктами. Наприклад:</p> + +<ul> + <li><em>На стороні клієнта JavaScript</em> розширює ядро мови, додаючи об'єкти керування переглядачем і його об'єктною моделлю документа — Document Object Model (DOM). Наприклад, клієнтські розширення дозволяють застосункам розміщувати елементи на HTML-формі та реагувати на дії користувача, такі як клацання миші, введення даних у форму і пересування сторінками.</li> + <li><em>На стороні сервера JavaScript</em> розширює ядро мови шляхом додавання об'єктів, що стосуються роботи JavaScript на сервері. Наприклад, серверні розширення дозволяють застосункам взаємодіяти з базою даних, забезпечувати безперервність потоку інформації від одного запущеного застосунку до іншого, або виконувати маніпуляції з файлами на сервері.</li> +</ul> + +<h2 id="JavaScript_and_Java" name="JavaScript_and_Java">JavaScript та Java</h2> + +<p>Мови програмування JavaScript та Java у окремих рисах схожі між собою, але все одно докорінно відрізняються одна від одної. Мова JavaScript чимось нагадує Java, але, на відміну від останньої, не має чіткої типізації даних та строгого контролю за типами.</p> + +<p>JavaScript наслідує синтаксис більшості виразів Java, також наслідуються угоди про іменування та основні конструкції керування перебігом виконання сценарію. Це і стало причиною того, що свого часу назву мови змінили з LiveScript на JavаScript.</p> + +<p>На відміну від системи часу коміляції декларативно побудованих класів у Java, мова JavaScript підтримує систему часу виконання, що ґрунтується на невеликій кількості типів даних, представлених числовим типом, логічними, та рядковими значеннями. JavaScript має об'єктну модель, що спирається на прототипи, замість більш поширеної, побудованої на класах, об'єктної моделі, властивої мові Java. Модель на базі прототипів надає можливість динамічного спадкування; тобто успадковане може бути різним для різних об'єктів. Також у JavaScript реалізована підтримка функцій без будь-яких особливих декларативних вимог. Функції можуть бути властивостями об'єктів, функціями, що виконуються, та слабко типізованими методами.</p> + +<p>Для JavaScript властива вільніша форма мови, ніж для Java. Вас не зобов'язують оголошувати всі змінні, класи та методи. JavaScript-програміста не турбує питання, є метод відкритим (public), закритим (private), чи захищеним (protected). Для змінних, параметрів, та типів, що повертаються функціями, не вказується явним чином їх тип.</p> + +<p>Java — це мова програмування, яка базується на класах, розроблена для швидкого виконання та забезпечення захищеності типів. Захищеність типів означає, що не можна, наприклад, привести тип integer до типу object reference, або отримати доступ до закритої пам'яті, маніпулюючи з байткодом Java. Базована на класах об'єктна модель означає, що програма повністю складається із класів та їх методів. Успадкування класів у Java та строга типізація взагалі вимагають існування тісно пов'язаних між собою ієрархій об'єктів. Ці вимоги роблять програмування на Java більш складним, ніж JavaScript-програмування.</p> + +<p>На противагу цьому, JavaScript, за своїм духом, близька до невеликих мов із динамічною типізацією, таких, як HyperTalk та dBASE. Ці скриптові мови надають інструменти програмування для більш широкого загалу користувачів, завдяки простоті синтаксису, вбудованим функціональним можливостям зі спеціалізації, та мінімальним вимогам до створення об'єктів.</p> + +<table class="standard-table"> + <caption>JavaScript у порівнянні з Java</caption> + <thead> + <tr> + <th scope="col">Мова JavaScript</th> + <th scope="col">Мова Java</th> + </tr> + </thead> + <tbody> + <tr> + <td> + <p>Об'єктно орієнтована. Не має відмінностей між типами об'єктів. Спадкування здійснюється через механізм прототипів, а властивості та методи можуть бути динамічно додані до будь-якого об'єкту.</p> + </td> + <td> + <p>Базується на класах. Об'єкти поділяються на класи та екземпляри. Спадкування реалізоване через ієрархію класів. До класів та екземплярів не можна динамічно додавати властивості та методи.</p> + </td> + </tr> + <tr> + <td>Для змінних не декларуються типи даних (динамічна типізація).</td> + <td>Для змінних необхідне декларування типів даних (статична типізація)</td> + </tr> + <tr> + <td>Не може автоматично вести запис до жорсткого диску.</td> + <td>Може автоматично вести запис до жорсткого диску.</td> + </tr> + </tbody> +</table> + +<p>Щоб отримати більше інформації щодо відмінностей між JavaScript та Java, відвідайте цей розділ: <a href="/uk/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">Докладно про об'єктну модель</a>.</p> + +<h2 id="JavaScript_and_the_ECMAScript_Specification" name="JavaScript_and_the_ECMAScript_Specification">JavaScript та специфікація ECMAScript</h2> + +<p>JavaScript стандартизований Європейською асоціаіцєю з стандартизації інформаційних та комунікаційних систем — <a class="external" href="http://www.ecma-international.org/">Ecma International</a> (спершу складноскорот ECMA позначав European Computer Manufacturers Association). Ця стандартизована версія JavaScript, що має назву ECMAScript, однаково працює у всіх застосунках, що підтримують стандарт. Різні компанії можуть використовувати цей відкритий стандарт для розробки своїх реалізацій JavaScript. ECMAScript стандарт задокументований у специфікації ECMA-262. Див. <a href="/uk/docs/Web/JavaScript/New_in_JavaScript">Нове у JavaScript</a>, щоб довідатись більше про різні версії JavaScript та про редакції специфікації ECMAScript.</p> + +<p>Стандарт ECMA-262 також затверджений <a class="external" href="http://www.iso.ch/">ISO</a> (International Organization for Standardization), як ISO-16262. Ви можете знайти специфікацію на сайті <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-262.htm">Ecma International website</a>. Специфікація ECMAScript не описує об'єктну модель документа Document Object Model (DOM), яка стандартизована <a class="external" href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>. DOM визначає спосіб, у який об'єкти HTML-документа стають доступними із вашого скрипта. Для отримання більш повного уявлення про технології, що використовуються при програмуванні на JavaScript, зверніться до статті <a href="/uk/docs/Web/JavaScript/JavaScript_technologies_overview">Огляд технологій JavaScript</a>.</p> + +<h3 id="JavaScript_Documentation_versus_the_ECMAScript_Specification" name="JavaScript_Documentation_versus_the_ECMAScript_Specification">Документація з JavaScript та специфікація ECMAScript</h3> + +<p>Специфікація ECMAScript є низкою вимог до реалізації ECMAScript. Цих вимог слід дотримуватись, щоб запровадити відповідні стандартам можливості мови у реалізації ECMAScript, або, щоб створити рушій (наприклад, SpiderMonkey у Firefox або v8 у Chrome).</p> + +<p>Документ ECMAScript не призначений для того, щоб надавати допомогу у програмуванні скриптів. Для отримання інформації про написання скриптів слід використовувати документацію JavaScript.</p> + +<p>У специфікації ECMAScript використовується термінологія і синтаксис, з якими JavaScript-програмісти можуть бути і не знайомі. Не зважаючи на те, що опис мови у ECMAScript може бути дещо іншим, сама мова залишається такою самою. JavaScript підтримує весь функціонал, закладений у специфікації ECMAScript.</p> + +<p>Документація JavaScript описує аспекти мови, які використовує програміст JavaScript.</p> + +<h2 id="Початок_роботи_із_JavaScript">Початок роботи із JavaScript</h2> + +<p>Розпочати працювати з JavaScript дуже просто: все, що вам потрібно — сучасний переглядач. У даному посібнику розглядаються деякі можливості JavaScript, які, на даний час, реалізовані лише в останніх версіях Firefox, тому рекомендується використовувати саму останню версію Firefox.</p> + +<p>До Firefox вбудовано два інструменти, що роблять його використання дуже зручним для експериментів із JavaScript: Web Console та Scratchpad.</p> + +<h3 id="Веб-консоль_—_Web_Console">Веб-консоль — Web Console</h3> + +<p><a href="/uk/docs/Tools/Web_Console">Web Console</a> надає інформацію про поточну завантажену веб-сторінку, а також містить вбудовану <a href="/uk/docs/Tools/Web_Console#The_command_line_interpreter">командну стрічку (command line)</a>, у якій ви маєте змогу виконувати інструкції JavaScript у поточній сторінці.</p> + +<p>Щоб відкрити Web Console (<kbd>Ctrl + Shift + K</kbd>), оберіть пункт "Веб-консоль" із меню "Розробник" у меню Firefox. Вона з'явиться у нижній частині вікна переглядача. Внизу консолі, по всій її довжині, розміщено командну стрічку, до якої ви можете вводити команди та вирази JavaScript. Результати їх виконання одразу з'являться у панелі, що знаходиться вище:</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/7363/web-console-commandline.png" style="display: block; margin-left: auto; margin-right: auto;"></p> + +<h3 id="Чернетка_—_Scratchpad">Чернетка — Scratchpad</h3> + +<p>Веб-консоль чудово підходить для виконання окремих рядків JavaScript, і, хоча, ви й можете вводити й виконувати рядки по одному, це не дуже зручно, і ви не можете зберігати зразки свого коду з використанням Веб-консолі. Таким чином, для виконання більш складних прикладів, є кращий інструмент — <a href="/uk/docs/Tools/Scratchpad">Чернетка (Scratchpad)</a>.</p> + +<p>Щоб відкрити Scratchpad (<kbd>Shift + F4</kbd>), оберіть "Чернетка" ("Scracthpad") у меню "Розробник" із меню Firefox. Він відкривається у окремому вікні і є редактором, який можна використовувати для запису і виконання JavaScript у переглядачі. Ви також можете зберегти скрипти до диску і завантажувати їх з диска.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/7365/scratchpad.png" style="display: block; margin-left: auto; margin-right: auto;"></p> + +<h3 id="Hello_World">Hello World</h3> + +<p>Щоб розпочати роботу з JavaScript, відкрийте Scratchpad та напишіть свою першу програму "Hello world":</p> + +<pre class="brush: js">function greetMe(yourName) { + alert("Hello " + yourName); +} + +greetMe("World"); +</pre> + +<p>Натисніть <kbd>Ctrl + R</kbd>, щоб побачити, як цей код буде виконано у переглядачі!</p> + +<p>На наступних сторінках цього посібника буде розглянуто синтаксис та можливості мови JavaScript, що дозволить вам створювати більш складні застосунки.</p> + +<p>{{PreviousNext("Web/JavaScript/Guide", "Web/JavaScript/Guide/Grammar_and_types")}}</p> |