JavaRush /Курсы /Модуль 1: Web Core /Типы данных: строки, шаблоны, boolean

Типы данных: строки, шаблоны, boolean

Модуль 1: Web Core
20 уровень , 4 лекция
Открыта

1. Строки в JavaScript

Строка — это просто текст. Любой текст: "Привет, мир!", "42", "JavaScript — это весело!", "user@example.com". В программировании строка — это последовательность символов, заключенная в кавычки.

В JavaScript строки можно записывать тремя способами:

  • В двойных кавычках: "Привет"
  • В одинарных кавычках: 'Мир'
  • В обратных кавычках (шаблонные литералы): `Hello, JS!`

Пример:

let message1 = "Это строка в двойных кавычках";
let message2 = 'А это — в одинарных';
let message3 = `А это — в обратных (шаблонных) кавычках`;

Все три способа работают одинаково для хранения текста. Выбор стиля — дело вкуса, но про обратные кавычки мы поговорим чуть позже, потому что они умеют кое-что особенное.

Почему нужны строки?

  • Для вывода сообщений пользователю.
  • Для хранения имен, email, адресов и вообще любого текста.
  • Для динамического формирования HTML-кода (да, это тоже бывает).

Аналогия:
Если числа — это кирпичи для расчетов, то строки — это кирпичи для общения с пользователем и хранения любой текстовой информации.

2. Конкатенация строк: склеиваем текст

Конкатенация — это не страшное заклинание, а всего лишь "склеивание" строк между собой. В JavaScript для этого используется оператор +.

Пример:

let firstName = "Иван";
let lastName = "Иванов";
let fullName = firstName + " " + lastName;

console.log(fullName); // Иван Иванов

Здесь мы склеили две переменные и добавили между ними пробел (иначе получится "ИванИванов" — а это уже не очень читаемо).

Можно склеивать сколько угодно строк:

let greeting = "Привет, " + firstName + " " + lastName + "!";
console.log(greeting); // Привет, Иван Иванов!

Можно склеивать строки и числа:

let age = 25;
let info = "Возраст: " + age;
console.log(info); // Возраст: 25

Внимание! Если вы складываете строку и число, результат — всегда строка (JavaScript автоматически преобразует число в строку).

3. Шаблонные литералы: магия обратных кавычек

Шаблонные литералы — это строки, которые заключаются не в обычные кавычки, а в обратные (` — они же backticks, обычно слева от цифры 1 на клавиатуре). Они позволяют вставлять переменные прямо внутрь строки с помощью конструкции ${...}.

Пример:

let name = "Мария";
let age = 30;
let message = `Меня зовут ${name}. Мне ${age} лет.`;

console.log(message); // Меня зовут Мария. Мне 30 лет.

Почему это удобно?

  • Не нужно склеивать строки с помощью +.
  • Можно вставлять любые выражения:
let a = 5;
let b = 10;
let sum = `Сумма: ${a + b}`;
console.log(sum); // Сумма: 15
  • Можно писать многострочные строки:
let poem = `Роза красная,
Фиалка синяя,
JS прекрасен,
И это не шутка!`;
console.log(poem);

Когда использовать шаблонные литералы?

  • Когда нужно вставить переменные или выражения в текст.
  • Когда строка длинная или многострочная.
  • Когда хочется выглядеть современно и стильно (шутка, но в каждой шутке…).
Склейка через + Шаблонный литерал
"Привет, " + name + "!"
`Привет, ${name}!`
"Сумма: " + (a + b)
`Сумма: ${a + b}`

4. Boolean: логический тип

Что такое boolean?

В программировании часто нужно отвечать на вопросы "Да или нет?", "Истина или ложь?", "Выполнено или нет?". Для этого существует специальный тип данных — boolean (логический тип).

В JavaScript всего два значения boolean:

  • true — истина
  • false — ложь

Примеры:

let isOnline = true;
let isAdmin = false;

console.log(isOnline); // true
console.log(isAdmin);  // false

Где используются boolean?

  • В условиях (if), чтобы решать, выполнять ли какой-то код.
  • Для хранения состояния (например, "пользователь авторизован?").
  • В логических выражениях и сравнениях.

Пример:

let age = 18;
let isAdult = age >= 18; // true

console.log(isAdult); // true

Здесь выражение age >= 18 возвращает true, если возраст больше или равен 18, и false — если меньше. Подробнее о сравнениях мы поговорим в одной из следующих лекций.

5. Примеры: объединяем знания

Давайте попробуем собрать вместе строки, числа и boolean, чтобы увидеть, как они могут работать в одном простом приложении. Мы продолжаем развивать ваше учебное "приветственное приложение".

Пример 1: Формируем приветствие

let userName = "Алексей";
let userAge = 22;

let greeting = `Привет, ${userName}! Тебе уже ${userAge} года?`;
console.log(greeting); // Привет, Алексей! Тебе уже 22 года?

Пример 2: Проверяем совершеннолетие

let isAdult = userAge >= 18;
console.log(`Совершеннолетний: ${isAdult}`); // Совершеннолетний: true

Пример 3: Комбинируем всё вместе

let message = `Пользователь: ${userName}
Возраст: ${userAge}
Совершеннолетний: ${isAdult}`;
console.log(message);
/*
Пользователь: Алексей
Возраст: 22
Совершеннолетний: true
*/

Пример 4: Склейка строк по-старому и по-новому

// Старый способ
let oldWay = "Имя: " + userName + ", возраст: " + userAge;
// Новый способ
let newWay = `Имя: ${userName}, возраст: ${userAge}`;
console.log(oldWay);
console.log(newWay);

6. Особенности работы со строками и boolean

Строки — это не числа!

Если вы попробуете сложить строку и число, получится строка:

let str = "10";
let num = 5;
let result = str + num;
console.log(result); // "105"

А если захотите сложить две строки, которые выглядят как числа:

let a = "2";
let b = "3";
console.log(a + b); // "23"

Внимание: если хотите получить сумму чисел, убедитесь, что складываете именно числа, а не строки.

Boolean в условиях

Boolean-значения чаще всего используются в условиях:

let isMember = true;
if (isMember) {
    console.log("Добро пожаловать в клуб!");
} else {
    console.log("Только для членов клуба.");
}

Подробнее об условиях в следующих лекциях :P

7. Многострочные строки и спецсимволы

С помощью обычных кавычек ('...' или "...") нельзя просто так писать многострочные строки. Если попробуете, получите ошибку.

Неправильно:

let text = "Это первая строка
А это вторая"; // Ошибка!

Правильно:

С помощью \n (символ новой строки):

let text = "Это первая строка\nА это вторая";
console.log(text);
// Это первая строка
// А это вторая

Или с помощью шаблонных литералов:

let text = `Это первая строка
А это вторая`;
console.log(text);
// Это первая строка
// А это вторая

Спецсимволы в строках

Символ Что делает
\n
Перевод строки
\t
Табуляция (отступ)
\'
Одинарная кавычка
\"
Двойная кавычка
\\
Обратный слэш

Пример:

let poem = "Роза красная,\n\tФиалка синяя.";
console.log(poem);
// Роза красная,
//     Фиалка синяя.

8. Типичные ошибки при работе со строками и boolean

Ошибка №1: Путаница кавычек

Если вы начали строку с двойной кавычки, завершайте тоже двойной! То же самое с одинарной. А вот в шаблонных литералах — только обратные кавычки.

let s = "Hello'; // Ошибка!
let t = `Привет"; // Ошибка!

Ошибка №2: Склейка строк и чисел

Если вы складываете строку и число, результат — строка, а не число. Это приводит к неожиданным результатам.

let a = "5";
let b = 10;
console.log(a + b); // "510" (а не 15!)

Ошибка №3: Попытка использовать многострочную строку в обычных кавычках

Нельзя писать многострочные строки в одинарных или двойных кавычках без спецсимволов или шаблонных литералов.

let text = "Строка
нельзя так писать"; // Ошибка!

Ошибка №4: Присваивание не-boolean значения переменной, предполагая, что это boolean

Иногда забывают, что результат сравнения — это boolean, а не строка.

let isAdult = "age >= 18"; // Это строка, а не boolean!

Ошибка №5: Использование переменных до их объявления

JavaScript позволяет "подсовывать" переменные в шаблонные литералы, но если переменная не объявлена — будет ошибка.

console.log(`Привет, ${userName}`); // ReferenceError, если userName не объявлен
1
Задача
Модуль 1: Web Core, 20 уровень, 4 лекция
Недоступна
Класс Person
Класс Person
1
Задача
Модуль 1: Web Core, 20 уровень, 4 лекция
Недоступна
Класс User
Класс User
Комментарии
ЧТОБЫ ПОСМОТРЕТЬ ВСЕ КОММЕНТАРИИ ИЛИ ОСТАВИТЬ КОММЕНТАРИЙ,
ПЕРЕЙДИТЕ В ПОЛНУЮ ВЕРСИЮ