29. Упражнение - въвеждане и извеждане на данни. Комбиниране на променливи. Чертаене

 

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

Презентация 1

Взаимодействие с потребителя

Въвеждане и извеждане на данни в JavaScript

 

В JavaScript може да се взаимодейства с потребителя по няколко начина (prompt, alert) и могат да се обединяват текстове с различни променливи - Template Literals (обединяване на текст и данни). 

Синтаксис: let резултат = 'Имам ' + 5 + ' ябълки.'; Използваме template literals: let рез =  Имам ${5} ябълки.;

  • Символът ` (backtick) е магията за вмъкване на променливи ${var}.
  • prompt() е начинът да попитаме потребителя нещо.

Пример: prompt("Как се казваш?"); (излиза изскачащ прозорец с въпроса).

  • alert() е един от начините да съобщим на потребителя нещо.

Пример:  alert(`Здравей,  ${ime}!`); (излиза изскачащ прозорец със съобщението).

 

Чертаене в JavaScript

function setup() {
  createCanvas(400, 300); // задава размера на полето
}


function draw() {
  background(255); // задава цвят на фона (бял)

  fill('red'); // задава цвят на запълване
  rect(0,200, 400, 200); // чертае правоъгълник (позиция х, позиция у, ширина, височина

  textSize(30); //размер на текст
  text("...", 50, 60); // текста и разположението му

}

 

 

Задачи за упражнение

Отворете среда за програмиране и изпълнете по отделно 2-те задачи:
Задача 1 : Въвеждане и извеждане на данни. Взаимодействие с потребителя

Създайте променлива за име и присвоете стойност като попитате потребителя за името му с prompt().

Комбинирайте данните и изведете резултата по 3 начина:

  1. Конкатенация ("Здравей, " + име)
  2. Изскачащ прозорец - alert()
  3. Template literals (`Здравей,  ${ име} !`)

 

Задача 2 : Да изчертаем български символ

 

Задайте размер на платното 400 на 300 и изчертайте бял, зелен и червен правоъгълник с надпис "Република България" (показан е пример за червения цвят):

function draw() {
  background('white');
  fill('red');

  rect(0,200, 400, 200);

....

}