Самые популярные вопросы по JavaScript на собеседовании: разбор с примерами

19 марта 2026 г.

Собеседование на JavaScript-разработчика — это всегда проверка не только знания синтаксиса, но и понимания фундаментальных механизмов языка. Чтобы помочь вам систематизировать знания, мы собрали более 30 самых популярных вопросов, которые задают на технических интервью. Каждый вопрос сопровождается подробным ответом и примерами кода. Материал структурирован так, чтобы вы могли быстро повторить ключевые темы перед важной встречей.

Содержание:

1. Что такое замыкания (Closures)?

Замыкание — это комбинация функции и лексического окружения, в котором эта функция была объявлена. Другими словами, функция «запоминает» переменные из области видимости, где она была создана, даже после того, как эта область видимости перестала существовать.

function createCounter() {
    let count = 0;
    return function() {
        count++;
        return count;
    };
}

const counter = createCounter();
console.log(counter()); // 1
console.log(counter()); // 2

Здесь внутренняя функция имеет доступ к переменной count даже после завершения работы createCounter.

2. Как работает Event Loop?

Event Loop — это механизм, который позволяет JavaScript выполнять неблокирующие операции, несмотря на однопоточность. Он непрерывно проверяет, пуст ли стек вызовов, и если пуст — берет задачи из очередей.

Порядок выполнения:

  1. Сначала выполняются все синхронные задачи в стеке вызовов.

  2. Затем выполняются все микрозадачи (Promise.then, catch, finally, MutationObserver, queueMicrotask).

  3. После этого выполняется одна макрозадача (setTimeout, setInterval, I/O, UI-рендеринг).

  4. Цикл повторяется.

3. Что такое прототипы и прототипное наследование?

Каждый объект в JavaScript имеет скрытое свойство [[Prototype]], которое ссылается на другой объект (его прототип) или null. При доступе к свойству объекта, если его нет в самом объекте, поиск продолжается в прототипе, затем в прототипе прототипа и так далее — это и есть прототипная цепочка.

const parent = { name: 'Parent' };
const child = Object.create(parent);
child.age = 5;

console.log(child.age); // 5 (собственное свойство)
console.log(child.name); // 'Parent' (из прототипа)

4. Как работает ключевое слово this?

Значение this определяется не местом объявления функции, а контекстом вызова:

  • Глобальный контекст: window (браузер) или global (Node.js).

  • Метод объекта: ссылается на объект.

  • Простая функция: в нестрогом режиме — глобальный объект, в строгом — undefined.

  • Стрелочная функция: не имеет своего this, берет из внешней области.

  • Конструктор (new): ссылается на новый созданный объект.

  • Event listener: ссылается на элемент, на который повешен обработчик.

5. Чем отличаются var, let и const?

Характеристика

var

let

const

Область видимости

Функциональная

Блочная

Блочная

Поднятие (hoisting)

Да (инициализация undefined)

Да (TDZ, нет инициализации)

Да (TDZ, нет инициализации)

Переопределение

Можно

Можно

Нельзя (для примитивов)

Переобъявление

Можно

Нельзя

Нельзя

const запрещает переприсваивание, но если значение — объект, его свойства изменять можно.

6. Что такое промисы (Promises)?

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

  • pending (ожидание) — начальное состояние.

  • fulfilled (выполнено) — операция завершена успешно.

  • rejected (отклонено) — операция завершена с ошибкой.

const promise = new Promise((resolve, reject) => {
    setTimeout(() => resolve('Успех'), 1000);
});

promise.then(result => console.log(result));

7. Чем async/await отличается от промисов?

async/await — это синтаксический сахар над промисами, делающий асинхронный код более читаемым (похожим на синхронный).

  • async функция всегда возвращает промис.

  • await приостанавливает выполнение функции до разрешения промиса.

async function fetchData() {
    try {
        const response = await fetch('url');
        const data = await response.json();
        return data;
    } catch (error) {
        console.error(error);
    }
}

8. Что такое тип данных Symbol?

Symbol — это уникальный и неизменяемый примитивный тип, который часто используется как ключ для свойств объектов, чтобы избежать конфликтов имен.

const sym1 = Symbol('description');
const sym2 = Symbol('description');
console.log(sym1 === sym2); // false

Свойства с ключами-символами не перечисляются в циклах for...in и не видны в Object.keys(), что позволяет создавать скрытые, служебные свойства.

9. Что такое декораторы?

Декораторы — это функции, которые позволяют оборачивать другие функции или классы для расширения их функциональности (логирование, проверка доступа, кеширование). На данный момент это предложение для стандарта (stage 3), но активно используется в TypeScript.

function log(target, name, descriptor) {
    const original = descriptor.value;
    descriptor.value = function(...args) {
        console.log(`Call: ${name}`);
        return original.apply(this, args);
    };
    return descriptor;
}

10. Что такое генераторы (Generators)?

Генераторы — это функции, выполнение которых можно приостанавливать и возобновлять. Они объявляются через function* и используют yield для возврата значения и паузы.

function* generator() {
    yield 1;
    yield 2;
    return 3;
}

const gen = generator();
console.log(gen.next()); // { value: 1, done: false }
console.log(gen.next()); // { value: 2, done: false }
console.log(gen.next()); // { value: 3, done: true }

11. Чем отличаются операторы == и ===?

  • == (абстрактное равенство): сравнивает значения, приводя их к одному типу (преобразование типов).

  • === (строгое равенство): сравнивает значения без приведения типов.

console.log(5 == '5');  // true
console.log(5 === '5'); // false

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

12. Что такое IIFE (Immediately Invoked Function Expression)?

IIFE — это функция, которая выполняется сразу после определения. Используется для создания изолированной области видимости и избежания загрязнения глобального пространства.

(function() {
    var privateVar = 'секрет';
    console.log('Выполнилась сразу');
})();

// privateVar недоступна снаружи

13. Что такое всплытие событий (Event Bubbling) и делегирование?

Всплытие: событие сначала срабатывает на самом элементе, затем на его родителе, и так до корня документа.

Делегирование: техника, при которой обработчик вешается на родителя, а ловит события от дочерних элементов благодаря всплытию. Это эффективно для динамических списков.

document.querySelector('#parent').addEventListener('click', (e) => {
    if (e.target.tagName === 'LI') {
        console.log('Клик по li');
    }
});

14. Как работает метод bind, call и apply?

  • call(thisArg, arg1, arg2): вызывает функцию с указанным this и аргументами (перечислением).

  • apply(thisArg, [argsArray]): то же, но аргументы передаются массивом.

  • bind(thisArg, arg1, arg2): возвращает новую функцию с привязанным this и, опционально, частью аргументов.

15. Что такое чистые функции (Pure Functions)?

Чистая функция — это функция, которая:

  1. Всегда возвращает одинаковый результат для одинаковых аргументов.

  2. Не имеет побочных эффектов (не изменяет внешние переменные, не делает запросы, не меняет переданные объекты).

// Чистая
function add(a, b) { return a + b; }

// Нечистая
let total = 0;
function addToTotal(value) { total += value; }

16. Что такое поднятие (Hoisting)?

Hoisting — это механизм, при котором объявления переменных и функций перемещаются вверх своей области видимости до выполнения кода.

  • function — поднимается полностью.

  • var — поднимается объявление, инициализация остается (переменная получает undefined).

  • let/const — поднимаются, но не инициализируются (попадают во временную мертвую зону).

17. Что такое временная мертвая зона (TDZ)?

Временная мертвая зона — это промежуток от входа в область видимости до фактического объявления переменной с let или const. В этом промежутке переменная существует, но обратиться к ней нельзя — будет ошибка ReferenceError.

18. Что такое строгий режим ('use strict')?

Директива 'use strict' включает строгий режим выполнения JavaScript, который:

  • Запрещает использование необъявленных переменных.

  • Делает this в функциях равным undefined вместо глобального объекта.

  • Запрещает дублирование параметров в функциях.

  • И другие улучшения безопасности.

19. Что такое Map, Set, WeakMap и WeakSet?

  • Map — коллекция ключ-значение, где ключом может быть любой тип.

  • Set — коллекция уникальных значений.

  • WeakMap — аналог Map, но ключи — только объекты, и они хранятся слабо (не мешают сборщику мусора).

  • WeakSet — аналог Set, хранит только объекты слабо.

20. Что такое функции высшего порядка (Higher-Order Functions)?

Это функции, которые либо принимают другую функцию как аргумент, либо возвращают функцию, либо и то, и другое. Примеры: map, filter, reduce, setTimeout.

21. Какие методы массивов ты знаешь (map, filter, reduce)?

  • map — создает новый массив, преобразуя каждый элемент.

  • filter — создает новый массив только с элементами, прошедшими проверку.

  • reduce — последовательно обрабатывает элементы, накапливая результат.

[1, 2, 3].map(x => x * 2); // [2, 4, 6]
[1, 2, 3].filter(x => x > 1); // [2, 3]
[1, 2, 3].reduce((sum, x) => sum + x, 0); // 6

22. Что такое операторы расширения (spread) и остатка (rest)?

  • Spread (...) — разворачивает массив/объект на отдельные элементы.

  • Rest (...) — собирает оставшиеся аргументы функции в массив.

// Spread
const arr = [1, 2, 3];
const newArr = [...arr, 4]; // [1, 2, 3, 4]

// Rest
function sum(...numbers) {
    return numbers.reduce((acc, n) => acc + n);
}

23. Что такое деструктуризация (Destructuring)?

Синтаксис, позволяющий извлекать значения из массивов или свойств объектов в отдельные переменные.

const user = { name: 'John', age: 30 };
const { name, age } = user;

const arr = [1, 2, 3];
const [first, second] = arr;

24. Что такое опциональная цепочка (Optional Chaining) ?.

Оператор ?. позволяет безопасно обращаться к вложенным свойствам, не проверяя существование каждого промежуточного. Если значение равно null или undefined, выражение коротко замыкается и возвращает undefined.

const user = {};
console.log(user?.profile?.name); // undefined (без ошибки)

25. Что такое оператор нулевого слияния (Nullish Coalescing) ??

Оператор ?? возвращает правый операнд, если левый равен null или undefined, иначе — левый. Отличается от || тем, что || отсеивает все falsy-значения (0, '', false).

const count = 0;
console.log(count || 10); // 10
console.log(count ?? 10); // 0

26. Что такое стек вызовов (Call Stack)?

Call Stack — это механизм, который записывает, в какой точке выполнения находится программа. При вызове функции она помещается в стек, при возврате — извлекается. Если стек переполняется (например, бесконечная рекурсия), возникает ошибка.

27. Что такое микрозадачи и макрозадачи?

  • Макрозадачи: setTimeout, setInterval, I/O, UI rendering.

  • Микрозадачи: Promise.then/catch/finally, queueMicrotask, MutationObserver.

Микрозадачи имеют более высокий приоритет и выполняются сразу после синхронного кода, до следующей макрозадачи.

28. Как работают промисы в цикле событий?

Колбэки промисов (then/catch/finally) попадают в очередь микрозадач. Это значит, что они выполняются до setTimeout и других макрозадач, но после синхронного кода.

29. Что вернет async функция, если внутри нет await?

async функция всегда возвращает промис. Если явно не вернуть значение, промис разрешится со значением undefined. Если вернуть не промис — он будет обернут в промис.

async function test() {
    return 42;
}
test().then(console.log); // 42

30. Что такое псевдомассив arguments?

arguments — это массивоподобный объект, доступный внутри всех функций (кроме стрелочных), содержащий переданные аргументы. У него есть длина и индексы, но нет методов массива (push, forEach).

31. Что такое функция-конструктор и оператор new?

Функция-конструктор — это обычная функция, вызываемая с new. При таком вызове:

  1. Создается новый пустой объект.

  2. Этот объект привязывается к this.

  3. Устанавливается прототип.

  4. Функция возвращает этот объект.

function User(name) {
    this.name = name;
}
const user = new User('John');

32. Что такое классы (Classes) в ES6?

Классы в ES6 — это синтаксический сахар над функциями-конструкторами и прототипным наследованием. Они предоставляют более понятный и привычный способ создания объектов и организации наследования.

class Animal {
    constructor(name) {
        this.name = name;
    }
    speak() {
        console.log(`${this.name} издает звук`);
    }
}

class Dog extends Animal {
    speak() {
        console.log(`${this.name} лает`);
    }
}