42. Реализиране на линеен, разклонен и цикличен алгоритъм. JavaScript с разширение Turtle. Работа по проект: Розетка

 

Теоретични материали

Какво е Turtle в JavaScript?

Turtle (Костенурка) е малка виртуална "костенурка", която можем да управляваме с код. Казваме ѝ как да се движи – напред, наляво, надясно – и тя рисува линии, докато се движи, сякаш държи молив.

Така можем да рисуваме форми, цветни картини, звезди и дори мандали!

 
Какво е списък в JavaScript?

В JavaScript списъкът се нарича масив (на английски: array). Това е специална променлива, в която можем да съхраняваме много стойности наведнъж – като кутия с отделения.

Например:

let colors = ["red", "green", "blue"];

Тук colors е списък с 3 цвята.

Как работи списъкът?

Всеки елемент в списъка има номер (индекс), който започва от 0.

Как достъпваме елемент от списъка?

Използваме името на списъка + квадратни скоби.

 

Работа по проект: Розетка

Създайте програма на JavaScript, която рисува красива картина от повтарящи се цветни многоъгълници, с помощта на Turtle графика.

Следвай следните изисквания:

 

Програмата трябва да рисува:

Многоъгълник с n страни, като всеки следващ многоъгълник да е завъртян леко наляво спрямо предишния, така че заедно да оформят розетка. Това да се повтори t пъти.

 

Всеки ръб на фигурата трябва да бъде:

  • В различен цвят, избран на случаен принцип от списък с предварително зададени цветове.
  • С дебелина на линията 2.
  • Всеки ръб да бъде с дължина 100.

 

Допълнително:

Програмата трябва да използва вложени цикли – един за страните на фигурата и друг за повторенията ѝ.

 

Примерен вид на крайния резултат можете да видите по-долу. Дадено ви е и примерно изпълнение на проекта в JavaScript, където са използвани списък за цветовете и костенурка turtle, която да чертае. Вие можете да импровизирате и да промените програмата по ваша преценка, стига да получите сходен резултат. Например можете да добавите повече или други цветове.

 

 Стъпки за изпълнение на задачата:

1. Създайте нов герой костенурка, който ще чертае

име_на_героя = new Turtle();

2. Задайте дебелина на молива 2 с командата .pensize(2)

3.   Създайте променливи за броя на ъглите и броя на завъртанията:

  • Попитай потребителя (с prompt) колко страни (ъгли) да има всяка фигура. Това ще е число n.
  • Попитай потребителя колко пъти иска да се завърти рисунката. Това ще е число t.

4. Създайте списък с цветове, които ще се променят на случаен принцип в розетката. Може да използвате следния списък с цветове, или да напишете други (с английските думи за съответните цветове):
['yellow', 'orange', 'red', 'purple', 'blue', 'green', 'pink']

5. Създайте два вложени цикъла - единия за чертаенето на фигурата, а втория - за повторенията. Можете да ползвате следната конструкция:

for ( ){
    for( ){
       
        tina.pendown();
        tina.forward(100);
        tina.left(360/n);
    }
    tina.penup();
    tina.left(360/t);
}

6. Добавете случайни цветове от списъка с командата .pencolor(random(цветове));

7. Изпробвайте програмата с различни ъгли и повторения.