Рядки і текст

Вітаємо у світі тексту в JavaScript! Коли ти бачиш привітальне повідомлення на сайті, ім’я користувача на екрані або повідомлення про помилку, ти бачиш текст. У цій лекції ти навчишся писати текст у коді та поєднувати слова, щоб створювати корисні повідомлення.

Що таке рядок

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

Як писати рядки з лапками

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

JavaScript дає три способи записати текст:

• Одинарні лапки: 'Привіт'
• Подвійні лапки: "Привіт"
• Бектіки: `Привіт`

Усі три способи правильні й добре працюють для базового тексту.

Поєднання рядків зі змінними

Часто тобі потрібно буде змішувати звичайний текст зі змінною (іменованим контейнером, який зберігає дані). Наприклад, програма може сказати "Привіт", а потім додати конкретне ім’я користувача.

Коли потрібно легко поєднати текст і змінні, бектіки часто є найпростішим варіантом. Вони дозволяють вставляти змінні прямо в текст за допомогою спеціального заповнювача, який виглядає так: ${variableName}.

Перший приклад коду

Ось як створити просте персональне привітання і показати його в секції виводу за допомогою console.log().

const firstName = "Олекса";
const greeting = `Привіт, ${firstName}!`;
console.log(greeting);

Покрокове пояснення

Розберімо, що саме відбувається в коді вище:

• const firstName = "Олекса"; Ми створюємо змінну з назвою firstName і зберігаємо в ній рядок "Олекса". Тут ми використовуємо подвійні лапки, щоб обгорнути текст.
• const greeting = `Привіт, ${firstName}!`; Ми створюємо другу змінну з назвою greeting. Тут ми використовуємо бектіки, щоб вставити змінну firstName прямо всередину тексту за допомогою заповнювача ${}.
• console.log(greeting); Ми використовуємо команду console.log(), щоб надіслати фінальне повідомлення в секцію виводу під кодом. Після натискання Запустити ти маєш побачити: Привіт, Олекса!.

Міні-завдання

Спробуй сам у редагованому блоці коду вище.

1. Зміни "Олекса" на своє ім’я.
2. Натисни Запустити.
3. Перевір вивід під кодом і подивися, як оновиться повідомлення.

Короткий тест

Запитання: Який символ найзручніший, коли потрібно легко поєднати текст зі змінною? A) Одинарні лапки (') B) Подвійні лапки (") C) Бектіки (`)

Відповідь: C. Бектіки особливі, бо дозволяють використовувати заповнювач ${} і вставляти змінні прямо всередину рядків.

Малий виклик

Чи можеш написати коротку програму, яка виведе повідомлення про твій улюблений колір?

1. Створи змінну з назвою favoriteColor і збережи в ній рядок, наприклад "blue" або "green".
2. Створи змінну з назвою message, використовуючи бектіки.
3. Використай бектіки і свою змінну, щоб створити повідомлення "My favorite color is blue."
4. Виведи message у секції виводу за допомогою console.log().

// напиши свій код нижче

console.log()

Підсумок

• Рядок — це програмістський термін для тексту.
• Рядки потрібно брати в одинарні лапки, подвійні лапки або бектіки, щоб вони працювали правильно.
• Бектіки дуже корисні, бо дозволяють легко поєднувати текст і змінні для створення динамічних персональних повідомлень.
• Можна використовувати console.log(), щоб надсилати рядки в секцію виводу і бачити результат свого коду.