Урок 0, початок

Простий калькулятор

Привіт. Ми вивчаємо мову програмування JavaScript, мову гіпертекстової розмітки HTML та каскадні таблиці стилів CSS. На наступних уроках ми докладніше розглянемо ці стандарти.
Ти можеш редагувати вміст цієї програми за допомогою редактора для справжніх програмістів Visual Studio Code.
Після редагування збережи свою програму та онови сторінку в браузері. Для того щоб зрозуміти програму уважно прочитай її вміст у редакторі.
А на цьому уроці тобі пропонується подивитись приклади вирішення базових арифметичних операцій: додавання, віднімання, множення та ділення.
Для того щоб працювати з будь чим у своїх програмах потрібно створити змінну. Змінна – математична величина, значення якої може змінюватись у межах певної задачі.
Всюди де ми працюємо з даними, ми використовуємо змінні. В JavaScript змінну ми створимо за допомогою ключового слова let і далі вкажемо імʼя для неї.
Це називається оголошенням змінної. Тепер необхідно присвоїти їй значення. Значення можуть бути різних типів, але зараз ми зосередимось на типі "Число".
Для того щоб призначити значення змінній використовуватимемо оператор присвоєння =.
Знайди у коді ключове слово let і ти побачиш скільки змінних у нас створено:

Зі змінними number1 ... number8 зрозуміло – вони зберігають числа над якими ми робитимемо розрахунки.
А змінним sum, difference, product, fraction присвоєно операції із number1 ... number8 відповідно до назв з використаннями операторів +, -, *, /. Ти можеш змінити значення змінних number1 ... number8, зберегти файл і оновити сторінку в браузері для своїх розрахунків.

Як ти помітив, в нашій програмі є кнопка "Порахувати!", яка в свою чергу викликає функцію.
Функція – частина програми, яка реалізує певний алгоритм і дозволяє звернення до неї з різних частин загальної (головної) програми. Функції створюються за допомогою ключового слова function.
В даному прикладі ми назвали функцію calculator. Зверни увагу, для того щоб відобразити на екрані результати наших розрахунків ми скористались методом alert(). Ми докладніше вивчимо що таке методи в наступних уроках.
В нашому ж прикладі метод alert(аргумент) отримує аргумент у вигляді рядку, який містить значеня наших змінних з числами, значення змінних які зберігають результати розрахунків та назви операцй.
Після оновлення сторінки клікай кнопку і перевіряй результати розрахунків.