Blockly Demos Code

А зараз ми познайомимося з ще одним зручним способом зображення алгоритмів, як блоки Blockly Demos Code.
Blockly Demos Code – це інтернет- ресурс від компанії Google, який дозволяє зображати, а потім виконувати алгоритми за допомогою блоків. Такий же принцип має програма Scratch . Знайти цей веб-ресурс ви зможете за цим посиланням: https://blockly-demo.appspot.com/static/demos/code/index.htmlДаний ресурс може відображатися різними мовами інтерфейсу, потрібно лише вибрати ту мову, яка вам буде найзручнішою. У навчанні ми будемо використовувати українську.
Blockly чудово підійде для людей, які тільки почали вивчати певні мови програмування. Усе, що потрібно, це вибрати певний розділ боків і перетягувати їх на робочу поверхність, зв’язуючи один з одним. Більше того, за допомогою даного ресурсу можна не тільки зображати алгоритми, а й виконувати їх. Для того, щоб виконати певний алгоритм, треба натиснути на кнопку запуску програми.
Блоки діляться на такі категорії :
- логіка (логічні вирази та умова);
- петлі або цикли (умовні та з лічильником);
- математика (прості та складні математичні дії);
- текст (робота з текстом, запит та друк);
- списки (робота зі списками);
- колір;
- змінні (управління змінними, створення та присвоєння значень);
- функції.

 Також даний веб-ресурс має зручну функцію: представлення алгоритму не тільки через блоки, а й програмний код. Тобто після побудови алгоритму за допомогою блоків ви можете подивитися, як буде виглядати ваш алгоритм у програмному коді. Для цього треба просто натиснути на потрібну мову програмування, яка представлена у списку.
Коротко про основні моменти створення алгоритмів за допомогою блоків Blockly Demos Code.
Блоки поділяються на два типи:
- Блоки, що вказують дію;
- блоки, з можливістю встановлення параметрів (далі їх будемо називати пазлами).
Наприклад, блок “Друк” із вкладки “Текст” зазначає, що буде щось виводитися на екран, але він позначає лише дію, але нам треба до цього блоку прикріпити або змінну, або число, або текст у вигляді пазлу.
Давайте розглянемо приклад задачі. Вона полягає в тому, що на вході ми маємо число “а” та число “b”, необхідно знайти добуток цих чисел.
Для побудови даного алгоритму дій ми маємо встановити змінні для двох вище зазначених чисел. Зверніть увагу! Для цього нам потрібно: перейти до категорії “Змінні” та  натиснути на кнопку “Нова змінна”, після чого потрібно ввести її назву. Щоб присвоїти змінній якесь значення, потрібно в цьому ж розділі вибрати блок “встановити значення змінній до…”, який з'явиться після створення змінної і прикріпити текст або число із відповідних розділів “Текст” або “Математика”. Також можна попросити ввести значення користувача програми. Тоді до блоку присвоєння додаємо блок “запросити текст/число з повідомленням” з розділу “Текст”. Також присвоїти можна не тільки конкретне число, а й вираз.
Можемо також написати повідомлення, в полі вводу повідомлення. Наприклад, “Введіть число а:”, та “Введіть число b:” або інше, за вашим бажанням. Операцію для присвоєння змінні значення треба провести спочатку  для змінної “а”, а потім для змінної “b” і не забуваємо з’єднувати всі боки між собою. Потім встановлюємо блок “друк” із вкладки “Текст” та додаємо до нього пазл, з вкладки “Математика”, який зображений на малюнку 1.17, а саме дії зі змінними ти числами, та вставити туди наші змінні. І перемістити потрібну змінну в поле та вибрати дію множення. Щодо даного пазлу, то ми можемо вибрати і інші дії із випадаючого списку. 
Здавалося б, як багато тексту, але насправді кінцевий результат буде мати зовсім простий вигляд.
А от що буде, якщо запустимо дану програму і для прикладу введемо числа 5 і 6.
Давайте розглянемо побудову алгоритмів з розгалуженням за допомогою блоків Blockly. На вході є 2 числа, потрібно знайти максимальне із них.
Для початку повторимо процедуру встановлення змінних як в першій задачі, створимо дві нові змінні “а” і “b”, а також винесемо відповідні блоки.

Після цього вставляємо блок розгалуження, який дозволить нам сформолювати умову, щоб порівняти два числа, із вкладки “Логіка”, а саме найперший блок, який виглядає як на малюнку. Зверніть увагу! Як ви бачите, у блоці відразу не передбачено, що робити, якщо умова не виконується. Для цього натискаємо на кнопку налаштувати, яка знаходиться на цьому блоці, і перетягуємо додаток до блоку “інакше”.
Тепер із тієї ж вкладки до пункту “якщо” прикріпляємо пазл порівняння двох змінних із вкладки “Логіка” і вставляємо наші змінні, спочатку “а”, потім “b” і між ними вибираємо відповідний знак, наприклад знак більше “>”. А навпроти пункту “виконати” ставимо блок “Друк” із змінною “а”. Відповідно навпроти пункту “інакше” ставимо блок “Друк” із змінною “b”.  Після цих не складних маніпуляцій отримуємо наступну схему блоків .
І ось що відбудеться, якщо ми запустимо програму і введемо числа 56 і 67. Результат зрозумілий для нас і є дуже простим, але для нас це неважливо, нам лише потрібно перевірити, на скільки правильно ми склали алгоритм даної програми.

Ну і звичайно нам потрібно розглянути алгоритми з умовним циклом, на прикладі наступної задачі.
На вході є число “а” і якщо “а”— парне, то програма буде ділити його на 2 та виводити результат ділення, доки воно не перестане ділитися націло на 2.

Тут знову ж не так все складно, як здавалося, створюємо змінну “а” та її значення буде вводити користувач і тут найцікавіше, а саме блок циклу. Заходимо до категорії “Петлі” і вибираємо блок “повторювати поки...”. До пункту “повторювати поки” прикріпляємо пазл із вкладки “Математика”, який позначає парність чи непарність числа, або змінної та прикріпляємо в конструкцію змінну “а”. І ось тут в силу вступає наша логіка. Для того щоб зобразити дію a=a/2, і нам треба переприсвоїти змінній нове значення, а саме дію “a/2”. Ну і також треба додати блок “Друк” і прикріпити змінну “a” в тіло циклу, тобто після переприсвоєння значення змінної. І в результаті маємо наступну  систему із блоків.
 Ну і звичайно ж спробуємо запустити нашу програму і введемо для прикладу число 8, по логіці на виході ми будемо мати числа 4, 2 і 1, і на цьому алгоритм закінчується, бо число 1 непарне.
Звичайно це не всі можливості даного веб-ресурсу, просто їх настільки багато, що для цього потрібно писати окрему книгу.

Немає коментарів:

Дописати коментар

Python і Sublime Text 3

Sublime Text — швидкий кросплатформенний редактор початкових текстів програм. Підтримує плагіни, розроблені за допомогою мови програмуванн...