|
1 |
| -# An Introduction to JavaScript |
| 1 | +# Введення в JavaScript |
2 | 2 |
|
3 |
| -Let's see what's so special about JavaScript, what we can achieve with it, and which other technologies play well with it. |
| 3 | +Давайте розглянемо, що такого особливого в JavaScript, що ми дожемо досягти з його допомогою і які ще технології пов'язані з ним. |
4 | 4 |
|
5 |
| -## What is JavaScript? |
| 5 | +## Що таке JavaScript? |
6 | 6 |
|
7 |
| -*JavaScript* was initially created to *"make web pages alive"*. |
| 7 | +*JavaScript* було створено для того, щоб *"зробити веб-сторінки живими"*. |
8 | 8 |
|
9 |
| -The programs in this language are called *scripts*. They can be written right in a web page's HTML and executed automatically as the page loads. |
| 9 | +Програми на цій мові називаються *скриптами*. Їх можна писати прямо на сторінці в коді HTML і вони автоматично виконуються при завантаженні сторінки. |
10 | 10 |
|
11 |
| -Scripts are provided and executed as plain text. They don't need special preparation or compilation to run. |
| 11 | +Скрипти виглядають і виконуються як простий текст. Для запуску, їм не потрібно спеціальна підготовка чи компілятор. |
12 | 12 |
|
13 |
| -In this aspect, JavaScript is very different from another language called [Java](https://en.wikipedia.org/wiki/Java_(programming_language)). |
| 13 | +В цьому плані, JavaScript дуже відрізняється від іншої мови програмування — [Java](https://uk.wikipedia.org/wiki/Java). |
14 | 14 |
|
15 |
| -```smart header="Why <u>Java</u>Script?" |
16 |
| -When JavaScript was created, it initially had another name: "LiveScript". But Java was very popular at that time, so it was decided that positioning a new language as a "younger brother" of Java would help. |
| 15 | +```smart header="Чому <u>Java</u>Script?" |
| 16 | +Коли мову JavaScript було створено, спочатку вона мала іншу назву: "LiveScript". Але тоді була дуже популярна мова програмування Java, тому було вирішено, що позиціонування нової мови як "молодшого брата" Java допоможе у популяризації. |
17 | 17 |
|
18 |
| -But as it evolved, JavaScript became a fully independent language with its own specification called [ECMAScript](http://en.wikipedia.org/wiki/ECMAScript), and now it has no relation to Java at all. |
| 18 | +Але з часом JavaScript значно виріс і став повністю незалежною мовою програмування зі своєю специфікацією [ECMAScript](https://uk.wikipedia.org/wiki/ECMAScript), і зараз немає нічого спільного з Java. |
19 | 19 | ```
|
20 | 20 |
|
21 |
| -Today, JavaScript can execute not only in the browser, but also on the server, or actually on any device that has a special program called [the JavaScript engine](https://en.wikipedia.org/wiki/JavaScript_engine). |
| 21 | +Сьогодні, JavaScript може виконуватися не тільки в браузері, але й на сервері, або на будь-якому пристрої, який має спеціальну програму — [рушій JavaScript](https://uk.wikipedia.org/wiki/Рушій_JavaScript). |
22 | 22 |
|
23 |
| -The browser has an embedded engine sometimes called a "JavaScript virtual machine". |
| 23 | +Браузер має вбудований рушій, який деколи називають "віртуальною машиною JavaScript". |
24 | 24 |
|
25 |
| -Different engines have different "codenames". For example: |
| 25 | +Різні рушії мають різні "кодові назви". Наприклад: |
26 | 26 |
|
27 |
| -- [V8](https://en.wikipedia.org/wiki/V8_(JavaScript_engine)) -- in Chrome and Opera. |
28 |
| -- [SpiderMonkey](https://en.wikipedia.org/wiki/SpiderMonkey) -- in Firefox. |
29 |
| -- ...There are other codenames like "Trident" and "Chakra" for different versions of IE, "ChakraCore" for Microsoft Edge, "Nitro" and "SquirrelFish" for Safari, etc. |
| 27 | +- [V8](https://uk.wikipedia.org/wiki/V8_(рушій_JavaScript)) -- в Chrome і Opera. |
| 28 | +- [SpiderMonkey](https://uk.wikipedia.org/wiki/SpiderMonkey) -- в Firefox. |
| 29 | +- ...Є також інші кодові назви як "Trident" і "Chakra" для різних версій IE, "ChakraCore" для Microsoft Edge, "Nitro" і "SquirrelFish" для Safari, та інші. |
30 | 30 |
|
31 |
| -The terms above are good to remember because they are used in developer articles on the internet. We'll use them too. For instance, if "a feature X is supported by V8", then it probably works in Chrome and Opera. |
| 31 | +Написані вище терміни добре було б запам'ятати, оскільки вони використовуються в статтях розробників на просторах інтернету. Ми також будемо їх використовувати. Наприклад, якщо "можливість X підтримується в V8", тоді ймовірно це буде працювати в Chrome і Opera. |
32 | 32 |
|
33 |
| -```smart header="How do engines work?" |
| 33 | +```smart header="Як рушії працюють?" |
34 | 34 |
|
35 |
| -Engines are complicated. But the basics are easy. |
| 35 | +Рушії складні. Але принцип роботи простий. |
36 | 36 |
|
37 |
| -1. The engine (embedded if it's a browser) reads ("parses") the script. |
38 |
| -2. Then it converts ("compiles") the script to the machine language. |
39 |
| -3. And then the machine code runs, pretty fast. |
| 37 | +1. Рушій (вбудований, якщо це браузер) читає ("розбирає") скрипт. |
| 38 | +2. Потім він перетворює ("компілює") скрипт в машинний код. |
| 39 | +3. І потім машинний код виконується, причому дуже швидко. |
40 | 40 |
|
41 |
| -The engine applies optimizations at each step of the process. It even watches the compiled script as it runs, analyzes the data that flows through it, and applies optimizations to the machine code based on that knowledge. When it's done, scripts run quite fast. |
| 41 | +Рушій застосовує оптимізації на кожному етапі процесу. Він навіть слідкує за скомпільованим скриптом під час його виконання, аналізує дані, які проходять через скрипт, і на основі цих знань застосовує оптимізації до машинного коду. Коли це завершиться, скрипти будуть виконуватися дуже швидко. |
42 | 42 | ```
|
43 | 43 |
|
44 |
| -## What can in-browser JavaScript do? |
| 44 | +## Що може вбудований в браузер JavaScript? |
45 | 45 |
|
46 |
| -Modern JavaScript is a "safe" programming language. It does not provide low-level access to memory or CPU, because it was initially created for browsers which do not require it. |
| 46 | +Сучасний JavaScript — це "безпечна" мова програмування. Вона не надає низькорівневого доступу до пам'яті чи процесора, оскільки початково була створена для браузерів, які цього не потребують. |
47 | 47 |
|
48 |
| -Javascript's capabilities greatly depend on the environment it's running in. For instance, [Node.JS](https://wikipedia.org/wiki/Node.js) supports functions that allow JavaScript to read/write arbitrary files, perform network requests, etc. |
| 48 | +Можливості Javascript значно залежать від оточення, в якому він виконується. Наприклад, [Node.JS](https://uk.wikipedia.org/wiki/Node.js) підтримує функції, які дозволяють JavaScript читати/записувати довільні файли, здійснювати мережеві запити, та інше. |
49 | 49 |
|
50 |
| -In-browser JavaScript can do everything related to webpage manipulation, interaction with the user, and the webserver. |
| 50 | +Вбудований в браузер JavaScript може робити все, що зв'язано з маніпуляцією веб-сторінки, взаємодією з користувачем та веб-сервером. |
51 | 51 |
|
52 |
| -For instance, in-browser JavaScript is able to: |
| 52 | +Наприклад, вбудований в браузер JavaScript може: |
53 | 53 |
|
54 |
| -- Add new HTML to the page, change the existing content, modify styles. |
55 |
| -- React to user actions, run on mouse clicks, pointer movements, key presses. |
56 |
| -- Send requests over the network to remote servers, download and upload files (so-called [AJAX](https://en.wikipedia.org/wiki/Ajax_(programming)) and [COMET](https://en.wikipedia.org/wiki/Comet_(programming)) technologies). |
| 54 | +- Додавати новий HTML-код на сторінку, змінювати існуючий вміст, змінювати стилі. |
| 55 | +- Реагувати на дії користувача, виконуватися при натисканні на кнопки миші, при переміщенні вказівника, при натисканні клавіш клавіатури. |
| 56 | +- Відправляти запити через мережу до віддалених серверів, завантажувати і відвантажувати файли (так звані технології [AJAX](https://uk.wikipedia.org/wiki/AJAX) і [COMET](https://uk.wikipedia.org/wiki/Comet_(програмування))). |
57 | 57 | - Get and set cookies, ask questions to the visitor, show messages.
|
58 | 58 | - Remember the data on the client-side ("local storage").
|
59 | 59 |
|
|
0 commit comments