# Взаємодія з користувачем
Тут розглянемо методи введення/виведення JavaScript. Вони рідко вживані у сучасній розробці, бо ці функції виконують іншими способами роботи з HTML-документом. Але Цей функціонал теж працює і ним зручно користуватися під час вивчення мови програмування.
## Виведення даних[](https://textbook.edu.goit.global/javascript-yk5evp/v2/uk/docs/lesson-01/user-input#%D0%B2%D0%B8%D0%B2%D0%B5%D0%B4%D0%B5%D0%BD%D0%BD%D1%8F-%D0%B4%D0%B0%D0%BD%D0%B8%D1%85)
Для виведення даних існує два методи: console.log() і alert().
### console.log()
console.log() - використовують для виведення повідомлення в консолі. В круглих дужках вказують імʼя змінної, або значення, яке потрібно вивести.
```javascript
const message = "Hello Word!";
console.log(message); // Hello Word!
```
Можна також спочатку вставити описовий рядок у лапках, а потім після коми - змінну, яку треба підставити на її місце.
```javascript
const login = "khomiak";
console.log("Your login is: ", login); // Your login is: khomiak
```
### alert()
Метод alert() показує в браузері модальне вікно і в ньому текст, який був переданий усередині круглих дужок в лапках.
```javascript
alert("Hello Word!");
```
Або значення змінної, яку вказали всередині круглих дужок.
```javascript
const message = "Hello Word!";
alert(message);
```
{% hint style="info" %} console і alert - це частина інтерфейсу window - глобального об'єкту, який доступний при виконанні скрипту на веб-сторінці. Запис window\.alert() громіздкий, тому заведено писати просто alert() або console.log().
{% endhint %}
## Отримання даних[](https://textbook.edu.goit.global/javascript-yk5evp/v2/uk/docs/lesson-01/user-input#%D0%BE%D1%82%D1%80%D0%B8%D0%BC%D0%B0%D0%BD%D0%BD%D1%8F-%D0%B4%D0%B0%D0%BD%D0%B8%D1%85)
Описані далі методи confirm() і prompt() теж є частиною інтерфейсу window. Вони повертають введені користувачем дані, тому їх можна записати у змінну і далі використовувати у скрипті.
### confirm()
confirm() - виводить модальне вікно з повідомленням вказаним у круглих дужках. Також доступні для вибору дві кнопки Ok і Cancel. Якщо натиснути Ok, то повернеться результат true. Якщо натиснути Cancel - повернеться false.
```javascript
// просимо користувача погодитись на умови угоди
// результат вибору користувача записуємо у змінну isAgreed
const isAgreed = confirm("Do you agree to the terms of the agreement?");
console.log(isAgreed);
```
### prompt()
prompt() - виводить модальне вікно із полем для введення даних і кнопки Ok і Cancel. Якщо користувач натискає Ok, то як результат повернеться введений користувачем текст, якщо користувач натисне Cancel - то повертається null.
```javascript
// Запитуємо користувача ввести його вік
// Реззультат відповіді записуємо у змінну age
const age = prompt("Enter your age");
console.log(age);
```
Метод prompt завжди повертає рядок. Навіть, якщо користувач ввів цифру. Тобто в змінну, наприклад запишеться не 30, а рядок "30". Тому з такими отриманими даними потрібно робити приведення типів даних.
```javascript
const age = prompt("Your age?");
console.log("typeof: ", typeof age); // "string"
console.log("age: ", age); // "30"
```
**Покликання:**
[Більше про використання console.log()](https://medium.com/free-code-camp/how-to-use-the-javascript-console-going-beyond-console-log-5128af9d573b)
