JavaScript
January 20

Основы JavaScript

JavaScript — это основной язык, который позволяет сделать сайты интерактивными и живыми. Он стал стандартом в веб-разработке, и изучение его с нуля станет первым шагом на пути в IT! 🚀


1.1. Переменные и типы данных

🛠️ Введение в переменные: var, let, const

Переменные — это контейнеры, в которые мы можем сохранять данные для последующего их использования.

var — старый способ объявления переменных. Имеет проблемы с областями видимости (обсудим далее).

let — новый способ, который решил проблемы var.

const — используется для записи данных, которые не должны изменяться.

💡 Совет

Используй let для переменных, которые будут меняться, а const для тех, которые неизменяемы.

Например, если у тебя есть значение, которое не будет изменяться, как число Pi, используй const.

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

  • Строка (string): 'Hello, world!'
  • Число (number): 42, 3.14
  • Булевы значения (boolean): true, false
  • undefined: значение по умолчанию, когда переменная еще не имеет значения
  • null: прозрачное не значение
  • Символы (symbol): специальные уникальные значения для объектов

🌐 Динамическая типизация

JavaScript — это язык с динамической типизацией, что означает, что тип переменной может изменяться в ходе выполнения программы.

💡 Совет

Чтобы избежать ошибок, старайтесь всегда явно указывать, какого типа данные ожидаются, и использовать встроенные функции проверки типа, например, typeof или instanceof. Это поможет сделать код более предсказуемым и читаемым.

let example = 42; // число
example = 'Теперь это строка'; // строка

Ошибки новичков

  • Использование var вместо let или const.
  • Перезапись значений переменной, объявленной с const.

1.2. Операторы и выражения

Арифметические, логические и сравнительные операторы

  • Арифметические операторы: +, -, *, /, % (остаток от деления), ** (возведение в степень)
  • Сравнительные операторы: >, <, >=, <=, ==, !=, ===, !==
  • Логические операторы: && (И), || (ИЛИ), ! (НЕ)
Пример:
let a = 5;
let b = 10;
console.log(a + b); // 15
console.log(a > b); // false
console.log(a < b && b > 0); // true

Порядок выполнения операторов (приоритет)

В JavaScript операторы имеют разный приоритет. Например, умножение выполняется раньше сложения.

Пример:

console.log(2 + 3 * 4); // 14
console.log((2 + 3) * 4); // 20

Условный оператор (тернарный оператор)

Сокращённая форма записи условий:

let age = 18;
let status = age >= 18 ? 'взрослый' : 'ребёнок';
console.log(status); // взрослый

Ошибки новичков

  • Использование == вместо === (рекомендуется строгое равенство).
  • Неправильное использование скобок в сложных выражениях.

1.3. Условные конструкции

if...else, вложенные условия

Условные конструкции позволяют выполнять код в зависимости от заданных условий:

let temperature = 30;
if (temperature > 25) {
  console.log('Жарко!');
} else {
  console.log('Прохладно.');
}

🔀 switch: когда и зачем использовать

switch удобен, когда есть несколько вариантов для сравнения:

let fruit = 'яблоко';
switch (fruit) {
  case 'яблоко':
    console.log('Это яблоко.');
    break;
  case 'банан':
    console.log('Это банан.');
    break;
  default:
    console.log('Фрукт не опознан.');
}jav

Ошибки новичков

  • Пропуск break в switch, что приводит к выполнению лишнего кода.
  • Неправильное использование условий в if.

1.4. Циклы

🔁 Виды циклов: for, while, do...while

  • for — используется, когда известен диапазон итераций.
  • while — выполняется, пока условие истинно.
  • do...while — выполняется хотя бы один раз, даже если условие ложно.

Пример:

for (let i = 0; i < 5; i++) {
  console.log(i); // 0, 1, 2, 3, 4
}

Прерывание и продолжение циклов (break, continue)

  • break: завершает цикл.
  • continue: пропускает текущую итерацию и переходит к следующей.

Пример:

for (let i = 0; i < 5; i++) {
  if (i === 3) break;
  if (i === 1) continue;
  console.log(i); // 0, 2
}

Ошибки новичков:

  • Бесконечные циклы из-за отсутствия изменения переменной.
  • Неправильное использование break и continue.

1.5. Работа с интерфейсом

🖥️ alert, prompt, confirm: практическое использование

  • alert: выводит сообщение.
  • prompt: запрашивает ввод данных у пользователя.
  • confirm: запрашивает подтверждение действия.

Пример:

alert('Добро пожаловать!');
let name = prompt('Как тебя зовут?');
let isSure = confirm('Ты уверен?');
console.log(name, isSure);

Ошибки новичков

  • Забывают, что prompt возвращает строку, даже если ввели число.
  • Используют alert слишком часто, что раздражает пользователей.