Що таке JavaScript і навіщо він потрібний

Розбираємося, чим хороший JavaScript, де застосовується і чи він підходить новачкам.

Що ще за скрипт такий

JavaScript – це мова керування елементами на сайті. Він вміє фарбувати кнопки, запускати анімації, завантажувати ефекти, і все це без перезавантаження сторінки. Наприклад, ви натиснули кнопку «Подобається» – спалахнуло червоне серце. Або навели курсор на три крапки, і випало меню. В обох випадках на сторінці спрацював скрипт . А JavaScript якраз головний за ними в інтернеті — звідси його назва.

JavaScript з’явився в далекі дев’яності, коли інтернет був зовсім юним і складався в основному з тексту та гіперпосилань. Тоді компанія Netscape захотіла собі нову мову для Інтернету на додаток до HTML і CSS.

На те було дві причини:

• Шляхетна — щоб люди в браузері могли не лише читати текст, а й запускати різні меню, віконця, кнопки, що миготять, і так далі.
• Комерційна — щоб втерти носа Microsoft. У той час між Netscape Navigator та Internet Explorer йшла «браузерна війна», і Netscape вирішила залучити розробників до роботи у своєму браузері за допомогою нової мови.

Після цього сайти стали виглядати приблизно так:

А ще Netscape домовилася з Sun Microsystems, щоб мова вважалася «молодшим братом» Java для браузерів. Так з’явилася назва JavaScript не тому, що мови дуже схожі, а тому, що Java тоді був на хайпі. Загалом, у всьому звинувачуйте маркетологів 🙂

Пишемо першу програму

Для початку невеликий лікнеп. Всі мови програмування поділяються на  компілювані та  інтерпретовані . Щоб запустити програму, написану компілюваною мовою, код попередньо проганяють через компілятор. А ось код мовою, що інтерпретується, проганяти не треба — передав інтерпретатору, і той його відразу ж виконує.

JavaScript відноситься до другого типу мов. З одного боку, це зручно — менше мороки та рутини, більше творчості. З іншого боку, без інтерпретатора він просто не запуститься. На щастя, всі сучасні веб-браузери дружать з JavaScript.

Ось як запустити скрипт у браузері:

1. Беремо код.
2. Вставляємо у браузер.
3. Запускаємо.

Здається, звучить неважко. Давайте щось напишемо. Відкриємо консоль браузера ( Ctrl + Shift + J  або Cmd + Opt + J ) і вставимо туди ось цей код:

var userName=prompt("Как вас зовут?", "Введите имя");

    confirm("Привет, " + userName + "!");

Введіть своє ім’я та натисніть OK. Тепер сайт вміє з нами вітатись!

Візьмемо завдання складніше. Допустимо, у вашого вчителя музики ювілей, і ви готуєте йому в подарунок невеликий сайт-листівку. Додали туди гарний напис, фотографії, вірші. Начебто все є, але чогось не вистачає — ну точно повітряних кульок! Непорядок. Беремо цей код і вставляємо в консоль:

var js = document.createElement('script'); 
js.src = "https://safronovmax.github.io/LoveCursor/birthday.js"; 
document.body.appendChild(js);

Вжух – і ви гроза інтернету, шалений веб-нульовий імператор. А кульки зникнуть самі, за десять секунд можна продовжувати читати статті.

Де ще потрібний JavaScript

Веселощі веселощами, але JavaScript – це серйозна і потужна мова, якою можна не тільки красиві анімації малювати, але і писати складні програми для бізнесу.

Веб-програми

Візьмемо, наприклад, Google Документи. Згадайте, як багато функцій: можна змінювати шрифт, вирівнювати абзаци, вставляти картинки. Без JavaScript нам довелося б перезавантажувати сторінку після кожної дії — простіше плюнути і піти в Word. А так ми маємо зручну хмарну альтернативу.

Бекенд

JavaScript вміє запускатися на сервері і може бути повноцінною бекенд-мовою – як Python, C# і Java. Підключаємо до нього спеціальний движок Node.js, і можна писати взагалі будь-що: чати, соцмережі, комп’ютерні програми і так далі. У Netflix, наприклад, пишуть на ньому і серверну логіку, інтерфейс.

Розширення для браузера

Розширення — це прості скрипти, які додають нові функції до браузера. Вони вміють блокувати рекламу, робити скріншоти, оминати блокування сайтів (ми цього не говорили). Всі розширення пишуть на JavaScript – достатньо вивчити його, і розширюйте скільки заманеться.

Мобільні додатки

Допустимо, ви працюєте тимлідом у невеликій IT-компанії, створюєте хмарне сховище. Одного разу до вас приходить продакт-менеджер і вимагає додаток для Android, щоб клієнти могли заходити в сховище з телефону. А у вас взагалі стартап, і грошей на Android-розробника немає.

Можна піти складним шляхом та навчити команду програмувати на Kotlin. А можна схитрувати та попросити фронтендера написати програму на JavaScript. Потім просто компілюєте її під Android за допомогою React Native і отримуєте нативний додаток.

Ігри

Помнете динозаврика з Google Chrome? Який стрибає через кактуси, якщо зник інтернет. Ви також можете написати такого на JavaScript, і ще багато інших простих іграшок: гонок , бродилок, головоломок, стратегій і таке інше.

Чим JavaScript відрізняється від Java

Багато розробників-початківців думають, що Java і JavaScript – родичі. Мовляв, спочатку потрібно вивчити Джаву, а додаток до неї ще Скрипт, і справа в капелюсі 🙂 Насправді це зовсім різні мови — вони влаштовані по-різному і використовуються для різних завдань.

Типізація

У будь-якій комп’ютерній мові є типи даних: рядки, числа, символи тощо. Але кожна мова по-різному поводиться з ними — це називається типізацією . У мовах на кшталт Java вона статична – якщо ми вводимо числову змінну, потрібно спочатку задати її тип. p align=”justify”> Комп’ютер дивиться на тип і розуміє: зараз буде математика.

А в JavaScript типізація динамічна , тому типи задавати не потрібно. З одного боку, свобода та рок-н-рол, а з іншого — можливі різні аномалії. Наприклад, JavaScript можна запитати, що більше — банан або 150, і отримати відповідь:

var x = 'banana'; 
var y = '150';
if (x > y)
console.log('Привет');
// JavaScript выдаст «Привет», очевидно, сделав выбор в пользу банана.

Java на такі фокуси почне лаятися:

Проте так безпечніше — мова захищає програміста від його власних помилок. Чи не порівнюйте банани з числами!

Компіляція

На відміну від JavaScript, Java – це мова, що компілюється. Перед тим як запустити Java-код, його потрібно скомпілювати – тобто перекласти на машинну мову. Зате потім, коли ми клацнемо на іконку програми, код відразу почне виконуватися. При повторному запуску компілювати нічого не потрібно.

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

Застосування

Магія мови Java – у його віртуальній машині (JVM). Віртуальна машина дозволяє запускати код на будь-якому пристрої, де вона встановлена. Вдалося запустити машину — запуститься програма. Тому на Java зручно писати софт для різних пристроїв: серверів, комп’ютерів, смартфонів, банкоматів і навіть роботів.

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

Що легше вчити

Коротка відповідь – JavaScript. Щоб написати перший скрипт, не потрібно витрачати час на встановлення віртуальної машини та розбиратися у типах даних. А з інструментів знадобляться лише блокнот та браузер. Вибирайте його, якщо ви зовсім новачок і хочете швидко поїхати в розробку.

З Java спочатку доведеться попітніти, зате потім ви зможете запускати складні системи. А ще з Java легко перейти іншими мовами — Kotlin або C#.

Скільки платять програмістам

Програмісти на JavaScript завжди потрібні — вони потрібні банкам, IT-компаніям, рекламним агентствам і всім, хто веде бізнес в інтернеті. Та й платити їм готові непогано – в середньому 50 000 – 80 000 гривень на місяць. А джун без досвіду може отримувати близько 30 000 гривень.

Якщо порівнювати різні грейди, то зарплати JavaScript-розробників виглядають так:

• від 40 до 100 тисяч – джуни;
• від 80 до 225 тисяч – мідли;
• від 200 до 450 тисяч – сеньйори.

Роботи у «джаваскриптерів» хоч греблю гати. Більше, ніж для програмістів на Java, PHP або C #.

З чого почати?

Почитайте книгу «Виразний JavaScript» Марейна Хавербеке — це чудовий посібник з мови з прикладами, завданнями та без води. Хороший онлайн-підручник у програміста Іллі Кантора — ним можна дійти від азів до просунутих концепцій на кшталт ОВП та прототипів.

Подальший шлях залежить від вашого стека. Якщо мітите у фронтенд , почніть з HTML і CSS. На сайті Code Basics є безкоштовні курси з них — зі зрозумілою теорією та тренажерами. Потім розберіться в роботі браузера, мережевої безпеки та визначтеся з фреймворком: React.js, Vue.js або Angular.JS .

Якщо більше подобається бекенд, насамперед вивчіть Node.js — він дозволяє розгортати JavaScript на сервері. По-друге, освойте SQL-запити, бази даних та мережеві протоколи. З останньої теми порадимо безсмертну класику Ендрю Таненбаума «Комп’ютерні мережі», яка оновлюється кожні 3–5 років.

Резюмуємо

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