JavaScript - це просто!

Цей засіб дозволяє вам створювати та виконувати невеликі програми, написані на JavaScript.

Набирайте програму, щоб її виконати - натисніть кнопку  Виконати у вікні редактора.

Щоб вилучити результати роботи або текст програми - натисніть кнопку  Очистити у відповідному вікні.

І. Основні поняття JavaScript

Програма на JavaScript складається з послідовності вказівок. Як правило, в одному рядку розміщується одна вказівка, але можна розмістити і декілька, розділивши їх крапкою з комою.

1) Вказівки введення-виведення

Ці вказівки використовуються для обміну інформацією з користувачем програми. Цей засіб має декілька власних функцій, середн них:

Якщо користувач вводить кілька даних одночасно, розділених комою або крапкою з комою, вони будуть збережені в послідовності введення. Візьмемо, наприклад, інструкцію:
var v=input("Введіть xA та yA, розділених комою");
Якщо ми відповімо "-1, 3" або "-1; 3", змінна v дорівнюватиме отримає значення першого члена v[0] і другого члена v[1]. Тому вказівка print(v[0]) відображатиме -1.

Ви також можете подавати результати у вигляді таблиць. Наступна невелика програма показує, як це зробити:

var myTable=new table("Товар","Ціна");
myTable.add("кава",4.50);
myTable.add("булочка",7.00);

2) Змінні та присвоєння

У програмі змінна є іменованою величиною, до якої можна звернутись за іменем. Щодо числових величини, то це має майже таке ж значення, як і в математиці. Ім'я змінної записується латинськими літерами без пропусків.
Ключове слово var використовується для створення змінної, а вказівка = присвоює їй значення. Ось, як приклад, невелика програма:

var n;
n=2;
print(n);

Перший рядок створює змінну з іменем n.
Другий присвоює цій змінній значення 2.
Третій виводить значення у вікні результатів.

Увага! Як і в більшості мов програмування, символ = є вказівкою присвоювання (для надання значення змінній). Оператор математичної рівності представлено символом ==.
При наданні значень можна використовувати поточне значення змінної, щоб отримати інше. Наприклад, наступна невелика програма цілком працююча:

var n=2;
print(n);
n=n+1;
print(n);

Третій рядок дивує, оскільки очевидно, що n відрізняється від n+1.  Фактично, вказівка n=n+1 змінює значення n, збільшуючи попереднє значення на одиницю - це маємо читати як «n стає n+1».

Вправа

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

3) Умовні вказівки

Ми збираємося створити невелику програму, яка імітує кидання монети з однаковою ймовірністю випадання в «герба» або «числа».

Алгоритм:

1)  Отримати дійсне число x в межах між 0 і 1.
2) Якщо x<0,5, то напишіть «Герб».
3) В іншому випадку напишіть «Число».

Програма:

var x=Math.random();
if (x<0.5)
  print("Герб");
else
  print("Число");

Для візуалізації структури програми деякі рядки зсуваються відносно інших. Ви можете автоматично встановити відступи в програмі, натиснувши кнопку   Упорядкувати .

У вказівці if:

4) Роль дужок

Попередній приклад створює нову проблему: як це зробити, якщо потрібно виконати кілька вказівок для кожної альтернативи умовної інструкції?

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

Ми збираємося створити невелику програму, здатну визначити рівняння прямої, знаючи дві точки A і B.

Алгоритм

1) Запитати координати A
2) Запитати координати B
3) Відображати координати A та B
4) Якщо A та B переплутані, відображати повідомлення про помилку
5) В іншому випадку, якщо xA та xB рівні, відображати рівняння x=xA
6) В іншому випадку обчисліть кутовий коефіцієнт m, потім ординату в початку координат p, а потім виведіть рівняння y=mx+p.

Програма

var xA=input("Введіть xA");
var yA=input("Введіть yA");
var xB=input("Введіть xB");
var yB=input("Введіть yB");
print("A(", xA, ",", yA, ") B(", xB, ",", yB, ")");
if (xA==xB && yA==yB)
    print("введіть дві різні точки");
else if(xA==xB)
     print("(AB) : x=", xA);
else {
    var m=(yB-yA)/(xB-xA);
    var p=yA-m*xA;
    print("(AB) : y=", m, "x+",p);
}

Вправа

Повторіть програму для конвертації гривні в долар, спершу запитавши користувача, чи бажає він конвертувати гривні в долари чи навпаки.

5) Цикли

Цикл складається з вказівок, які можна повторити кілька разів.

Наприклад, можна уявити програму, яка виводила таблицю множення на дванадцять. Можна просто написати:

print("0*12=",0*12);
print("1*12=",1*12);
// І так далі...

Але це буде довго, тож замість цього ми напишемо цикл із вказівкою while:

Алгоритм

1) Створіть змінну з назвою "i" і присвойте їй значення 0;
2) Запишіть результат множення i на дванадцять
3) Збільште i на одиницю
4) Якщо i<11, поверніться до кроку 2

Програма

var i=0;
while (i<11) {
       print("12*",i,"=",12*i);
       i=i+1;
}

Цей алгоритм також можна запрограмувати за допомогою вказівкаа for:

var i;
for (i=0; i<11; i++) {
       print("12*",i,"=",12*i);
}

6) Функції

У програмуванні поняття функції точно таке ж, як і в математиці: функція обчислює щось «відповідно» до змінної. Наприклад, нехай функція f визначена як f(x)=x2, тобто f(x) = x*x.
Ця функція програмується в JavaScript таким чином:

function f(x){
    return x*x;
}

Використовувати функціюпросто - введіть після її визначенння "print( f(3))", і ви отримаєте 9.

Деякі попередньо визначені функції

У JavaScript є математичні функції, які можна використовувати у своїх програмах.

ІІ. Вправи

Для кожної вправи складіть алгоритм, потім програму.

1) Напишіть алгоритм, а потім програму додавання двох дробів, чисельник і знаменник яких відомі.

2) Попросіть користувача ввести два числові проміжки та відобразити їх перетин.

3) Скласти таблицю значень функції «квадратний корінь» від х=0 до х=100 з кроком 5.

4) Розробіть гру, у якій  випадково витягують ціле число від 0 до 1000, а потім просять гравця вгадати, яке це число, доки він не дасть правильну відповідь. У разі неправильної відповіді гра просто відповідає «занадто мале» або «занадто велике».

5) Нехай дано натуральне число n. Якщо n відмінне від нуля, факторіалом n є добутком усіх цілих чисел від 1 до n (включно). Якщо n=0, факторіал n дорівнює 1. Обчисліть факторіал n.

6) Складіть програму "кидання" грального кубика 1000 разів і обчисліть частоту появи 6

7)  «Піфагоровою трійкою» ми називаємо будь-яку впорядковану трійку (a; b; c) відмінних від нуля натуральних чисел, у яких квадрат c дорівнює сумі квадратів a і b. Наприклад, (3; 4; 5) є трійкою Піфагора, оскільки 9+16=25.
а) Поясніть, чому в піфагоровій трійці не може бути а=1 або а=b.
b) Перелічіть усі трійки Піфагора, у яких a і b менше або дорівнює 1000.

8) Виведення квадратного кореня за "вавілонським" алгоритмом - прямокутник R1 площею A має розміри x1=1 і y1=A. Ми робимо прямокутник R2 з розмірами x2=(x1+y1)/2 і y2=A/x2, тобто з тією ж площею, що й прямокутник R1. Повторюючи процес, ми наблизимося до квадрата з площею A. Цей алгоритм дає змогу викладати квадратний корінь із A дедалі точніше.
За допомогою цього алгоритму визначте корінь від 5 з точністю до 0,001.

9) Обчисліть мінімальне, максимальне, середнє значення та стандартне відхилення статистичного ряду.

10) Реалізуйте метод «Сортування бульбашками» - послідовність чисел потрібно розташувати в порядку зростання. Алгоритм полягає в проходженні послідовності шляхом систематичної заміни послідовних елементів, які розташовані не в правильному порядку. Процес повторюється, доки не залишиться елементів для обміну.

11) Метод пошуку «за дихотомією» дає змогу знаходити все більш точніші значення кубічного кореня з 2, тобто дійсного числа x, куб якого дорівнює двом - ми починаємо з оточення x двома числами a і b, наприклад a=1 і b=2. Потім ми обчислюємо c=(a+b)/2 і перевіряємо, чи знаходиться x між a і c чи між c і b: таким чином ми отримуємо межу, яка вдвічі тонша і тонша за x. Просто повторюйте цей процес, доки не буде досягнута бажана точність.

12) Алгоритм Евкліда обчислює НОД двох натуральних чисел a і b (за умови що a>b). Ми починаємо з обчислення остачі від ділення a на b, яку позначаємо r; потім ми замінюємо a на b, потім b на r і знову застосовуємо процес з самого початку. Шуканий gcd ​​є останньою ненульовою остачею.
Примітка: остача від ділення a на b отримується з a%b.

13) (складно) Кидайте гральний кубик, доки не випадуть всі грані. Потім підрахувайте кількість кидків, які потрібно було зробити. Повторіть операцію та усередніть кількість необхідних кидків.

14) (складно) Решето Ератосфена дозволяє записати послідовність простих чисел від 2 до n. Почніть з ініціалізації порожньої послідовності простих чисел (з змінною p=[ ] ). Потім досліджуйте одне за одним натуральні числа від 2 до n. Для кожного з цих натуральних чисел перевірте, чи є воно кратним одному з уже знайдених простих чисел - список проходиться за допомогою for (j=0; j<p.length; j++). Якщо перевірене натуральне число не є кратним жодному з простих чисел, додайте його до списку простих чисел - ми додаємо ціле число i до списку за допомогою вказівки p.push(i) .

ІІІ. Малювання за допомогою JavaScript

Функції малювання досить прості - щоб почати малювати, потрібно створити "полотно" за інструкцією:
new frame(xMin,yMin,xMax,yMax,width,high)
Наприклад:

var r= new frame(-10, -10, 10, 10, 300, 200);
r.strokeColor("blue");
r.goTo(5,5);
r.lineTo(10,10);
r.backgroundColor("yellow");
r.rectFull(0,0,-2,-5);

Ця програма створює нову область малювання з координатами від (-10, -10) до (10, 10) у фреймі  300 на 200 пікселів, переміщує "віртуальний олівець" у положення з координатами (5,5), малює відрізок до точки (10, 10), а потім малює суцільно заповнений жовтий прямокутник (у нас також є функція "rectHollow" для малювання незаповнених прямокутників).

Ми можемо малювати точки (розміром один піксель) за допомогою r.point(x,y);

Коло можна намалювати за допомогою r.circle(x,y,r), де x, y - координати центра кола, r - його радіус.

Ось невелика програма, яка ілюструє той факт, що сума всіх натуральних степенів 1/2 дорівнює 2:

var r= new frame(-1, -1, 2, 2, 200, 200);
var colors=["red","yellow","blue"];
var i, z, x1=0, y1=0, x2=1, y2=1;
for (i=0; i<100; i++) {
  r.backgroundColor(colors[i%3]);
  r.rectFull(x1, y1, x2, y2);
  if (i%2==0) {
    z=x1;
    x1=x2;
    x2=2*x2-z;
    y2=(y1+y2)/2;
  } else {
    x2=(x1+x2)/2;
    z=y1;
    y1=y2;
    y2=2*y2-z;
  }
}

Вправи

15) Представте приблизне зображення графіка функцію «квадратний корінь» за допомогою серії маленьких відрізків. Це дійсно наближення, оскільки ця напівпарабола насправді є гладкою кривою і не має відрізків.

16) Канцелярську нопку кидають 500 разів поспіль, і вона має шанс один із трьох впасти на основу та два з трьох -  впасти на вістря. Представте графічно зміну частоти випадання на вістря відповідно до кількості кидків.

17) Побудуйте фігуру, що складається з двох вкладених багатокутників, утворених n прямокутниками шириною 1 і висотою 1,2 ... n, як показано в наступному прикладі, де n=5:. Обчисліть площу поверхні фігури двома різними способами. Виведіть формулу для обчислення 1+2+...+n.

18) Метод «Монте-Карло» дозволяє (між іншим) оцінити площу ділянки площини, обмеженої кривими. Візьмемо, наприклад, плоску область, обмежену віссю абсцис, криву з рівнянням y=x2 для значень абсцис між 0 і 2. Щоб оцінити її площу, ми малюємо 100 000 точок так, що 0<x <2 і 0<y<4 і ми підраховуємо кількість n точок, які знаходяться в бажаному регіоні. Його площа близька до 8*n/100 000.

19) Представте дискретний статистичний ряд за допомогою стовпчастої діаграми.

20) (складно) Зобразити безперервний статистичний ряд гістограмою.

Результати роботи програми :