Перейти к основному содержимому

Синтаксис и пунктуация в JavaScript

ОБЯЗАТЕЛЬНОДЛЯ НОВИЧКОВ
Разработчику Архитектору

Названия знаков по-английски и по-русски: Знаки препинания и символы в IT.

Общие принципы​

Знаки препинания в программировании выполняют синтаксические функции, аналогичные их роли в естественных языках. Каждый символ имеет конкретное назначение в контексте кода.

Поскольку этот язык первый в нашей энциклопедии в порядке изучения, сразу упомяну несколько моментов:

  1. Синтаксическая ошибка - это важно. Вы можете не заметить её - будьте внимательны.
  2. Самое распространённое - забыть поставить скобки для функций без аргументов - testFunction().
  3. Второе по распространённости - забыть поставить точку с запятой, или запятую там, где она нужна:
let user = {
    name: "Тимур" //здесь забыли запятую
    age: 28, // а здесь наоборот, запятая не нужна
}
  1. Третье - попросту перепутать символ, опечаткой, например, - вместо =, [] вместо {}, и так далее.

Современный JavaScript не ругается на отсутствие ; - отказываться от явного написания знаков стало трендом примерно после 2017 года. В 99% случаев точки с запятой можно опустить, но если вы пишете несколько команд в одну строку, придётся разделять:

let x = 1; let y = 2;

А так, зависит от команды. Порой консервативный стандарт присутствует, для гарантии безопасности кода, поэтому лучше уточняйте в команде по стилям написания - возможно, следует не ставить точки с запятой вовсе.

Кавычки​

Одинарные и двойные кавычки​

Для создания строковых литералов в JavaScript допустимо использование одинарных и двойных кавычек:

let name = "John";
let message = 'Hello!';

Разбор:

  • В примере создаются две строковые переменные через let: значение можно переопределить позже.
  • Двойные и одинарные кавычки в JavaScript равноправны для строковых литералов.
  • Ключевая задача — выбрать единый стиль и придерживаться его во всём проекте.
  • Такой код часто встречается при инициализации текстовых данных перед дальнейшей обработкой.

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

let sentence = "He's a developer";

Разбор:

  • Двойные кавычки снаружи позволяют оставить апостроф внутри строки без экранирования.
  • Если бы строка была в одинарных кавычках, потребовалось бы экранировать символ ' как \\'.
  • Такой приём повышает читаемость: код проще воспринимать без лишних обратных слэшей.
  • Переменная sentence хранит готовую фразу, которую можно выводить, сравнивать или передавать в функции.

При наличии двойных кавычек внутри строки предпочтительнее одинарные кавычки:

let quote = '"Hello", she said';

Разбор:

  • Здесь выбран внешний одинарный литерал, чтобы внутренние двойные кавычки использовать как часть текста.
  • Это зеркальная ситуация относительно предыдущего примера с апострофом.
  • Такой выбор уменьшает количество экранирований и делает строку визуально чище.
  • Переменная quote может использоваться как шаблон цитаты в интерфейсе или логах.

Шаблонные строки​

ES6 вводит шаблонные строки, использующие обратные кавычки:

let greeting = `Hello, ${name}`;

Разбор:

  • Обратные кавычки создают шаблонную строку (template literal).
  • ${name} — интерполяция: выражение внутри фигурных скобок вычисляется и подставляется в текст.
  • Это удобнее конкатенации через +, особенно когда переменных несколько.
  • Шаблонные строки также поддерживают многострочный текст без \\n в простых сценариях.

Шаблонные строки поддерживают интерполяцию переменных и многострочные литералы.

Стилевые соглашения​

В сообществе JavaScript преобладает использование одинарных кавычек, особенно при работе с инструментами автоматического форматирования кода. Окончательный выбор определяется стандартами конкретного проекта.

Точка, запятая и точка с запятой​

Точка​

Точка служит оператором доступа к свойствам и методам объектов:

console.log("Hello");
object.property;

Разбор:

  • console.log("Hello") вызывает метод log у объекта console и выводит строку в консоль.
  • Запись object.property демонстрирует доступ к свойству объекта через точку.
  • Точка в JavaScript работает как оператор навигации по структуре объекта.
  • Такой синтаксис одинаково применяется к встроенным объектам и пользовательским структурам.

Запятая​

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

  • Разделение параметров функций
  • Разделение элементов массивов
  • Разделение объявлений переменных в одном операторе
let x = 1, y = 2, z = 3;
function greet(name, age) {}
const array = [1, 2, 3, 4];

Разбор:

  • В первой строке запятая разделяет несколько объявлений переменных в одном операторе.
  • В сигнатуре greet(name, age) запятая разделяет параметры функции.
  • В массиве [1, 2, 3, 4] запятая разделяет элементы коллекции по индексам.
  • Один и тот же символ выполняет роль разделителя в разных синтаксических конструкциях.

Точка с запятой​

Точка с запятой завершает операторы в JavaScript. Механизм автоматической вставки точек с запятой делает их необязательными в большинстве случаев, однако явное использование рекомендуется для предотвращения потенциальных ошибок:

let a = 5;
let b = 10;
console.log(a + b);

Разбор:

  • Каждая строка завершена ;, что явно отделяет одну инструкцию от другой.
  • let a = 5 и let b = 10 создают две переменные для последующего вычисления.
  • console.log(a + b) показывает результат арифметического выражения в консоли.
  • Даже при наличии автоматической вставки ; явная пунктуация снижает риск неоднозначного разбора.

Явное применение точек с запятой особенно важно при работе с минификаторами кода и в строгих режимах выполнения.

Подчеркивания​

Соглашение о приватности​

Одинарное подчеркивание в начале имени свойства или метода сигнализирует о внутреннем использовании:

class MyClass {
    constructor() {
        this._logger = "internal";
    }
}

Разбор:

  • class MyClass объявляет класс — шаблон для создания объектов с общим поведением.
  • constructor() вызывается при создании экземпляра и инициализирует его состояние.
  • this._logger — свойство объекта; префикс _ здесь выступает соглашением "внутреннего" поля.
  • Технически доступ к такому полю извне не запрещён: это только договорённость команды.

Такое именование представляет собой соглашение между разработчиками. Классический JavaScript не обеспечивает реальной приватности через подчеркивания.

Реальная приватность​

Современный стандарт языка поддерживает настоящую приватность через символ решетки:

class MyClass {
    #logger = "private";
}

Разбор:

  • Поле #logger объявлено как приватное на уровне языка.
  • Доступ к нему возможен только внутри методов того же класса.
  • Попытка обратиться к instance.#logger снаружи вызовет синтаксическую ошибку.
  • Это реальный механизм инкапсуляции, в отличие от условного _logger.

Свойства с префиксом # недоступны извне класса.

Игнорирование в деструктуризации​

Подчеркивание применяется для явного игнорирования элементов при деструктуризации массивов:

const [first, , third] = [1, 2, 3];
const [first, _, third] = [1, 2, 3];

Разбор:

  • Оба примера используют деструктуризацию массива: значения извлекаются по позициям.
  • Вариант const [first, , third] пропускает второй элемент без создания переменной.
  • Вариант с _ явно создаёт переменную-заглушку для "ненужного" значения.
  • Итог одинаков: first получает 1, third получает 3.

Разделитель в числах​

Подчеркивание улучшает читаемость числовых литералов:

const billion = 1_000_000_000;
const million = 1_000_000;

Разбор:

  • Подчёркивания в числах — разделители разрядов для удобства чтения.
  • На вычисления они не влияют: интерпретатор воспринимает такие литералы как обычные числа.
  • 1_000_000_000 эквивалентно 1000000000, но заметно понятнее визуально.
  • Этот стиль особенно полезен в финансах, статистике и конфигурациях с большими числами.

Вертикальная черта​

Побитовое ИЛИ​

Одинарная вертикальная черта представляет операцию побитового ИЛИ:

const result = valueA | valueB;

Разбор:

  • | — побитовое ИЛИ: операция выполняется над битовыми представлениями чисел.
  • Результирующий бит равен 1, если хотя бы у одного операнда в этой позиции стоит 1.
  • Такой оператор часто применяется в низкоуровневой логике, флагах и масках состояний.
  • Для булевой логики условий обычно используют ||, а не |.

Логическое ИЛИ​

Двойная вертикальная черта выполняет логическую операцию ИЛИ с коротким замыканием:

if (methodA() || methodB()) {
    // methodB не вызывается, если methodA вернул истину
}

Разбор:

  • || — логическое ИЛИ с коротким замыканием (short-circuit).
  • Сначала вычисляется methodA(): если результат истинный, methodB() уже не вызывается.
  • Это ускоряет выполнение и предотвращает лишние или опасные побочные эффекты.
  • Конструкция полезна для цепочек проверок и значений по умолчанию.

При использовании логического ИЛИ возвращается первый истинный операнд:

console.log(0 || "hello"); // "hello"
console.log(null || undefined || "default"); // "default"

Разбор:

  • Оператор || возвращает не обязательно true/false, а первый truthy-операнд.
  • В выражении 0 || "hello" значение 0 falsy, поэтому выбирается "hello".
  • В цепочке null || undefined || "default" первые два значения falsy, и возвращается последний вариант.
  • Такой приём часто используют для задания дефолтов, но важно помнить о falsy-значениях вроде 0 и "".

Объединение типов в TypeScript​

В системе типов TypeScript вертикальная черта обозначает объединение типов:

let value: string | number;
let status: "active" | "inactive" | "pending";

Разбор:

  • В TypeScript | создаёт union-тип — объединение допустимых вариантов.
  • value: string | number разрешает либо строку, либо число в одной переменной.
  • status ограничен конкретными строковыми литералами, что делает состояние предсказуемым.
  • Компилятор проверяет присваивания и не позволит передать значение вне перечисленного набора.

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

Содержание