Переменные в JavaScript: полное руководство для начинающих

1. let — объявляет переменную, значение которой можно изменить (переприсвоить). Она имеет блочную область видимости, то есть существует только внутри блока {}, где была объявлена.
2. const — объявляет константу, то есть переменную, чье значение нельзя переприсвоить после инициализации. Также имеет блочную область видимости. Попытка изменить значение приведет к ошибке.
3. var — устаревший способ объявления с функциональной или глобальной областью видимости. Его использование в современном коде не рекомендуется.

// Объявление переменной, которая может меняться
let users = 10;
users = 11; // ✅ Корректно

// Объявление константы
const NDS_RATE = 0.20;
// NDS_RATE = 0.18; // ❌ Ошибка! TypeError

// Устаревший вариант (не рекомендуется)
var oldMeaning = "не используйте var";

Основные правила и соглашения

1. Имена могут содержать буквы, цифры, символы $ и _.
2. Первый символ не может быть цифрой.
3. Регистр букв имеет значение: myVar и myvar — разные переменные.
4. Нельзя использовать зарезервированные слова языка (например, let, if, return).

Рекомендуемые соглашения (стиль camelCase)

• Используйте осмысленные имена (userName, cartTotal), а не абстрактные (a, x1).
• Для имен, состоящих из нескольких слов, применяйте верблюжий регистр (camelCase): первое слово с маленькой буквы, каждое последующее — с большой.
• Константы, значения которых известны до выполнения кода, часто именуют в верхнем регистре с подчеркиваниями.

// ❌ Плохие имена
let a = 5;
let n = "Иван";

// ✅ Хорошие, понятные имена
let userAge = 30;
let fullName = "Иван Петров";
const maxScore = 100;

JavaScript — язык с динамической типизацией. Это означает, что тип данных переменной определяется автоматически в зависимости от хранимого в ней значения. Все типы делятся на примитивные (хранят одно значение) и объектные (более сложные структуры).

Основные примитивные типы данных

Особый случай — typeof null возвращает object. Это известная историческая ошибка языка, которую учитывают при разработке.

// Примеры различных типов
let project = "Веб-сайт"; // String
let budget = 150000; // Number
let isClosed = false; // Boolean
let details = null; // Null (значение установлено явно)
let deadlines; // Undefined (значение не задано)

console.log(typeof project); // "string"
console.log(typeof budget); // "number"
console.log(typeof details); // "object" (особенность языка!)

Определение типа

Оператор typeof возвращает строку с названием типа операнда.

let clients = 42;
let message = "42";
let isActive = true;

console.log(typeof clients); // "number"
console.log(typeof message); // "string"
console.log(typeof isActive); // "boolean"
console.log(typeof someVar); // "undefined"

Явное преобразование типов

Иногда нужно гарантированно получить значение определенного типа.

let userInput = "123"; // Это строка

// В число
let num = Number(userInput);
console.log(num); // 123 (число)
console.log(typeof num); // "number"

// В строку
let str = String(456);
console.log(str); // "456" (строка)

// В логическое значение
let bool = Boolean(1); // true
let bool2 = Boolean(0); // false
let bool3 = Boolean("Текст"); // true
let bool4 = Boolean(""); // false

Важно помнить про особенности: Number("Привет") даст NaN (Not-a-Number), Boolean("false") даст true, а Number(null) даст 0.

Арифметические операторы

Используются для математических действий:

• + Сложение (или конкатенация строк)
• - Вычитание
• * Умножение
• / Деление
• % Остаток от деления (модуль)
• ** Возведение в степень
• ++ Инкремент (увеличение на 1)
• -- Декремент (уменьшение на 1)

let a = 15;
let b = 4;

console.log(a + b); // 19
console.log(a - b); // 11
console.log(a * b); // 60
console.log(a / b); // 3.75
console.log(a % b); // 3 (остаток от деления)
console.log(a ** 2); // 225 (15 в квадрате)

let counter = 5;
counter++; // Увеличивает счетчик на 1 ПОСЛЕ использования
console.log(counter); // 6
let newCounter = ++counter; // Увеличивает ДО использования
console.log(newCounter); // 7

Операторы сравнения

Возвращают логическое значение (true/false):

• == Равно (нестрогое, с приведением типа)
• === Равно (строгое, по значению И типу) ← Рекомендуется
• != Не равно (нестрогое)
• !== Не равно (строгое) ← Рекомендуется
• > Больше, < Меньше
• >= Больше или равно, <= Меньше или равно

let x = 5;
let y = "5";

console.log(x == y); // true (значения одинаковы после приведения)
console.log(x === y); // false (типы разные: number vs string)
console.log(x !== y); // true (строгое "не равно" — типы разные)
console.log(x > 3); // true

Логические операторы

Работают с булевыми значениями:

• && И (true, если оба операнда true)
• || ИЛИ (true, если хотя бы один операнд true)
• ! НЕ (инвертирует значение)

let isLogin = true;
let isPassword = false;

console.log(isLogin && isPassword); // false (требуются оба)
console.log(isLogin || isPassword); // true (достаточно одного)
console.log(!isPassword); // true (инверсия false)

Задача

Создайте переменную, содержащую значение в долларах США, конвертируйте её в рубли и выведите результат в консоль в следующем формате:

Сумма в 100 долларов равна 7500 рублей

Для справки: 1 доллар США равен 75 рублям (курс условный).

Решение

// Конвертер долларов в рубли
const dollars = 100;
const exchangeRate = 75; // курс доллара к рублю
const rubles = dollars * exchangeRate;

// Вывод результата
console.log(`Сумма в ${dollars} долларов равна ${rubles} рублей`);

Вы начинаете знакомиться с основами JavaScript — инструмента, который оживляет веб. Чтобы перейти от теории к созданию реальных проектов, приглашаем на онлайн-курс «Обучение JavaScript с нуля до профи». Это структурированный путь от основ до продвитутого уровня с практическими задачами и поддержкой.

Если же вам нужен готовый результат — профессиональный сайт для бизнеса — наша веб-студия реализует ваш проект под ключ: от дизайна до сложной логики.🎯

Выберите свой формат: стать разработчиком или получить готовый digital-инструмент. Свяжитесь с нами для консультации.