Ключевые особенности JavaScript?

JavaScript – динамически типизированный, интерпретируемый язык сценариев, исполняемый в браузере (и на сервере через Node.js). Он поддерживает прототипное ООП, функции как объекты первого класса, асинхронность через событийный цикл, и используется для придания интерактивности веб-страницам.

В чём разница между JavaScript и Java?

Помимо похожего названия, JavaScript и Java – совершенно разные языки. Java – статически типизированный компилируемый язык, а JavaScript – динамический интерпретируемый язык сценариев. Код Java выполняется в виртуальной машине (JVM), а JavaScript – в браузере или среде Node.js. У них разный синтаксис и области применения.

Каковы преимущества JavaScript?

Основные преимущества JavaScript: он выполняется прямо в браузере, что позволяет создавать интерактивные интерфейсы без перезагрузки страницы. JavaScript имеет простой синтаксис и гибкость динамического языка, широкую экосистему (библиотеки и фреймворки), а также позволяет использовать единый язык как на фронтенде, так и на сервере (Node.js).

Какие есть недостатки у JavaScript?

Среди недостатков JavaScript часто упоминают отсутствие статической типизации (что может приводить к ошибкам во время выполнения), некоторую непоследовательность или «странности» языка (например, особенности приведения типов), а также проблемы безопасности – исполнение кода на стороне клиента может быть уязвимо для XSS-атак. Кроме того, код JavaScript зависит от среды (неодинаковая поддержка в разных браузерах, хотя современные стандарты это сглаживают).

Какие типы данных существуют в JavaScript?

В JavaScript есть 8 типов данных: семь примитивных (number, string, boolean, null, undefined, symbol, bigint) и один нефундаментальный тип – object. Объекты включают в себя и специальные виды, например функции, массивы – они тоже относятся к типу object.

Что такое примитивные типы данных в JavaScript?

Примитивные типы – это типы данных, которые не являются объектами. К примитивам относятся: number (число), string (строка), boolean (логическое значение), null, undefined, symbol и bigint. Примитивы иммутабельны (неизменяемы) – операции с ними создают новые значения.

Что означает динамическая типизация в JavaScript?

Динамическая типизация означает, что тип переменной не фиксирован и может меняться в ходе исполнения. Переменной в JavaScript можно присвоить значение любого типа, и проверка типов происходит непосредственно во время выполнения (а не на этапе компиляции). Также за счёт динамической типизации JavaScript сам неявно приводит типы в некоторых операциях.

Как объявить переменную в JavaScript?

Для объявления переменных используются ключевые слова `var`, `let` или `const`. Например: `var x = 5;`, `let name = "Иван";` или `const PI = 3.14;`. Ключевое слово `var` объявляет переменную в функциональной (или глобальной) области видимости, `let` и `const` – в блочной области видимости. `const` используется для переменных, значение которых не планируется переназначать.

В чём разница между var, let и const?

Ключевые слова `let` и `const` введены в ES6 и решают ряд проблем `var`. Переменные, объявленные через `var`, имеют функциональную или глобальную область видимости и поднимаются (hoisting) в начало функции. `let` и `const` имеют блочную область видимости (доступны только внутри блока `{ ... }`) и не поднимаются – использование до объявления вызывает ошибку. Кроме того, переменную `var` можно повторно объявлять в одной области, а `let`/`const` – нельзя. `const` сходен с `let`, но присваивание значения обязательно сразу при объявлении, и дальнейшее переназначение этому идентификатору запрещено (то есть сама ссылка остаётся константой).

Что такое поднятие (hoisting) переменных и функций?

Hoisting («поднятие») – это поведение JavaScript, при котором объявления переменных и функций как бы перемещаются интерпретатором в начало своей области видимости. Например, функции, объявленные как `function declaration`, полностью поднимаются – ими можно воспользоваться до места объявления в коде. Переменные, объявленные через `var`, тоже поднимаются, но без инициализации – до присваивания их значение будет `undefined`. Объявления `let`/`const` также концептуально поднимаются, но находятся во «временной мёртвой зоне», и доступ к ним до инициализации вызывает ошибку.

Какие значения в JavaScript являются «ложными» (falsy)?

Ложными (falsy) называются значения, которые при приведении к булевому типу дают `false`. К таким значениям относятся: `false`, `0` (и `-0`), `0n` (BigInt ноль), пустая строка `\"\"`, `null`, `undefined` и `NaN`. Все остальные значения считаются «истинными» (truthy) и при приведении к boolean дают `true`.

В чём разница между операторами == и ===?

Оператор нестрогого равенства `==` сравнивает значения с приведением типов – перед сравнением JavaScript при необходимости приводит операнды к общему типу. Например, `"5" == 5` вернёт true, т.к. строка `"5"` неявно приводится к числу 5. Оператор строгого равенства `===` сравнивает без приведения типов – он возвращает true только если операнды равны по значению *и* имеют одинаковый тип. Например, `"5" === 5` вернёт false, поскольку типы отличаются (string vs number).

В чём разница между значениями null и undefined?

`undefined` и `null` оба представляют «отсутствие значения», но различаются по смыслу. `undefined` – значение по умолчанию для необъявленной или неинициализированной переменной, а также возвращается, когда функция ничего не возвращает. `null` же устанавливается явно, когда хотят указать «нет значения». По типам: `undefined` – примитивный тип *undefined*, а `null` имеет свой примитивный тип *null*. При нестрогом сравнении `null == undefined` возвращает true, но при строгом сравнении они различны.

Что такое NaN и какого типа это значение?

NaN расшифровывается как «Not-A-Number» – специальное числовое значение, обозначающее результат некорректной математической операции. Тип NaN – число (Number), то есть `typeof NaN` возвращает `"number"`. NaN является уникальным тем, что не равен ничему, даже самому себе: выражение `NaN === NaN` даст false.

Как проверить, что переменная имеет значение NaN?

Нельзя проверить NaN простым сравнением, поскольку NaN не равен даже самому себе. Для проверки используют встроенные методы: глобальную функцию `isNaN(x)` или лучше метод `Number.isNaN(x)` (он строже и не приводит типы). Например, `Number.isNaN(NaN)` вернёт true. Также можно проверить через сравнение с самим собой: `x !== x` будет true только для NaN.

Как определить тип переменной в JavaScript?

Для определения типа значения используется оператор `typeof`. Он возвращает строку с названием типа: например, `typeof 42` возвращает `"number"`, `typeof "Hello"` – `"string"`. Для null есть особенность: `typeof null` возвращает `"object"` (это историческая ошибка в языке). Также для функций оператор typeof возвращает `"function"` (хотя функции являются объектами).

Как преобразовать строку в число в JavaScript?

Есть несколько способов: можно использовать встроенную функцию `Number(строка)` – она вернёт числовое значение строки (или NaN, если преобразование невозможно). Также можно использовать `parseInt(строка)` для целого числа (анализирует строку до первого нецифрового символа) или `parseFloat(строка)` для числа с плавающей точкой. Ещё один короткий способ – унарный плюс: например, `+\"123\"` приведёт строку `"123"` к числу 123.

Как преобразовать число в строку в JavaScript?

Число можно конвертировать в строку разными способами. Самый простой – метод `.toString()`: например, `(123).toString()` вернёт `"123"`. Также можно конкатенировать число с пустой строкой: `123 + ""` даст строку `"123"`. Есть и функция `String(значение)`, которая возвращает строковое представление любого значения.

Что такое массив в JavaScript?

Массив – это встроенный объект в JavaScript, предназначенный для хранения упорядоченных коллекций значений. Массивы индексируются по целым числам, имеют свойство `.length` (количество элементов) и наследуют различные методы для обработки данных. В JavaScript массивы могут динамически изменять длину и содержать элементы разных типов.

Как добавить элемент в конец массива?

Для добавления элемента в конец массива используется метод `push`. Например: `let arr = [1,2]; arr.push(3);` – теперь массив arr станет `[1,2,3]`. Метод push может добавлять сразу несколько элементов: `arr.push(4,5)` добавит оба элемента в конец.

Как удалить последний элемент из массива?

Чтобы удалить последний элемент массива, применяют метод `pop`. Он удаляет последний элемент и возвращает его значение. Например: `let arr = [1,2,3]; let last = arr.pop();` – массив arr станет `[1,2]`, а переменная last получит удалённое значение `3`.

Как добавить элемент в начало массива?

Для добавления элемента в начало массива используется метод `unshift`. Он сдвигает существующие элементы вправо и вставляет новые в начале. Например: `let arr = [2,3]; arr.unshift(1);` – теперь массив arr станет `[1,2,3]`.

Как удалить первый элемент массива?

Удалить первый элемент можно методом `shift`. Он удаляет элемент с нулевым индексом и возвращает его. Пример: `let arr = [1,2,3]; let first = arr.shift();` – массив arr станет `[2,3]`, а переменная first будет равна `1`.

Как вставить элемент в массив по определённому индексу?

Для вставки (а также удаления) элементов в произвольное место массива используют метод `splice`. Его синтаксис: `arr.splice(начальныйIndex, сколькоУдалить, элемент1, элемент2, ...)`. Чтобы вставить без удаления, указывают второй аргумент 0. Например: `arr.splice(2, 0, "новый")` вставит значение `"новый"` на индекс 2, не удаляя существующие элементы.

Как удалить элемент массива по индексу?

Метод `splice` позволяет удалять элемент по индексу. Достаточно указать индекс и количество удаляемых элементов. Например: `arr.splice(3, 1)` удалит один элемент с индексом 3 из массива. Возвращаемое значение splice – массив удалённых элементов (в данном случае с одним элементом).

Как создать копию массива (клонировать массив)?

Самый простой способ поверхностно скопировать массив – использовать метод `slice` без аргументов: `let newArr = oldArr.slice()`. Также можно использовать оператор распространения: `let newArr = [...oldArr]`. Оба метода создают новый массив с теми же элементами. (Важно понимать, что при этом вложенные объекты не клонируются – будет копироваться только ссылка на них.)

Что такое объект в JavaScript и как его создать?

Объект – это структура данных «ключ-значение». Проще всего создать объект с помощью литерала: например, `let user = { name: "Иван", age: 30 }`. Можно создавать объекты через конструктор: `let obj = new Object();` – а затем добавлять свойства, но литерал используется чаще. Объекты могут хранить свойства (поля) и методы (функции в качестве значений).

Как удалить свойство из объекта?

Для удаления свойства объекта используется оператор `delete`. Синтаксис: `delete объект.имяСвойства`. Например: `delete user.age;` удалит свойство age из объекта user. После этого `user.age` станет undefined. Стоит заметить, что `delete` удаляет свойство именно из объекта, но не затрагивает его прототип (если одноимённое свойство имеется в прототипе).

Что такое JSON и для чего он используется?

JSON (JavaScript Object Notation) – это текстовый формат для представления структурированных данных, основанный на синтаксисе объектов JavaScript. Он используется для хранения и обмена данными между системами (например, между клиентом и сервером). Формат JSON – человеческо-читаемый: данные записываются в виде пар ключ-значение в фигурных скобках (объекты) и списков в квадратных (массивы). Несмотря на происхождение из JavaScript, JSON – независимый формат, поддерживается многими языками.

Как конвертировать объект JavaScript в JSON-строку?

В JavaScript есть встроенный метод для этого: `JSON.stringify`. Он принимает значение (обычно объект) и возвращает строку в формате JSON. Например: `let json = JSON.stringify(userObj)`. Полученная строка может быть передана или сохранена (например, отправлена на сервер).

Как из JSON-строки получить объект JavaScript?

Для обратного преобразования служит метод `JSON.parse`. Он принимает строку JSON и возвращает соответствующее значение (объект, массив или другой тип). Пример: `let obj = JSON.parse(jsonStr)`. Если строка содержит корректный JSON, в переменной obj получится объект с данными из этой строки.

Что такое DOM?

DOM (Document Object Model) – объектная модель документа. Проще говоря, браузер представляет загруженную HTML-страницу в виде иерархического дерева объектов, где каждый узел соответствует элементу, тексту, атрибуту и т.д. JavaScript может взаимодействовать с DOM: менять структуру страницы, стили, содержимое, реагировать на события. DOM – это интерфейс между языком и структурой HTML-документа.

Как получить элемент на странице по его id?

Самый простой способ – использовать метод `document.getElementById("идентификатор")`. Он вернёт элемент с заданным атрибутом id или `null`, если такого нет. Например: `let header = document.getElementById("header");`. Кроме того, можно использовать универсальный метод `document.querySelector("#идентификатор")` – он делает то же самое при передаче селектора с #.

Чем отличается document.querySelector от document.getElementById?

Метод `document.getElementById` ищет элемент по exact-id и возвращает первый найденный. `querySelector` более универсальный: он принимает любой CSS-селектор (класс, тег, комбинации селекторов) и возвращает первый подходящий элемент. Например, `document.querySelector(".item")` найдёт первый элемент с классом item. Однако `querySelector("#id")` и `getElementById("id")` при одинаковом id в целом вернут тот же элемент. Разница ещё и в том, что querySelector может возвращать `null` для несуществующего селектора, тогда как getElementById вернёт `null` для отсутствующего id (в современных браузерах поведение схоже). По производительности прямой поиск по id может быть немного быстрее.

В чём разница между свойствами innerHTML и textContent?

`elem.innerHTML` возвращает HTML-содержимое элемента в виде строки, включая теги, и позволяет задавать HTML-разметку внутри элемента. `elem.textContent` же возвращает только текст внутри элемента (без разметки) и, при присваивании, устанавливает текст, трактуя переданные символы как обычный текст. То есть `innerHTML = " Hi "` вставит тег ` `, а `textContent = " Hi "` выведет буквально ` Hi ` как текст. Также `textContent` безопасен с точки зрения HTML – он не интерпретирует строки как HTML, поэтому используется для вставки пользовательского текста во избежание XSS.

Как добавить CSS-класс элементу?

В JavaScript доступно свойство `element.classList` – это специальный объект для управления классами элемента. Чтобы добавить класс, используют метод `element.classList.add("className")`. Например: `elem.classList.add("active")` добавит элементу класс active (не затрагивая другие классы). Альтернативно, можно через свойство className, но тогда придётся присваивать всю строку классов целиком.

Как удалить CSS-класс у элемента?

Для удаления класса из элемента также используется его свойство `classList`. Метод `element.classList.remove("className")` убирает указанный класс. Например: `button.classList.remove("disabled")` – удалит у элемента button класс disabled. Также есть метод `toggle`, который переключает наличие класса (добавляет если не было, удаляет если был).

Как назначить обработчик события на элемент?

Самый распространённый способ – метод `element.addEventListener("event", handler)`. Например: `button.addEventListener("click", function() { ... });` – назначит элементу button обработчик клика. Событие передаётся в виде строки (\"click\"), а обработчик – функция. Можно добавить несколько обработчиков на одно событие этим методом. Альтернативно, у элемента есть свойства-обработчики (типа `elem.onclick = ...`), но при их использовании хранится только один обработчик за раз.

Что такое всплытие событий?

Всплытие событий – механизм, при котором событие, произошедшее на вложенном элементе, автоматически поднимается вверх по дереву DOM к родительским элементам. Например, если кликнуть на кнопке внутри формы, сначала срабатывает обработчик клика на самой кнопке (если есть), затем событие \"всплывает\" к родителю (форме) и вызывает её обработчик клика, затем – к более внешнему элементу и так далее, вплоть до объекта `document`. Всплытие позволяет обрабатывать событие на более высоком уровне, не назначая обработчик на каждый вложенный элемент.

Что такое погружение (capture) событий?

Погружение (или захват событий) – это фаза, противоположная всплытию. Сначала событие \"спускается\" от корневого элемента документа к конкретному целевому элементу, проходя через предков. Обычно по умолчанию обработчики срабатывают на фазе всплытия, но можно обрабатывать событие на этапе погружения, передав третий аргумент `true` в addEventListener. Тогда обработчик будет вызван во время этапа захвата, то есть от родителя к потомку, прежде чем событие достигнет целевого элемента.

Для чего используется метод event.preventDefault()?

Метод `event.preventDefault()` отменяет действие по умолчанию для события, если оно предусмотрено. Например, если вызвать preventDefault() в обработчике отправки формы (submit), форма не будет отправлена, или если применить в обработчике клика по ссылке – переход по ссылке отменится. Этот метод полезен, когда нужно переопределить стандартное поведение элемента (например, реализовать свою логику обработки вместо перехода).

Как обработать исключения (ошибки) в JavaScript?

Для перехвата и обработки ошибок используется конструкция `try...catch`. Код, который может вызвать ошибку, размещается внутри блока `try`, а блок `catch` выполняется, если в try произошла ошибка – в него передаётся объект ошибки, и там можно обработать ситуацию (например, вывести сообщение). Также есть блок `finally`, который выполняется после try/catch в любом случае (ошибка произошла или нет). Кроме того, в промисах и async/await ошибки обрабатываются соответственно через `.catch()` и через try/catch внутри async-функции.

Что такое строгий режим ("use strict") и как его включить?

Строгий режим – это режим выполнения JavaScript, вводящий более строгие правила и проверки. Он устраняет некоторые неочевидные моменты языка. В строгом режиме, например, запрещено использование необъявленных переменных, значение `this` в функции, вызванной без контекста, будет undefined (вместо глобального объекта), и ряд «молчащих» ошибок превращаются в явные. Включается строгий режим добавлением строки `"use strict";` в начале скрипта или отдельной функции.

Что такое функция обратного вызова (callback)?

Callback-функция – это функция, переданная как аргумент другой функции для последующего вызова. Как правило, «функция обратного вызова» вызывается после наступления какого-то события или по завершении операции. Например, можно передать функцию в `setTimeout`, и эта функция выполнится через заданное время. Таким образом, callback позволяет одним функциям вызывать другие, обеспечивая гибкость и асинхронность в коде.

Что такое Promise?

Promise (промис) – это объект, представляющий результат асинхронной операции. Промис может находиться в одном из трёх состояний: *ожидание* (pending) – операция ещё не завершилась, *исполнено* (fulfilled) – операция завершилась успешно, и *отклонено* (rejected) – произошла ошибка. Используя промисы, можно удобно обрабатывать асинхронные результаты: метод `.then` – для успешного результата, `.catch` – для ошибок, и `.finally` – для действия после завершения (в любом случае).

Что такое async/await?

`async/await` – это синтаксический сахар над промисами, упрощающий написание асинхронного кода. Ключевое слово `async` перед определением функции помечает её как асинхронную – такая функция всегда возвращает промис. Внутри async-функции можно использовать оператор `await` перед вызовом промиса – выполнение при этом приостанавливается, ожидая разрешения промиса. Код с `await` выглядит как последовательный (\"синхронный\"), хотя под капотом продолжает использовать промисы. Это улучшает читаемость и упрощает обработку ошибок (можно применять обычный try/catch внутри async-функции).

В чём разница между синхронным и асинхронным кодом?

Синхронный код выполняется последовательно – каждая операция должна завершиться, прежде чем начнётся следующая. Асинхронный код позволяет запускать операции (например, сетевые запросы) параллельно или откладывать их завершение, не блокируя основной поток. При асинхронном подходе длительные операции могут выполняться \"в фоне\", а основной скрипт продолжит работу. JavaScript однопоточный, но асинхронность достигается через механизм событий и колбеков/промисов: например, запрос отправляется, а результат обрабатывается колбеком позже, не останавливая всю программу в ожидании ответа.

Для чего нужны функции setTimeout и setInterval?

Эти функции позволяют выполнять код с задержкой или через определённые интервалы времени. `setTimeout(func, delay)` вызывает функцию `func` один раз через указанное количество миллисекунд (`delay`). `setInterval(func, delay)` – вызывает `func` регулярно, каждые `delay` миллисекунд, пока не будет остановлен (с помощью `clearInterval`). Они полезны для отложенного выполнения или периодических операций (например, обновление данных каждую секунду).

Что такое ECMAScript?

ECMAScript – это стандарт, описывающий язык JavaScript. Проще говоря, ECMAScript – официальное название спецификации языка, а \"JavaScript\" – реализация этой спецификации в браузерах. Новые версии стандарта ECMAScript (ES5, ES6/ES2015, ES2020 и т.д.) определяют новые возможности языка, которые затем реализуются в JavaScript-движках браузеров и других сред.

Какие новые возможности появились в ES6?

ES6 (также известный как ES2015) привнёс значительное обновление языка. К ключевым новшествам относятся: стрелочные функции (`=>`), блоковая область видимости (`let` и `const` вместо var), параметры по умолчанию и rest/spread операторы (`...`), деструктуризация объектов и массивов, шаблонные строки (интерполяция через ``), классы (синтаксический сахар над прототипами), Promises для работы с асинхронностью, а также новые типы (Symbol) и структуры данных (Map, Set).

Что такое шаблонные строки (template literals) в JavaScript?

Шаблонные строки – это способ создания строк, появившийся в ES6, который позволяет вставлять переменные и выражения внутрь строки. Они заключаются в обратные кавычки `` вместо обычных кавычек. Внутри шаблонной строки можно использовать синтаксис `${...}` для интерполяции значений. Также шаблонные строки поддерживают многострочность без специальных символов. Например: ``Hello, ${name}!`` вставит значение переменной name.

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

JavaScript/TypeScript: вопросы и ответы. Раздел охватывает: область видимости, hoisting и замыкания; прототипы, классы и this; асинхронность (промисы, async/await, event loop); модули и сборку (Webpack, Vite, Babel, Rollup); DOM и браузерные API; производительность и оптимизацию; TypeScript; React/Vue и сопутствующие паттерны.

Всего вопросов: 169

Junior

Ключевые особенности JavaScript? Junior

JavaScript – динамически типизированный, интерпретируемый язык сценариев, исполняемый в браузере (и на сервере через Node.js). Он поддерживает прототипное ООП, функции как объекты первого класса, асинхронность через событийный цикл, и используется для придания интерактивности веб-страницам.
В чём разница между JavaScript и Java? Junior

Помимо похожего названия, JavaScript и Java – совершенно разные языки. Java – статически типизированный компилируемый язык, а JavaScript – динамический интерпретируемый язык сценариев. Код Java выполняется в виртуальной машине (JVM), а JavaScript – в браузере или среде Node.js. У них разный синтаксис и области применения.
Каковы преимущества JavaScript? Junior

Основные преимущества JavaScript: он выполняется прямо в браузере, что позволяет создавать интерактивные интерфейсы без перезагрузки страницы. JavaScript имеет простой синтаксис и гибкость динамического языка, широкую экосистему (библиотеки и фреймворки), а также позволяет использовать единый язык как на фронтенде, так и на сервере (Node.js).
Какие есть недостатки у JavaScript? Junior

Среди недостатков JavaScript часто упоминают отсутствие статической типизации (что может приводить к ошибкам во время выполнения), некоторую непоследовательность или «странности» языка (например, особенности приведения типов), а также проблемы безопасности – исполнение кода на стороне клиента может быть уязвимо для XSS-атак. Кроме того, код JavaScript зависит от среды (неодинаковая поддержка в разных браузерах, хотя современные стандарты это сглаживают).
Какие типы данных существуют в JavaScript? Junior

В JavaScript есть 8 типов данных: семь примитивных (number, string, boolean, null, undefined, symbol, bigint) и один нефундаментальный тип – object. Объекты включают в себя и специальные виды, например функции, массивы – они тоже относятся к типу object.
Что такое примитивные типы данных в JavaScript? Junior

Примитивные типы – это типы данных, которые не являются объектами. К примитивам относятся: number (число), string (строка), boolean (логическое значение), null, undefined, symbol и bigint. Примитивы иммутабельны (неизменяемы) – операции с ними создают новые значения.
Что означает динамическая типизация в JavaScript? Junior

Динамическая типизация означает, что тип переменной не фиксирован и может меняться в ходе исполнения. Переменной в JavaScript можно присвоить значение любого типа, и проверка типов происходит непосредственно во время выполнения (а не на этапе компиляции). Также за счёт динамической типизации JavaScript сам неявно приводит типы в некоторых операциях.
Как объявить переменную в JavaScript? Junior

Для объявления переменных используются ключевые слова `var`, `let` или `const`. Например: `var x = 5;`, `let name = "Иван";` или `const PI = 3.14;`. Ключевое слово `var` объявляет переменную в функциональной (или глобальной) области видимости, `let` и `const` – в блочной области видимости. `const` используется для переменных, значение которых не планируется переназначать.
В чём разница между var, let и const? Junior

Ключевые слова `let` и `const` введены в ES6 и решают ряд проблем `var`. Переменные, объявленные через `var`, имеют функциональную или глобальную область видимости и поднимаются (hoisting) в начало функции. `let` и `const` имеют блочную область видимости (доступны только внутри блока `{ ... }`) и не поднимаются – использование до объявления вызывает ошибку. Кроме того, переменную `var` можно повторно объявлять в одной области, а `let`/`const` – нельзя. `const` сходен с `let`, но присваивание значения обязательно сразу при объявлении, и дальнейшее переназначение этому идентификатору запрещено (то есть сама ссылка остаётся константой).
Что такое поднятие (hoisting) переменных и функций? Junior

Hoisting («поднятие») – это поведение JavaScript, при котором объявления переменных и функций как бы перемещаются интерпретатором в начало своей области видимости. Например, функции, объявленные как `function declaration`, полностью поднимаются – ими можно воспользоваться до места объявления в коде. Переменные, объявленные через `var`, тоже поднимаются, но без инициализации – до присваивания их значение будет `undefined`. Объявления `let`/`const` также концептуально поднимаются, но находятся во «временной мёртвой зоне», и доступ к ним до инициализации вызывает ошибку.
Какие значения в JavaScript являются «ложными» (falsy)? Junior

Ложными (falsy) называются значения, которые при приведении к булевому типу дают `false`. К таким значениям относятся: `false`, `0` (и `-0`), `0n` (BigInt ноль), пустая строка `\"\"`, `null`, `undefined` и `NaN`. Все остальные значения считаются «истинными» (truthy) и при приведении к boolean дают `true`.
В чём разница между операторами == и ===? Junior

Оператор нестрогого равенства `==` сравнивает значения с приведением типов – перед сравнением JavaScript при необходимости приводит операнды к общему типу. Например, `"5" == 5` вернёт true, т.к. строка `"5"` неявно приводится к числу 5. Оператор строгого равенства `===` сравнивает без приведения типов – он возвращает true только если операнды равны по значению *и* имеют одинаковый тип. Например, `"5" === 5` вернёт false, поскольку типы отличаются (string vs number).
В чём разница между значениями null и undefined? Junior

`undefined` и `null` оба представляют «отсутствие значения», но различаются по смыслу. `undefined` – значение по умолчанию для необъявленной или неинициализированной переменной, а также возвращается, когда функция ничего не возвращает. `null` же устанавливается явно, когда хотят указать «нет значения». По типам: `undefined` – примитивный тип *undefined*, а `null` имеет свой примитивный тип *null*. При нестрогом сравнении `null == undefined` возвращает true, но при строгом сравнении они различны.
Что такое NaN и какого типа это значение? Junior

NaN расшифровывается как «Not-A-Number» – специальное числовое значение, обозначающее результат некорректной математической операции. Тип NaN – число (Number), то есть `typeof NaN` возвращает `"number"`. NaN является уникальным тем, что не равен ничему, даже самому себе: выражение `NaN === NaN` даст false.
Как проверить, что переменная имеет значение NaN? Junior

Нельзя проверить NaN простым сравнением, поскольку NaN не равен даже самому себе. Для проверки используют встроенные методы: глобальную функцию `isNaN(x)` или лучше метод `Number.isNaN(x)` (он строже и не приводит типы). Например, `Number.isNaN(NaN)` вернёт true. Также можно проверить через сравнение с самим собой: `x !== x` будет true только для NaN.
Как определить тип переменной в JavaScript? Junior

Для определения типа значения используется оператор `typeof`. Он возвращает строку с названием типа: например, `typeof 42` возвращает `"number"`, `typeof "Hello"` – `"string"`. Для null есть особенность: `typeof null` возвращает `"object"` (это историческая ошибка в языке). Также для функций оператор typeof возвращает `"function"` (хотя функции являются объектами).
Как преобразовать строку в число в JavaScript? Junior

Есть несколько способов: можно использовать встроенную функцию `Number(строка)` – она вернёт числовое значение строки (или NaN, если преобразование невозможно). Также можно использовать `parseInt(строка)` для целого числа (анализирует строку до первого нецифрового символа) или `parseFloat(строка)` для числа с плавающей точкой. Ещё один короткий способ – унарный плюс: например, `+\"123\"` приведёт строку `"123"` к числу 123.
Как преобразовать число в строку в JavaScript? Junior

Число можно конвертировать в строку разными способами. Самый простой – метод `.toString()`: например, `(123).toString()` вернёт `"123"`. Также можно конкатенировать число с пустой строкой: `123 + ""` даст строку `"123"`. Есть и функция `String(значение)`, которая возвращает строковое представление любого значения.
Что такое массив в JavaScript? Junior

Массив – это встроенный объект в JavaScript, предназначенный для хранения упорядоченных коллекций значений. Массивы индексируются по целым числам, имеют свойство `.length` (количество элементов) и наследуют различные методы для обработки данных. В JavaScript массивы могут динамически изменять длину и содержать элементы разных типов.
Как добавить элемент в конец массива? Junior

Для добавления элемента в конец массива используется метод `push`. Например: `let arr = [1,2]; arr.push(3);` – теперь массив arr станет `[1,2,3]`. Метод push может добавлять сразу несколько элементов: `arr.push(4,5)` добавит оба элемента в конец.
Как удалить последний элемент из массива? Junior

Чтобы удалить последний элемент массива, применяют метод `pop`. Он удаляет последний элемент и возвращает его значение. Например: `let arr = [1,2,3]; let last = arr.pop();` – массив arr станет `[1,2]`, а переменная last получит удалённое значение `3`.
Как добавить элемент в начало массива? Junior

Для добавления элемента в начало массива используется метод `unshift`. Он сдвигает существующие элементы вправо и вставляет новые в начале. Например: `let arr = [2,3]; arr.unshift(1);` – теперь массив arr станет `[1,2,3]`.
Как удалить первый элемент массива? Junior

Удалить первый элемент можно методом `shift`. Он удаляет элемент с нулевым индексом и возвращает его. Пример: `let arr = [1,2,3]; let first = arr.shift();` – массив arr станет `[2,3]`, а переменная first будет равна `1`.
Как вставить элемент в массив по определённому индексу? Junior

Для вставки (а также удаления) элементов в произвольное место массива используют метод `splice`. Его синтаксис: `arr.splice(начальныйIndex, сколькоУдалить, элемент1, элемент2, ...)`. Чтобы вставить без удаления, указывают второй аргумент 0. Например: `arr.splice(2, 0, "новый")` вставит значение `"новый"` на индекс 2, не удаляя существующие элементы.
Как удалить элемент массива по индексу? Junior

Метод `splice` позволяет удалять элемент по индексу. Достаточно указать индекс и количество удаляемых элементов. Например: `arr.splice(3, 1)` удалит один элемент с индексом 3 из массива. Возвращаемое значение splice – массив удалённых элементов (в данном случае с одним элементом).
Как создать копию массива (клонировать массив)? Junior

Самый простой способ поверхностно скопировать массив – использовать метод `slice` без аргументов: `let newArr = oldArr.slice()`. Также можно использовать оператор распространения: `let newArr = [...oldArr]`. Оба метода создают новый массив с теми же элементами. (Важно понимать, что при этом вложенные объекты не клонируются – будет копироваться только ссылка на них.)
Что такое объект в JavaScript и как его создать? Junior

Объект – это структура данных «ключ-значение». Проще всего создать объект с помощью литерала: например, `let user = { name: "Иван", age: 30 }`. Можно создавать объекты через конструктор: `let obj = new Object();` – а затем добавлять свойства, но литерал используется чаще. Объекты могут хранить свойства (поля) и методы (функции в качестве значений).
Как удалить свойство из объекта? Junior

Для удаления свойства объекта используется оператор `delete`. Синтаксис: `delete объект.имяСвойства`. Например: `delete user.age;` удалит свойство age из объекта user. После этого `user.age` станет undefined. Стоит заметить, что `delete` удаляет свойство именно из объекта, но не затрагивает его прототип (если одноимённое свойство имеется в прототипе).
Что такое JSON и для чего он используется? Junior

JSON (JavaScript Object Notation) – это текстовый формат для представления структурированных данных, основанный на синтаксисе объектов JavaScript. Он используется для хранения и обмена данными между системами (например, между клиентом и сервером). Формат JSON – человеческо-читаемый: данные записываются в виде пар ключ-значение в фигурных скобках (объекты) и списков в квадратных (массивы). Несмотря на происхождение из JavaScript, JSON – независимый формат, поддерживается многими языками.
Как конвертировать объект JavaScript в JSON-строку? Junior

В JavaScript есть встроенный метод для этого: `JSON.stringify`. Он принимает значение (обычно объект) и возвращает строку в формате JSON. Например: `let json = JSON.stringify(userObj)`. Полученная строка может быть передана или сохранена (например, отправлена на сервер).
Как из JSON-строки получить объект JavaScript? Junior

Для обратного преобразования служит метод `JSON.parse`. Он принимает строку JSON и возвращает соответствующее значение (объект, массив или другой тип). Пример: `let obj = JSON.parse(jsonStr)`. Если строка содержит корректный JSON, в переменной obj получится объект с данными из этой строки.
Что такое DOM? Junior

DOM (Document Object Model) – объектная модель документа. Проще говоря, браузер представляет загруженную HTML-страницу в виде иерархического дерева объектов, где каждый узел соответствует элементу, тексту, атрибуту и т.д. JavaScript может взаимодействовать с DOM: менять структуру страницы, стили, содержимое, реагировать на события. DOM – это интерфейс между языком и структурой HTML-документа.
Как получить элемент на странице по его id? Junior

Самый простой способ – использовать метод `document.getElementById("идентификатор")`. Он вернёт элемент с заданным атрибутом id или `null`, если такого нет. Например: `let header = document.getElementById("header");`. Кроме того, можно использовать универсальный метод `document.querySelector("#идентификатор")` – он делает то же самое при передаче селектора с #.
Чем отличается document.querySelector от document.getElementById? Junior

Метод `document.getElementById` ищет элемент по exact-id и возвращает первый найденный. `querySelector` более универсальный: он принимает любой CSS-селектор (класс, тег, комбинации селекторов) и возвращает первый подходящий элемент. Например, `document.querySelector(".item")` найдёт первый элемент с классом item. Однако `querySelector("#id")` и `getElementById("id")` при одинаковом id в целом вернут тот же элемент. Разница ещё и в том, что querySelector может возвращать `null` для несуществующего селектора, тогда как getElementById вернёт `null` для отсутствующего id (в современных браузерах поведение схоже). По производительности прямой поиск по id может быть немного быстрее.
В чём разница между свойствами innerHTML и textContent? Junior

`elem.innerHTML` возвращает HTML-содержимое элемента в виде строки, включая теги, и позволяет задавать HTML-разметку внутри элемента. `elem.textContent` же возвращает только текст внутри элемента (без разметки) и, при присваивании, устанавливает текст, трактуя переданные символы как обычный текст. То есть `innerHTML = "<b>Hi</b>"` вставит тег `<b>`, а `textContent = "<b>Hi</b>"` выведет буквально `<b>Hi</b>` как текст. Также `textContent` безопасен с точки зрения HTML – он не интерпретирует строки как HTML, поэтому используется для вставки пользовательского текста во избежание XSS.
Как добавить CSS-класс элементу? Junior

В JavaScript доступно свойство `element.classList` – это специальный объект для управления классами элемента. Чтобы добавить класс, используют метод `element.classList.add("className")`. Например: `elem.classList.add("active")` добавит элементу класс active (не затрагивая другие классы). Альтернативно, можно через свойство className, но тогда придётся присваивать всю строку классов целиком.
Как удалить CSS-класс у элемента? Junior

Для удаления класса из элемента также используется его свойство `classList`. Метод `element.classList.remove("className")` убирает указанный класс. Например: `button.classList.remove("disabled")` – удалит у элемента button класс disabled. Также есть метод `toggle`, который переключает наличие класса (добавляет если не было, удаляет если был).
Как назначить обработчик события на элемент? Junior

Самый распространённый способ – метод `element.addEventListener("event", handler)`. Например: `button.addEventListener("click", function() { ... });` – назначит элементу button обработчик клика. Событие передаётся в виде строки (\"click\"), а обработчик – функция. Можно добавить несколько обработчиков на одно событие этим методом. Альтернативно, у элемента есть свойства-обработчики (типа `elem.onclick = ...`), но при их использовании хранится только один обработчик за раз.
Что такое всплытие событий? Junior

Всплытие событий – механизм, при котором событие, произошедшее на вложенном элементе, автоматически поднимается вверх по дереву DOM к родительским элементам. Например, если кликнуть на кнопке внутри формы, сначала срабатывает обработчик клика на самой кнопке (если есть), затем событие \"всплывает\" к родителю (форме) и вызывает её обработчик клика, затем – к более внешнему элементу и так далее, вплоть до объекта `document`. Всплытие позволяет обрабатывать событие на более высоком уровне, не назначая обработчик на каждый вложенный элемент.
Что такое погружение (capture) событий? Junior

Погружение (или захват событий) – это фаза, противоположная всплытию. Сначала событие \"спускается\" от корневого элемента документа к конкретному целевому элементу, проходя через предков. Обычно по умолчанию обработчики срабатывают на фазе всплытия, но можно обрабатывать событие на этапе погружения, передав третий аргумент `true` в addEventListener. Тогда обработчик будет вызван во время этапа захвата, то есть от родителя к потомку, прежде чем событие достигнет целевого элемента.
Для чего используется метод event.preventDefault()? Junior

Метод `event.preventDefault()` отменяет действие по умолчанию для события, если оно предусмотрено. Например, если вызвать preventDefault() в обработчике отправки формы (submit), форма не будет отправлена, или если применить в обработчике клика по ссылке – переход по ссылке отменится. Этот метод полезен, когда нужно переопределить стандартное поведение элемента (например, реализовать свою логику обработки вместо перехода).
Как обработать исключения (ошибки) в JavaScript? Junior

Для перехвата и обработки ошибок используется конструкция `try...catch`. Код, который может вызвать ошибку, размещается внутри блока `try`, а блок `catch` выполняется, если в try произошла ошибка – в него передаётся объект ошибки, и там можно обработать ситуацию (например, вывести сообщение). Также есть блок `finally`, который выполняется после try/catch в любом случае (ошибка произошла или нет). Кроме того, в промисах и async/await ошибки обрабатываются соответственно через `.catch()` и через try/catch внутри async-функции.
Что такое строгий режим ("use strict") и как его включить? Junior

Строгий режим – это режим выполнения JavaScript, вводящий более строгие правила и проверки. Он устраняет некоторые неочевидные моменты языка. В строгом режиме, например, запрещено использование необъявленных переменных, значение `this` в функции, вызванной без контекста, будет undefined (вместо глобального объекта), и ряд «молчащих» ошибок превращаются в явные. Включается строгий режим добавлением строки `"use strict";` в начале скрипта или отдельной функции.
Что такое функция обратного вызова (callback)? Junior

Callback-функция – это функция, переданная как аргумент другой функции для последующего вызова. Как правило, «функция обратного вызова» вызывается после наступления какого-то события или по завершении операции. Например, можно передать функцию в `setTimeout`, и эта функция выполнится через заданное время. Таким образом, callback позволяет одним функциям вызывать другие, обеспечивая гибкость и асинхронность в коде.
Что такое Promise? Junior

Promise (промис) – это объект, представляющий результат асинхронной операции. Промис может находиться в одном из трёх состояний: *ожидание* (pending) – операция ещё не завершилась, *исполнено* (fulfilled) – операция завершилась успешно, и *отклонено* (rejected) – произошла ошибка. Используя промисы, можно удобно обрабатывать асинхронные результаты: метод `.then` – для успешного результата, `.catch` – для ошибок, и `.finally` – для действия после завершения (в любом случае).
Что такое async/await? Junior

`async/await` – это синтаксический сахар над промисами, упрощающий написание асинхронного кода. Ключевое слово `async` перед определением функции помечает её как асинхронную – такая функция всегда возвращает промис. Внутри async-функции можно использовать оператор `await` перед вызовом промиса – выполнение при этом приостанавливается, ожидая разрешения промиса. Код с `await` выглядит как последовательный (\"синхронный\"), хотя под капотом продолжает использовать промисы. Это улучшает читаемость и упрощает обработку ошибок (можно применять обычный try/catch внутри async-функции).
В чём разница между синхронным и асинхронным кодом? Junior

Синхронный код выполняется последовательно – каждая операция должна завершиться, прежде чем начнётся следующая. Асинхронный код позволяет запускать операции (например, сетевые запросы) параллельно или откладывать их завершение, не блокируя основной поток. При асинхронном подходе длительные операции могут выполняться \"в фоне\", а основной скрипт продолжит работу. JavaScript однопоточный, но асинхронность достигается через механизм событий и колбеков/промисов: например, запрос отправляется, а результат обрабатывается колбеком позже, не останавливая всю программу в ожидании ответа.
Для чего нужны функции setTimeout и setInterval? Junior

Эти функции позволяют выполнять код с задержкой или через определённые интервалы времени. `setTimeout(func, delay)` вызывает функцию `func` один раз через указанное количество миллисекунд (`delay`). `setInterval(func, delay)` – вызывает `func` регулярно, каждые `delay` миллисекунд, пока не будет остановлен (с помощью `clearInterval`). Они полезны для отложенного выполнения или периодических операций (например, обновление данных каждую секунду).
Что такое ECMAScript? Junior

ECMAScript – это стандарт, описывающий язык JavaScript. Проще говоря, ECMAScript – официальное название спецификации языка, а \"JavaScript\" – реализация этой спецификации в браузерах. Новые версии стандарта ECMAScript (ES5, ES6/ES2015, ES2020 и т.д.) определяют новые возможности языка, которые затем реализуются в JavaScript-движках браузеров и других сред.
Какие новые возможности появились в ES6? Junior

ES6 (также известный как ES2015) привнёс значительное обновление языка. К ключевым новшествам относятся: стрелочные функции (`=>`), блоковая область видимости (`let` и `const` вместо var), параметры по умолчанию и rest/spread операторы (`...`), деструктуризация объектов и массивов, шаблонные строки (интерполяция через ``), классы (синтаксический сахар над прототипами), Promises для работы с асинхронностью, а также новые типы (Symbol) и структуры данных (Map, Set).
Что такое шаблонные строки (template literals) в JavaScript? Junior

Шаблонные строки – это способ создания строк, появившийся в ES6, который позволяет вставлять переменные и выражения внутрь строки. Они заключаются в обратные кавычки `` вместо обычных кавычек. Внутри шаблонной строки можно использовать синтаксис `${...}` для интерполяции значений. Также шаблонные строки поддерживают многострочность без специальных символов. Например: ``Hello, ${name}!`` вставит значение переменной name.
В чём разница между Function Declaration и Function Expression? Junior

Function Declaration – это объявление функции в общем потоке кода с синтаксисом `function имя(...) { ... }`. Такая функция поднимается (hoisting) – её можно вызвать до места объявления. Function Expression – это функциональное выражение, когда функция создаётся в контексте какого-либо выражения (например, присваивания: `let fn = function(...) { ... };`). У Function Expression может не быть имени (анонимная функция) или быть имя для рекурсии. В отличие от деклараций, function expression не поднимаются – вызвать их до присвоения нельзя.
Что такое стрелочная функция (arrow function) в JavaScript? Junior

Стрелочная функция – это сокращённый синтаксис для объявления анонимной функции, введённый в ES6. Она записывается с помощью символа `=>`. Например: `const sum = (a, b) => a + b;` создаёт функцию суммы. Стрелочные функции не имеют собственного `this` и `arguments` – они используют значение `this` из окружающего контекста (лексически). Также у стрелочных функций более краткий синтаксис и не создаётся свой объект `prototype`. Их удобно использовать для коротких колбеков или лямбда-выражений.
Что такое объект arguments? Junior

`arguments` – это псевдомассив (объект, похожий на массив), доступный внутри обычной функции (не стрелочной). Он содержит все аргументы, переданные в функцию, и позволяет к ним обращаться по индексу (arguments[0], arguments[1], ...). У него также есть свойство `length`. В современных реализациях вместо arguments часто используют оператор rest (`...`), который собирает аргументы в настоящий массив. Стрелочные функции не имеют `arguments`, но они могут воспользоваться `arguments` внешней функции (за счёт лексического окружения).
Как передаются аргументы функций: по значению или по ссылке? Junior

В JavaScript все аргументы передаются по значению. Однако надо учитывать, что в случае примитивов передаётся само значение, а в случае объектов – передаётся значение, являющееся ссылкой на объект. То есть, если функция получает объект в качестве аргумента, внутри функции эта переменная ссылается на тот же объект. Изменяя свойства объекта внутри функции, мы изменяем исходный объект (так как передана копия ссылки). Но переназначение самого аргумента-объекта внутри функции не повлияет на оригинал.
Что произойдёт, если обратиться к переменной без объявления? Junior

Если попытаться использовать переменную, которая нигде не была объявлена (ни через var/let/const, ни как параметр функции), то в нестрогом режиме JavaScript неявно обращается к свойству глобального объекта. Однако, начиная с ES5 strict mode, это приведёт к ошибке `ReferenceError: переменная не определена`. В строгом режиме доступ к необъявленной переменной запрещён. Таким образом, всегда следует объявлять переменные перед использованием.
Что вернёт оператор typeof для массива? Junior

Массив в JavaScript – это объект особого вида. Оператор `typeof` для массива возвращает `"object"`, поскольку массив не является отдельным типом, а относится к объектам. Для проверки именно массива можно использовать метод `Array.isArray(arr)`, который вернёт true, если переменная arr – массив.
Для чего используется метод Array.map()? Junior

Метод `map` применяется к массиву для преобразования всех его элементов по заданной функции. Он возвращает новый массив такой же длины, в котором каждый элемент – это результат вызова функции-колбека на соответствующем элементе исходного массива. Исходный массив при этом не изменяется.
Для чего используется метод Array.filter()? Junior

Метод `filter` используется для фильтрации массива. Он вызывает переданную функцию-предикат на каждом элементе и формирует новый массив из тех элементов, для которых функция вернула true (или значение, приводимое к true). Проще говоря, filter возвращает только те элементы, которые удовлетворяют условию. Исходный массив не изменяется.
Для чего используется метод Array.reduce()? Junior

Метод `reduce` производит свёртку массива – то есть последовательно применяет функцию-аккумулятор к элементам, сводя массив к единому значению. `reduce(callback, initialValue)` перебирает каждый элемент, передавая callback предыдущий накопленный результат и текущий элемент. В итоге возвращается одно итоговое значение (например, сумма элементов, если свёртка – суммирование).
Как работает метод Array.forEach()? Junior

Метод `forEach` перебирает элементы массива, вызывая заданную функцию-колбэк для каждого элемента. В отличие от `map`, метод forEach ничего не возвращает (он всегда возвращает undefined) – его используют для выполнения побочных эффектов над каждым элементом (например, вывод в консоль). Он не прерывает выполнение сам – прервать цикл forEach досрочно нельзя (разве что бросив исключение).
Чем отличается Array.forEach() от Array.map()? Junior

Оба метода перебирают массив, но `map` формирует новый массив с изменёнными элементами, а `forEach` ничего не возвращает. То есть map используется, когда нужно получить преобразованный массив, а forEach – когда нужно просто выполнить операцию для каждого элемента (например, вызвать функцию). Также forEach не поддерживает цепочку вызовов (т.к. возвращает undefined), в отличие от map, который возвращает новый массив и может быть продолжен другими методами массива.
Как удалить пробелы в начале и конце строки? Junior

Для удаления лишних пробелов по краям строки у всех современных браузеров есть метод `String.trim()`. Пример: `" привет ".trim()` вернёт `"привет"`, убрав пробелы с обоих концов строки. Альтернативно можно использовать регулярное выражение, но trim удобнее.
Как проверить, содержит ли строка определённую подстроку? Junior

В современных реализациях можно использовать метод `includes`: например, `"hello world".includes("world")` вернёт true. Ранее часто применяли метод `indexOf`: если вызов `"hello world".indexOf("world")` возвращает ненулевой индекс (не -1), значит подстрока найдена. Для проверки вхождения с определённой позиции также подходит includes с вторым аргументом (позиция начала поиска).
Как разделить строку по разделителю на части? Junior

Для этого служит метод `split(delimiter)`. Он разобьёт исходную строку на массив подстрок, используя указанный разделитель. Например: `"a,b,c".split(",")` вернёт массив `["a","b","c"]`. Разделителем может быть строка или регулярное выражение. Если вызвать split("") с пустой строкой, получим массив отдельных символов.
Как соединить элементы массива в строку? Junior

У массивов есть метод `join(separator)`, который возвращает строку из всех элементов, объединённых указанным разделителем. Например: `["red", "green", "blue"].join(", ")` вернёт строку `"red, green, blue"`. Если разделитель не указать, по умолчанию используется запятая. Метод join работает, даже если в массиве нестроковые значения – он приведёт их к строке.
Как округлить число до ближайшего целого? Junior

Для округления числа до ближайшего целого используется функция `Math.round(x)`. Она возвращает целое: дробные .5 и выше округляются вверх. Например, `Math.round(3.2)` даст 3, `Math.round(3.5)` даст 4. Для разных способов округления есть также Math.floor (вниз) и Math.ceil (вверх).
В чём разница между Math.floor() и Math.ceil()? Junior

`Math.floor(x)` всегда округляет число x вниз (к меньшему целому), а `Math.ceil(x)` – вверх (к большему целому). Например, для x = 3.7 floor даст 3, а ceil – 4. Оба метода игнорируют дробную часть: floor отбрасывает её, ceil увеличивает число до следующего целого при наличии любой дробной части.
Как получить случайное число в JavaScript? Junior

Генерацию случайных чисел обеспечивает функция `Math.random()`. Она возвращает псевдослучайное число с плавающей точкой в диапазоне [0, 1) (не включая 1). Чтобы получить число в нужном диапазоне, результат Math.random обычно масштабируют и сдвигают. Например, случайное число от 0 до 10: `Math.random() * 10`. А чтобы получить целое, можно использовать Math.floor: например, `let randInt = Math.floor(Math.random() * 10)` – случайное целое от 0 до 9.
Как проверить, является ли значение числом (конечным)? Junior

В JavaScript есть глобальная функция `isFinite(value)`, которая сначала приводит аргумент к числу, а затем возвращает true, если полученное число не NaN и не Infinity. Также есть более строгий метод `Number.isFinite(value)` – он не выполняет приведение типа, и возвращает true только если value уже является числом (типа number) и оно не бесконечное. Эти функции помогают проверить, что значение – нормальное конечное число.
Что такое cookie и для чего оно используется? Junior

Cookie – это небольшой фрагмент данных, который веб-сайт может сохранить в браузере пользователя. Куки привязаны к домену и отправляются серверу вместе с HTTP-запросами. Они часто используются для хранения сессионных идентификаторов, настроек пользователя или другой информации между запросами. В JavaScript к cookie можно обращаться через `document.cookie` – устанавливать новые или читать существующие (с определёнными ограничениями безопасности).
Как работает метод fetch и для чего он используется? Junior

Метод `fetch()` предоставляет современный способ выполнить HTTP-запрос из JavaScript. Он возвращает промис, который завершается, когда получен ответ. Вызов `fetch(url)` начинает асинхронный запрос по указанному URL. Затем можно навесить `.then` для обработки ответа (например, преобразовать ответ через response.json()). В отличие от старого XMLHttpRequest, fetch проще и основан на промисах, что облегчает написание асинхронного кода при обмене данными с сервером.
Что такое AJAX и зачем он нужен? Junior

AJAX (Asynchronous JavaScript and XML) – технология, позволяющая выполнять HTTP-запросы к серверу в фоновом режиме, без перезагрузки страницы. Несмотря на название, не обязательно использовать XML – сейчас чаще применяют JSON. С помощью AJAX веб-страница может динамически отправлять или получать данные (например, подгружать содержимое) после загрузки, улучшая интерактивность. Реализуется AJAX с помощью XMLHttpRequest или fetch в JavaScript, совместно с серверной стороной, обрабатывающей запросы.

Middle

Что такое замыкание и как оно работает? Middle

Замыкание – это функция вместе с лексическим окружением, в котором она была создана. Благодаря замыканиям внутренняя функция «помнит» переменные из внешней функции даже после завершения выполнения внешней. Проще говоря, замыкание позволяет функции доступа к локальным переменным окружающей её функции спустя время. Например, если функция возвращает внутреннюю функцию, та будет замыканием и сохранит доступ к переменным своего внешнего контекста.
Как работает прототипное наследование в JavaScript? Middle

В JavaScript реализация наследования основана на прототипах. Каждый объект имеет скрытое свойство `__proto__` (или [[Prototype]]), ссылающееся на прототип – другой объект. При обращении к свойству, которого нет в самом объекте, интерпретатор ищет его в объекте-прототипе. Цепочка прототипов может продолжаться (прототип может иметь свой прототип и т.д.) вплоть до Object.prototype. Таким образом, объекты наследуют свойства и методы через прототипную цепочку.
Что такое ключевое слово `this` и как определяется его значение? Middle

`this` – специальное ключевое слово, которое указывает на контекст выполнения функции. Значение `this` определяется тем, как вызвана функция: если функция вызвана как метод объекта (obj.method()), `this` внутри будет ссылаться на этот объект `obj`. Если функция вызвана просто как f(), без контекста, то в нестрогом режиме `this` будет глобальным объектом (window), а в строгом – undefined. Также у стрелочных функций `this` особый – они не привязывают `this` сами, а берут его из внешней области.
Чем отличается `this` в стрелочной функции? Middle

У стрелочной функции нет собственного `this`. Вместо этого стрелка лексически наследует значение `this` из окружающего контекста, в котором она определена. Это значит, что внутри стрелочной функции `this` такой же, как снаружи неё. В обычной же функции значение `this` определяется в момент вызова (каким объектом вызвана). Из-за этого стрелочные функции удобны в случаях, когда нужно сохранить контекст внешнего this (например, внутри обработчиков, колбеков), чтобы не использовать `.bind`.
Что такое цикл событий (Event Loop) в JavaScript? Middle

Цикл событий – это механизм, благодаря которому JavaScript (в браузере или Node.js) обрабатывает асинхронные операции. JS выполняется в одном потоке, и Event Loop позволяет не блокировать этот поток. Механизм работает так: пока есть задачи в очереди, он берёт первую и выполняет её (это может быть функция-колбек по завершении таймера, ответа сервера и т.д.). Асинхронные операции (таймеры, запросы) при инициации отправляют колбек в очередь задач, не останавливая основной код. Когда основной код (стек вызовов) пуст, Event Loop берёт из очереди колбек и вызывает его. Так обеспечивается обработка событий и асинхронность – JavaScript может реагировать на события по мере их поступления, не дожидаясь друг друга.
Какие состояния может принимать Promise? Middle

Promise имеет три возможных состояния: *pending* (в ожидании) – изначальное состояние, ещё не завершено; *fulfilled* (исполнен) – операция завершилась успешно, промис «разрешён» и содержит полученное значение; *rejected* (отклонён) – операция завершилась с ошибкой, промис «отклонён» и хранит причину (обычно объект ошибки). Промис начинает в состоянии pending и потом неизменно переходит либо в fulfilled, либо в rejected.
Что такое цепочка промисов (promise chaining)? Middle

Цепочка промисов – это последовательное выполнение нескольких асинхронных операций, где каждый следующий промис запускается в `.then` предыдущего. Когда первый промис выполняется и вызывает `.then`, возвращённое этим `.then` значение (или промис) передаётся следующему `.then` и так далее. Таким образом, можно задавать последовательность действий: например, сделать запрос, затем обработать результат, затем результат передать в следующий запрос. Если в цепочке где-то вернуть промис, последующие `.then` будут ждать его выполнения. Promise chaining делает код последовательных асинхронных шагов более читаемым.
Что такое "ад колбеков" (callback hell) и как его избежать? Middle

«Ад колбеков» – образное название ситуации, когда код использует много вложенных колбек-функций, зачастую для последовательных асинхронных операций. Код при этом получается глубоко вложенным, трудно читаемым и сопровождаемым. Выглядит как пирамида из функций, где каждая следующая вызывается внутри предыдущей. Избежать этого помогают промисы и async/await. Переписав колбеки на цепочки промисов или на синтаксис async/await, можно сделать асинхронный код линейным и более понятным, убрав чрезмерную вложенность.
Что такое делегирование событий? Middle

Делегирование событий – приём, при котором вместо назначения обработчиков на множество дочерних элементов, обработчик вешается на их общего предка и использует всплытие событий. Когда событие всплывает до родителя, в обработчике можно по свойству event.target определить, на каком именно дочернем элементе оно произошло, и выполнить нужные действия. Таким образом, можно одним обработчиком управлять событиями на много элементов. Это улучшает производительность (меньше обработчиков) и упрощает динамически добавляемые элементы – не нужно вешать на них новые обработчики, родительский уже «поймает» событие.
В чём разница между методами call, apply и bind? Middle

Все три метода позволяют вручную задать значение `this` при вызове функции. `func.call(thisArg, arg1, arg2, ...)` вызывает функцию `func` с указанным `thisArg` и переданными аргументами. `func.apply(thisArg, argsArray)` делает то же, но аргументы передаются в виде массива (или подобного ему объекта). Метод `bind` работает иначе: `func.bind(thisArg, arg1, arg2, ...)` возвращает новую функцию, у которой `this` навсегда привязан к `thisArg` (и, опционально, частично переданы аргументы по умолчанию). Эта привязанная функция может вызываться позже сколько угодно раз. В сумме: call и apply вызывают функцию сразу, а bind – привязывает контекст для последующих вызовов функции.
Что такое функция высшего порядка? Middle

Функция высшего порядка – это функция, которая принимает другую функцию в качестве аргумента или возвращает функцию в качестве результата (или делает и то, и другое). В JavaScript функции являются «объектами первого класса», их можно передавать и возвращать, поэтому функции высшего порядка распространены. Примеры: метод массива `.filter(callback)` – функция высшего порядка, так как принимает колбек; или функция, которая возвращает новую функцию (например, фабрика функций).
Как создать объект без прототипа? Middle

Обычно созданный объект наследует от Object.prototype. Чтобы создать объект без прототипа (чистый объект), можно использовать `Object.create(null)`. Этот метод создаст новый объект, у которого `__proto__` не задан (равен null). Такой объект не имеет никаких унаследованных свойств (например, toString). Это полезно, например, для создания чистого словаря/хэша без влияния прототипа. Другой вариант – использовать `const obj = { __proto__: null }` в средах, где поддерживается установка прототипа через литерал (но Object.create(null) более явно и надёжно).
Как проверить наличие свойства в объекте? Middle

Есть несколько способов проверить, есть ли определённое свойство в объекте. Во-первых, оператор `"key" in obj` возвращает true, если свойство с именем "key" содержится в объекте (включая унаследованные свойства). Во-вторых, метод `obj.hasOwnProperty("key")` вернёт true только если свойство является собственным (не из прототипа). Также можно проверить на undefined: `obj.key !== undefined`, но это не отличит отсутствие свойства от свойства, установленного в undefined. Обычно для проверки используют in или hasOwnProperty.
Почему сравнение двух объектов {} возвращает false? Middle

В JavaScript при сравнении объектов сравниваются не их содержимое, а ссылки (адреса в памяти). Два литерала `{}` создают два разных объекта в памяти. У них разные ссылки, поэтому сравнение `{} === {}` (или ==) вернёт false, даже если они пустые и \"выглядят\" одинаково. Чтобы считать объекты равными, это должен быть фактически один и тот же объект (та же ссылка).
Что такое модуль в JavaScript? Middle

Под модулем понимается отдельный фрагмент кода (файл или сразу функция/IIFE), который имеет свою область видимости и предоставляет некий интерфейс наружу (например, через `export` или присвоение в глобальную переменную). Модули помогают организовать код, изолировать реализацию и экспортировать только необходимые части. В современных JavaScript есть нативные ES6-модули: каждый файл может быть модулем, импортируя и экспортируя значения.
В чём разница между модулями CommonJS и ES6? Middle

CommonJS – система модулей, используемая, например, в Node.js. В ней модули загружаются синхронно и экспорты доступны через объект `module.exports`, а импорт через функцию `require("module")`. ES6-модули – стандарт в браузерах и Node (в современном варианте), поддерживают ключевые слова `export` и `import`. Импорты ES6-модулей работают асинхронно (в браузере можно загружать скрипты с type="module"), их синтаксис статический (что позволяет оптимизации, например, tree shaking). Кроме того, ES6-модули всегда выполняются в строгом режиме и имеют отдельную область видимости (переменные модуля не попадают в глобальную).
Как клонировать объект в JavaScript? Middle

Поверхностное копирование объекта можно сделать с помощью `Object.assign({}, original)` – это скопирует все собственные перечислимые свойства в новый пустой объект. Либо воспользоваться оператором расширения: `let clone = { ...original }` – он создаст новый объект и скопирует свойства original. Для глубокого копирования (вложенных объектов) можно использовать рекурсивный обход или методы вроде `structuredClone(obj)` (если поддерживается) или через сериализацию: `JSON.parse(JSON.stringify(obj))` – однако последний способ не копирует функции и специальные свойства и может потерять часть данных (например, undefined, Symbol). Поэтому для глубокого клонирования сложных объектов лучше использовать специализированные библиотеки или написать свою функцию.
Что такое деструктуризация в JavaScript? Middle

Деструктуризация – это синтаксис, позволяющий распаковать значения из массива или свойства из объекта в отдельные переменные. Например: `const [a,b] = [1,2]` присвоит a=1, b=2; или `const {name, age} = user` извлечёт из объекта user свойства name и age в одноимённые переменные. Деструктуризация упрощает извлечение нескольких значений сразу и позволяет задавать значения по умолчанию, переименовывать переменные и т.д.
Что такое rest-параметр и для чего он используется? Middle

Rest-параметр (оператор ... в объявлении функции) позволяет собрать произвольное количество аргументов в массив. При объявлении функции, последний параметр можно написать как `...args` – тогда все переданные дополнительные аргументы окажутся в массиве `args`. Например: `function f(a, ...rest) {}` – переменная rest внутри будет массивом из аргументов, начиная со второго. Rest-оператор удобен, когда функция может принимать переменное число аргументов. Кроме того, rest-оператор используется в деструктуризации для сбора \"оставшихся\" элементов/свойств.
Что такое spread-оператор и для чего он используется? Middle

Spread-оператор (оператор троеточия ...) – это синтаксис, который \"раскрывает\" итерируемый объект (например, массив) или объект в места, где ожидается список значений. Например, в вызове функции `f(...array)` spread передаст элементы массива как отдельные аргументы. Или при создании массива: `[...arr1, ...arr2]` объединит два массива. Для объектов: `let clone = { ...obj }` – скопирует свойства объекта. Spread-оператор упрощает комбинирование массивов/объектов и передачу множества аргументов.
Что такое WeakMap и как он отличается от Map? Middle

WeakMap – это коллекция, аналогичная Map, но ключами в WeakMap могут быть только объекты, и такие связи \"слабые\" – если объект-ключ более не доступен нигде кроме как в WeakMap, он может быть удалён сборщиком мусора. В WeakMap нет свойства size и методов перебора, т.к. содержимое неполноценное (сборщик мусора может удалить элемент в любой момент). В отличие от обычного Map, WeakMap не препятствует сборке мусора для своих ключей. Итого: WeakMap полезен для хранения дополнительной информации об объектах без предотвращения их удаления.
Чем отличается WeakSet от Set? Middle

WeakSet похож на Set тем, что хранит множество объектов, но у WeakSet элементы тоже являются \"слабыми\" ссылками. Ключевые отличия: WeakSet может содержать только объекты (не примитивы), и если объект больше нигде не используется, кроме как в WeakSet, он может быть удалён сборщиком мусора. Также WeakSet нельзя перебрать (нет метода forEach и свойства size), т.к. содержимое потенциально изменяется сборщиком. В обычном Set хранятся сильные ссылки, и Set позволяет хранить любые значения и предоставляет методы итерации.
Как работает сборщик мусора в JavaScript? Middle

Сборщик мусора (garbage collector) автоматически освобождает память, занятую объектами, которые больше недоступны в программе. Основной алгоритм – \"mark-and-sweep\": периодически движок помечает все объекты, до которых можно добраться из корневых (глобальный объект, стек вызовов и т.д.), как используемые. Всё остальное считается неиспользуемым и очищается из памяти. Благодаря сборке мусора JavaScript-разработчикам не нужно вручную управлять памятью – достаточно не создавать неубираемых ссылочных циклов (но движки умеют и их обнаруживать) и обнулять ссылки, если объект точно больше не нужен (в сложных случаях).
Что такое IIFE и зачем она используется? Middle

IIFE (Immediately Invoked Function Expression) – немедленно вызываемое функциональное выражение. Это функция, которая объявляется и тут же вызывается. Записывается обычно как `(function(){ ... })();`. IIFE создаёт новый локальный scope (область видимости), изолируя переменные внутри себя от внешнего кода. Раньше её часто использовали для организации модулей: помещали код в IIFE, чтобы не засорять глобальную область видимости, а наружу возвращали только нужные значения. Сейчас, с появлением блочной области видимости (let/const) и модулей, IIFE используется реже, но все ещё применима для изоляции кода.
В чём разница между event.preventDefault() и event.stopPropagation()? Middle

Эти два метода относятся к обработке событий. `event.preventDefault()` предотвращает действие по умолчанию для данного события (например, переход по ссылке или отправку формы). `event.stopPropagation()` прекращает дальнейшее всплытие события: после вызова stopPropagation событие не будет передано родительским элементам. Таким образом, preventDefault влияет на поведение элемента, вызвавшего событие, а stopPropagation – на распространение события вверх по DOM.
Что такое "debounce" и "throttle" и зачем они нужны? Middle

Это техники оптимизации частоты вызова функций. **Debounce** (устранение дребезга) задерживает вызов функции до тех пор, пока события не перестанут происходить. Например, обработчик resize окна можно "дебаунсить", чтобы он запускался только после того, как пользователь закончит менять размер (например, спустя 300мс без новых событий). **Throttle** (дросселирование) ограничивает функцию: она будет вызываться не чаще, чем указанное время. Например, при событии scroll можно разрешить обработчику выполняться не чаще чем раз в 100мс. Оба приёма помогают снизить нагрузку, предотвращая слишком частый вызов дорогостоящих операций при «шумных» событиях.
Как можно повысить производительность JavaScript-кода? Middle

Несколько общих приёмов оптимизации: 1) Минимизировать лишние обращения к DOM – манипуляции с DOM дорогие, лучше по возможности совмещать изменения (например, использовать фрагменты или batch-обновления). 2) Использовать throttle/debounce для событий, которые генерируются очень часто (scroll, resize, mousemove), чтобы не перегружать обработчиками. 3) Кешировать результаты дорогостоящих вычислений (мемоизация), если функция вызывается часто с одними и теми же данными. 4) Разделять тяжёлые расчёты на более мелкие с помощью `setTimeout`/`requestAnimationFrame`, чтобы избежать долгой блокировки основного потока. 5) По возможности использовать Web Workers для действительно тяжёлых вычислений, чтобы вынести их в отдельный поток (требует отсутствия взаимодействия с DOM внутри воркера).
Что такое мемоизация и когда она применяется? Middle

Мемоизация – это техника оптимизации, при которой результаты вызовов функции с определёнными аргументами кэшируются, и повторный вызов с теми же аргументами возвращает результат из кеша, не выполняя вычислений заново. Применяется для тяжёлых или часто вызываемых функций, результаты которых зависят только от входных данных. Благодаря мемоизации можно существенно ускорить повторные вычисления ценой дополнительной памяти под хранение результатов.
Что такое полифил и зачем он нужен? Middle

Полифил – это код (как правило, библиотека или скрипт), который реализует функциональность, отсутствующую в окружении. Обычно полифилы используются для обеспечения поддержки новых возможностей языка или браузерных API в старых средах. Например, полифил Promise добавляет поддержку промисов в браузерах, где они не реализованы. Таким образом, полифилы позволяют использовать современные возможности, даже если среда их ещё не поддерживает, за счёт «залатки» – добавления альтернативной реализации.
В чём разница между циклами for...in и for...of? Middle

`for...in` перебирает перечисляемые свойства объекта (включая его прототипные, если не сделать проверку `hasOwnProperty`). В контексте массива `for...in` пробежит по индексам массива (но не гарантирует порядок для нечисловых ключей и может захватить добавленные в прототип методы). `for...of` же работает с так называемыми итерируемыми объектами – при каждой итерации он получает очередное значение. Для массива `for...of` переберёт значения элементов (в порядке их индексов). `for...of` нельзя применять к обычному объекту (неитерируемому) без специальной реализации итератора. В целом: for-in – для ключей/свойств объекта, for-of – для значений итерируемой коллекции (массива, строки, Map, Set и т.д.).
Можно ли использовать стрелочную функцию как конструктор? Middle

Нет, стрелочные функции не могут быть конструкторами. Если попытаться вызвать стрелочную функцию с `new`, произойдёт ошибка. Это ограничение связано с тем, что у стрелочных функций нет собственного прототипа (у них отсутствует свойство prototype), и они не имеют внутреннего механизма [[Construct]]. Стрелочные функции предназначены только для создания функций-замыканий, лямбд, но не для конструирования объектов через new.
Что такое поверхностное и глубокое копирование объектов? Middle

При поверхностном копировании (shallow copy) объекта копируются только сами свойства верхнего уровня. Если среди свойств есть объекты или массивы, копируется лишь ссылка на них, а не их содержимое. Глубокое копирование (deep copy) подразумевает рекурсивное клонирование – включая вложенные объекты целиком, так что в новом объекте нет ссылок на части старого. Глубокая копия обеспечивает полную независимость копии от оригинала, но выполнять её сложнее и дороже. Встроенных средств для глубокого копирования сложных объектов нет (кроме `structuredClone` в современных средах), обычно его делают вручную или с помощью библиотек.
Как обработать ошибки в асинхронном коде (в Promise или async/await)? Middle

В случае промисов ошибки обрабатываются с помощью метода `.catch`. Если промис переходит в состояние rejected, вызовется колбек из `.catch`, куда попадёт объект ошибки. В цепочке промисов достаточно одного catch в конце, чтобы перехватить любую ошибку в предшествующих then. При использовании async/await – нужно обернуть код с await в `try...catch`. Если внутри функции с async возникнет исключение или промис вернёт reject, управление перейдёт в блок catch, где можно обработать ошибку. Таким образом, try/catch в async функциях является аналогом .catch для промисов.
Какими способами можно выполнять асинхронные операции в JavaScript? Middle

Основные подходы: 1) **Колбеки** – передача функции обратного вызова, которая будет вызвана при завершении асинхронной операции (классический способ, может приводить к «аду колбеков» при глубокой вложенности). 2) **Промисы** – объект Promise, инкапсулирующий результат асинхронной операции; позволяет выстраивать цепочки `.then` и `.catch`. 3) **Async/await** – синтаксическое надстройка над промисами, позволяющая писать асинхронный код в привычном синхронном стиле (с помощью ключевых слов async и await), что упрощает чтение и обработку ошибок. Также иногда используют генераторы (function* + yield) совместно с промисами для асинхронности, но с появлением async/await – это редкий подход.
Что такое регулярные выражения и для чего они используются? Middle

Регулярные выражения – это шаблоны, используемые для поиска и обработки строк по определённым правилам. В JavaScript регэкспы – отдельный тип объектов (литералы пишутся в слэшах `/pattern/`). Они позволяют, например, проверять формат строки (соответствует ли email), искать и заменять подстроки по сложным условиям. Методы вроде `string.match(regexp)`, `string.replace(regexp, ...)` используют регулярные выражения. Регулярки – мощный инструмент для обработки текста: от простых проверок (есть ли цифра) до парсинга сложных структур, однако они могут быть трудночитаемы и требовать тщательного составления шаблонов.
В чём разница между операторами typeof и instanceof? Middle

`typeof` применяется к значению и возвращает строку с названием его типа (\"string\", \"number\", \"boolean\", \"undefined\", \"object\", \"function\" или \"symbol\", \"bigint\"). Он полезен для примитивов и функций. `instanceof` же проверяет принадлежность объекта к классу/конструктору: выражение `obj instanceof Constructor` вернёт true, если в цепочке прототипов объекта obj есть Constructor.prototype. Например, `arr instanceof Array` проверит, является ли arr массивом. `instanceof` работает только с объектами (для примитивов не имеет смысла) и учитывает наследование. Таким образом, typeof удобен для определения примитивных типов, а instanceof – для проверки типа объекта по его прототипу.
В чём разница между cookie, localStorage и sessionStorage? Middle

Все три механизма позволяют хранить данные на стороне браузера, но отличаются по характеру и объёму хранения. **Cookie** – небольшие (до ~4KB) строки, которые отправляются на сервер с каждым HTTP-запросом (если не указаны флаги, запрещающие это). Куки обычно имеют время жизни и используются для сессий, авторизации. **localStorage** – веб-хранилище, хранящее пары ключ-значение (строки) без автоматической отправки на сервер; данные localStorage сохраняются даже после закрытия браузера и доступны на том же домене при последующих посещениях. Объём localStorage значительно больше (порядка нескольких мегабайт). **sessionStorage** похож на localStorage, но \"живёт\" только в пределах одной сессии (данные хранятся пока открыт вкладка/окно браузера). После закрытия вкладки sessionStorage очищается. Итого: cookie – для общения с сервером (и для данных, которым нужен доступ на сервере), localStorage – для долгосрочного хранения на клиенте, sessionStorage – для хранения на время сессии.
Каковы преимущества использования Map по сравнению с объектом? Middle

Объекты в JavaScript можно использовать как словари, но структура Map предоставляет для этого ряд преимуществ. Во-первых, **ключи** в Map могут быть значениями любого типа (в том числе объекты), тогда как в обычном объекте ключи – только строки или символы. Во-вторых, Map легко узнать размер с помощью свойства `size`, тогда как у объекта нужно вручную считать ключи. Также в Map перебор элементов происходит в порядке их вставки, и Map не имеет прототипа с потенциальными конфликтующими ключами (у Object есть унаследованные свойства, например toString). К тому же, методы Map (set, get, has, delete) могут быть удобнее и работать чуть быстрее для словарных операций, поскольку Map специально для этого предназначен.
Почему использование eval() считается плохой практикой? Middle

`eval` выполняет строку как JavaScript код. Это несёт серьёзные проблемы с безопасностью: если в eval попадёт недоверенная строка (например, часть ввода пользователя), злоумышленник может выполнить произвольный код. Кроме того, eval негативно влияет на производительность – движки не могут оптимизировать код, который используют eval, и выполнение строки требует парсинга JS на лету. К тому же, использование eval делает код трудночитаемым и затрудняет отладку. В целом, практически любую задачу можно решить без eval – через другие языковые конструкции, поэтому его применение не рекомендуется.
Как выполнить несколько промисов параллельно? Middle

Для конкурентного выполнения независимых асинхронных операций служит `Promise.all`. Этот метод принимает массив (или другой итерируемый объект) промисов и возвращает новый промис, который переходит в состояние fulfilled, когда все промисы в массиве выполнятся (или rejected, если любой из них будет отклонён). Например, `Promise.all([fetch(url1), fetch(url2)])` запустит оба запроса параллельно и позволит ждать их обоих сразу. Результатом Promise.all при успешном выполнении будет массив результатов в том же порядке.
В чём разница между Promise.all и Promise.race? Middle

`Promise.all` ожидает выполнения всех промисов и возвращает промис с массивом результатов (или ошибкой, если хоть один промис отклонён). `Promise.race` же возвращает промис, который завершается или отклоняется сразу как только первый из переданных промисов выполнится или выбросит ошибку. То есть race «соревнуется» – чей результат будет первым, тот и возвращается. Например, Promise.race можно использовать, чтобы установить тайм-аут: запустить основной промис и промис-обёртку для тайм-аута – чей быстрее, тот и отработает.
Для чего нужен метод Promise.finally()? Middle

Метод `.finally()` вызывается на промисе и регистрирует колбек, который выполнится вне зависимости от исхода промиса – и при успешном выполнении, и при ошибке. Это удобно для выполнения завершающих действий (например, скрыть индикатор загрузки) без дублирования кода в .then и .catch. Колбек finally не получает аргументов (не знает, успешно или с ошибкой завершилось) – он предназначен для действий, которые надо сделать в любом случае. После finally можно продолжить цепочку, при этом исходное значение или ошибка будут переданы дальше (finally их не изменяет, если не выбрасывать исключений внутри него).
Поддерживает ли JavaScript ООП и как оно реализовано? Middle

Да, JavaScript поддерживает объектно-ориентированное программирование, но у него не классическое ООП, а прототипное. Вместо классов как таковых (до ES6) использовались функции-конструкторы и прототипы для наследования. Объекты могут наследовать свойства друг от друга через цепочку прототипов. В ES6 ввели синтаксический сахар – ключевое слово `class`, позволяющее объявлять классы привычным синтаксисом. Под капотом классы всё равно используют прототипное наследование. Таким образом, ООП в JS реализовано через объекты и их прототипы: один объект может выступать прототипом (шаблоном) для другого, а также через конструкторы и ES6-классы.
Чем отличаются свойства event.target и event.currentTarget? Middle

`event.target` – это исходный элемент, на котором произошло событие (например, конкретная кнопка, по которой кликнули). `event.currentTarget` – элемент, на котором в данный момент выполняется обработчик. Если обработчик назначен непосредственно на элементе, обычно target и currentTarget совпадают. Но при всплытии, когда обработчик стоит на родителе, `event.target` будет потомок (источник события), а `event.currentTarget` – сам родитель, который сейчас обрабатывает событие. Таким образом, target полезен, чтобы узнать исходный элемент, вызвавший событие, а currentTarget – чтобы узнать, на каком элементе запущен данный обработчик.
Для чего используются операторы break и continue? Middle

Оба оператора управляют течением цикла. `break` прерывает выполнение цикла целиком, выходя из него. Обычно break используют, когда достигнуто какое-то условие и дальнейший цикл не нужен. `continue` не завершает весь цикл, но пропускает текущую итерацию и переходит к следующей. То есть, при срабатывании continue оставшийся код в теле цикла для текущей итерации не выполняется, цикл сразу начинает следующую итерацию (если условие цикла ещё истинно).
В чём разница между событиями DOMContentLoaded и load? Middle

Событие `DOMContentLoaded` происходит на объекте `document` когда HTML-документ полностью загружен и разобран, но внешние ресурсы (картинки, стили, фреймы) ещё могут догружаться. То есть DOM готов к работе. Событие `load` происходит на объекте `window` после загрузки всех ресурсов страницы – в том числе изображений, стилей, скриптов и пр. Обычно `DOMContentLoaded` наступает раньше, и в нём удобно инициализировать скрипты, не дожидаясь тяжелых ресурсов. Событие `load` же полезно, когда нужно убедиться, что всё полностью загружено (например, для скриптов, рассчитывающих размеры изображений).
Почему не рекомендуется изменять прототипы встроенных объектов? Middle

Изменение (монкипатчинг) прототипов встроенных объектов (таких как Array, Object, Function и т.д.) может привести к ряду проблем. Во-первых, это может вызвать конфликт: разные библиотеки или части кода могут определять одноимённые методы, что приведёт к непредвиденному поведению. Во-вторых, новые свойства в прототипах будут перечисляться циклом for...in по всем объектам данного типа, что может нарушить логику существующего кода. В-третьих, некоторые встроенные методы могут полагаться на стандартное поведение прототипов. В целом, изменение глобальных прототипов влияет на всё окружение и усложняет поддержку кода, поэтому лучше избегать этого и расширять функциональность другими способами (утилиты, наследование, композиция и т.п.).
Что такое Symbol и для чего он нужен? Middle

Symbol – примитивный тип, добавленный в ES6, представляющий уникальный идентификатор. Каждый вызов `Symbol()` создаёт уникальный символ. Символы часто используют как уникальные ключи свойств объекта, которые не пересекаются с обычными строковыми ключами. Например, можно создать символ `const id = Symbol("id")` и использовать его как ключ: `obj[id] = 123`. Такое свойство не появится при обычном переборе объекта и не столкнётся по имени с другими свойствами. Некоторые символы зарезервированы для внутр. механик (например, Symbol.iterator). В общем, Symbol позволяет создавать скрытые или уникальные свойства в объектах и метаданные.
Для чего используется тип BigInt? Middle

BigInt – специальный числовой тип, позволяющий работать с целыми числами произвольной длины. Обычный тип Number в JavaScript может точно представлять целые только до 2^53 (около 9e15) – это максимальное безопасное целое (Number.MAX_SAFE_INTEGER). BigInt же может содержать числа гораздо больше (или меньше) без потери точности. BigInt литералы обозначаются суффиксом n, например 123n. Этот тип полезен для расчётов с очень большими целыми (криптография, точные финансовые расчёты) или при работе с длинными идентификаторами.
В чём разница между функциями parseInt() и parseFloat()? Middle

`parseInt` и `parseFloat` оба преобразуют строку в число, но parseInt считывает целое число (integer), а parseFloat – число с плавающей точкой (десятичное). `parseInt("3.14")` вернёт 3 (т.к. остановится на символе точки, не относящемся к целым цифрам), а `parseFloat("3.14")` вернёт 3.14. Оба игнорируют начальные пробелы, а также позволяют строке начинаться с числового значения, а потом идут нецифры – они прекратят чтение на первом нецифровом символе. Если первый символ не цифра (и не знак), оба вернут NaN.
Чем отличается isNaN() от Number.isNaN()? Middle

Глобальная функция `isNaN` сначала пытается привести переданное значение к числу, а затем проверяет, NaN ли оно. Это приводит к некоторым неожиданным результатам: например, `isNaN("foo")` -> true, потому что `"foo"` преобразуется в NaN. `Number.isNaN` работает строже: он возвращает true только если аргумент уже является типом number и равен NaN. То есть `Number.isNaN("foo")` -> false (строка не является числом). Таким образом, Number.isNaN лучше использовать, когда нужно проверить именно NaN без неожиданных превращений типа.
Чем отличается Array.forEach() от Array.map()? Middle

Метод `forEach` ничего не возвращает – он просто выполняет заданную функцию для каждого элемента (для побочных эффектов). Метод `map` формирует на основе исходного новый массив с результатами вызова колбека на каждом элементе. Если вам нужен новый преобразованный массив – используйте map. Если нужно лишь выполнить операцию на каждом элементе (например, записать что-то в консоль или изменить существующий объект), и результат не требуется – используйте forEach. Кроме того, forEach нельзя прервать, а map можно комбинировать с filter и другими методами цепочкой, т.к. он возвращает массив.
Что такое геттеры и сеттеры в JavaScript? Middle

Геттеры и сеттеры – это специальные свойства объекта (или класса), при обращении к которым вызывается заданная функция. Геттер определяется через ключевое слово `get` перед именем метода, а сеттер – через `set`. Например: `let obj = { get prop() { ... }, set prop(value) { ... } };`. Тогда `obj.prop` при чтении вызовет геттер, а при присвоении – сеттер. Они позволяют делать видимое свойство, внутри которого выполняется логика (например, валидация, кэш). В классе синтаксис аналогичен внутри тела класса. Геттеры/сеттеры дают возможность контролировать доступ к данным объекта как будто через обычные свойства.
Почему промисы (или async/await) предпочтительнее колбеков? Middle

Промисы и тем более синтаксис async/await заметно облегчают написание и поддержку асинхронного кода по сравнению с чистыми колбеками. Основные причины: 1) Промисы избавляют от глубокой вложенности («ад колбеков») – можно выстраивать последовательность операций цепочкой `.then` или вообще писать как синхронный код через await. 2) Ошибки в промисах автоматически попадают в `.catch`, тогда как при использовании колбеков нужна отдельная обработка ошибок в каждом колбеке. 3) Код с async/await более читаем: последовательность асинхронных действий выглядит как обычный последовательный код, его проще понимать и отлаживать. Кроме того, промисы позволяют легко запускать операции параллельно (Promise.all), что с колбеками требовало бы счётчиков или дополнительной логики.
В чём разница между XMLHttpRequest и fetch()? Middle

XMLHttpRequest (XHR) – старый API для AJAX-запросов. Он работает через создание объекта, установки различных обработчиков (onreadystatechange) и отправки запроса методом `.send()`. Код с XHR выходит более громоздким. Fetch – современный API, который возвращает промис. В fetch легче осуществлять запросы: `fetch(url).then(...)`. Он предоставляет удобный объект Response с методами (json(), text() и т.д.). Также fetch по умолчанию не отправляет куки (требуется опция `credentials`), а XHR отправляет по умолчанию. В целом, fetch – более простой и гибкий способ делать AJAX-запросы, и его синтаксис лучше интегрируется с промисами и async/await.
Что такое CORS? Middle

CORS (Cross-Origin Resource Sharing) – это механизм безопасности браузера, позволяющий или запрещающий веб-странице запрашивать ресурсы с другого домена. По умолчанию, скрипт на странице не может обращаться к API другого домена, если тот не разрешил это через специальные заголовки. Если сервер настроен добавить заголовок `Access-Control-Allow-Origin` (например, `*` или конкретный домен), то браузер позволит скрипту получить ответ. Иначе запрос будет заблокирован политикой единого источника (Same Origin Policy). CORS предусматривает также \"предварительные\" запросы (OPTIONS) для небезопасных запросов. Таким образом, CORS – это соглашение между браузером и сервером, обеспечивающее безопасность при междоменных запросах.
Как преобразовать NodeList в массив? Middle

NodeList – результат, например, `document.querySelectorAll` – это коллекция элементов, похожая на массив, но не полностью им являющаяся (не имеет всех методов массива). Для преобразования NodeList в настоящий массив можно использовать `Array.from(nodeList)`. Либо воспользоваться оператором spread: `[...nodeList]`. Оба подхода создадут новый Array, содержащий те же элементы. После этого можно применять методы массива (forEach, map и т.д.) к полученному списку элементов.
Что возвращает typeof при применении к функции? Middle

`typeof` для функций имеет особенность: для любой функции (например, `function test(){}` или стрелочной `() => {}`) оператор вернёт строку `"function"`. Несмотря на то что функция в JavaScript является объектом, typeof различает их и даёт отдельный тип \"function\". Это полезно для проверки: `typeof someVar === "function"` позволит понять, содержит ли переменная функцию.

Senior

Что такое опциональная цепочка (`?.`) в JavaScript? Senior

Опциональная цепочка – это оператор `?.`, который позволяет безопасно обращаться к вложенным свойствам объекта. Если часть цепочки слева от `?.` равна null или undefined, то дальнейшее обращение не выполняется и выражение возвращает undefined вместо ошибки. Например: `user?.address?.city` вернёт undefined, если объекта user нет или у него нет address, вместо того чтобы выбросить ошибку. Таким образом, оператор `?.` помогает избегать ошибок при доступе к глубоко вложенным свойствам, которые могут отсутствовать.
Для чего используется оператор `??` (nullish coalescing)? Senior

Оператор объединения с null (`??`) возвращает правый операнд, если левый операнд равен null или undefined, а иначе возвращает левый. Это полезно для задания значений по умолчанию только в случае \"отсутствия\" значения. Например: `let result = input ?? "default";` – переменная result получит значение input, если input не null/undefined, и строку "default" иначе. В отличие от логического `||`, nullish coalescing не считает 0 или пустую строку поводом взять значение по умолчанию (так как 0 и \"\" не являются null/undefined).
В чём разница между микрозадачами и макрозадачами в Event Loop? Senior

В JavaScript-цикле событий задачи делятся на макрозадачи (events, или «очередь сообщений») и микрозадачи (jobs). Макрозадачи – это основные события, поступающие в очередь (например, обработчики DOM-событий, таймауты, сетевые ответы). Микрозадачи – задачи более высокого приоритета, которые выполняются сразу после текущего кода и перед тем, как Event Loop возьмёт следующую макрозадачу. Примеры микрозадач: колбеки промисов (then/catch/finally) и process.nextTick в Node.js. Механизм такой: после выполнения текущего скрипта или обработчика, сначала выполняются все накопившиеся микрозадачи (и возможно добавляют новые – те тоже выполняются), и только затем Event Loop переходит к следующей макрозадаче из очереди (например, следующему событию или сообщению).
Что такое утечка памяти в JavaScript и как её избежать? Senior

Утечка памяти – это ситуация, когда программа удерживает ссылки на объекты, которые уже не нужны, из-за чего сборщик мусора не может освободить память. В JavaScript утечки памяти могут возникать, например, при размещении объектов в глобальной области (они остаются на всё время работы приложения), при создании замыканий, удерживающих большие структуры неосвобождёнными, или при забытом очищении таймеров/обработчиков (они хранят ссылки на объекты). Чтобы избежать утечек, следует: освобождать ненужные ссылки (обнулить свойства, удалить обработчики событий, очищать массивы, если они больше не нужны), избегать создания ненужных глобальных переменных, следить за замыканиями (не хранить в замыкании избыточные данные). В современных браузерах крупные утечки – редкость, но внимательность требуется, особенно в долгоживущих одностраничных приложениях.
Что происходит при вызове функции с ключевым словом `new`? Senior

При вызове функции-конструктора через `new` происходит следующее: 1) Создаётся новый пустой объект. 2) Этот объект назначается контекстом `this` для вызова конструктора. 3) Объект прототипно связывается с `Constructor.prototype` (то есть его __proto__ = Constructor.prototype). 4) Выполняется код функции-конструктора с переданными аргументами. 5) Если конструктор явно не вернул объект, то возвращается тот самый новосозданный объект `this`. Если же в конструкторе прописан явный возврат объекта, то вернётся именно он (а возвращение примитива игнорируется). Таким образом, new позволяет функции-конструктору инициализировать объект и вернуть его в качестве результата.
Что такое Proxy и для чего он используется? Senior

Proxy – это встроенный объект, введённый в ES6, позволяющий перехватывать и переопределять базовые операции над другим объектом. Прокси создаётся как `new Proxy(target, handler)`, где target – проксируемый объект, а handler – объект с «ловушками» (trap) – функциями, которые будут обрабатывать различные операции: чтение свойства (get), запись свойства (set), вызов функции, оператор in, удаление свойства и многое другое. Proxy полезен, например, для логирования и отладки доступа к объекту, для реализации наблюдения за изменениями (reactive data), для создания защитных оболочек, валидаторов и т.д. По сути, Proxy позволяет программно контролировать поведение объекта при взаимодействии с ним.
Как сделать свойство объекта неперечисляемым? Senior

По умолчанию свойства, добавленные обычным способом, являются перечисляемыми (enumerable) – они появляются при переборе объекта в цикле for...in или Object.keys. Чтобы задать свойство как неперечисляемое, нужно определить его через `Object.defineProperty`. Например: `Object.defineProperty(obj, "secret", { value: 42, enumerable: false });`. В этом случае свойство secret не будет выводиться при переборе свойств. Кроме enumerable, defineProperty позволяет настроить флаги writability и configurability. Но конкретно для неперечисляемости достаточно установить enumerable: false.
Что такое типизированный массив (TypedArray)? Senior

Типизированные массивы – это особые объекты для работы с бинарными данными. Они включают ArrayBuffer и представители: Uint8Array, Int16Array, Float32Array и т.д. Такие массивы хранят элементы одного определённого типа (целые без знака, с определённой разрядностью, числа с плавающей точкой и т.п.) и позволяют эффективно работать с двоичными данными, например, при обработке файлов, сетевых буферов, в WebGL. По сути, ArrayBuffer – это сырой блок памяти, а типизированные представления (Uint8Array и др.) – «представления» этой памяти как массива определённых числовых значений. Они гораздо ближе к работе с памятью, как в языках C/C++, и служат для высокопроизводительных вычислений или работы с бинарными протоколами.
Что такое каррирование функций (currying)? Senior

Каррирование – это трансформация функции, которая принимает несколько аргументов, в набор вложенных функций, каждая из которых принимает один аргумент. Например, есть функция f(x, y). Каррированная версия будет выглядеть как f(x)(y). Вызов f(a)(b) даст тот же результат, что и оригинальный f(a, b). Каррирование позволяет частично применять функцию: например, g = f(a) – зафиксировать первый аргумент, а потом вызывать g(b) для разных b. Этот приём используется в функциональном программировании для переиспользования функций с частично задаными аргументами и улучшения композиции функций.
Как сделать объект итерируемым и для чего используется Symbol.iterator? Senior

Объект считается итерируемым, если он имеет специальный метод с ключом `Symbol.iterator`. Этот метод должен возвращать итератор – объект с методом `next()`, который при каждом вызове возвращает объект формата { value: ..., done: ... }. Пример: `obj[Symbol.iterator] = function() { return { next() { ... } } }`. `Symbol.iterator` – это встроенный символ, используемый JavaScript для определения поведения объекта в цикле for...of и других местах, ожидающих итератор (например, Spread-оператор ...). В стандартных структурах (Array, Map и т.д.) Symbol.iterator уже реализован. Таким образом, чтобы сделать свой класс или объект итерируемым, нужно определить в нём метод Symbol.iterator, и тогда его экземпляры можно перебрать через for...of.
Почему 0.1 + 0.2 не равно 0.3? Senior

Потому что числа в JavaScript (тип Number) хранятся в формате с плавающей точкой двойной точности (IEEE 754), и многие десятичные дроби не могут быть точно представлены в двоичной системе. Числа 0.1 и 0.2 в двоичной форме являются бесконечными дробями, при их хранении возникают небольшие погрешности. В итоге при сложении 0.1 + 0.2 получается значение, очень близкое к 0.3, но не строго равное ему (0.30000000000000004). Поэтому выражение 0.1 + 0.2 === 0.3 даст false. Это не ошибка JS, а ограничение представления вещественных чисел. Решение – округлять результат до нужного количества знаков или использовать тип BigInt для целых, или специальные библиотеки для точных десятичных вычислений.
Чем отличается значение undefined от ошибки "is not defined"? Senior

Undefined – это специальное значение в JavaScript, означающее \"неопределено\". Оно присваивается переменной, которая объявлена, но не инициализирована, или возвращается при отсутствии возвращаемого значения у функции, или при обращении к несуществующему свойству объекта. Ошибка же \"ReferenceError: x is not defined\" (\"не определена\") возникает, когда код пытается обратиться к переменной, которая вовсе не объявлена в текущей области видимости. То есть undefined – это значение, а \"not defined\" – это состояние переменной, когда интерпретатор её имени не знает вообще.
Что такое чистая функция (pure function) в JavaScript? Senior

Чистая функция – это функция, которая не имеет побочных эффектов и при одинаковых входных данных всегда возвращает одинаковый результат. Побочных эффектов нет – значит, она не изменяет внешние переменные, не производит ввод/вывод, не меняет состояние, видимое снаружи (как глобальные объекты или аргументы-объекты). Чистые функции облегчают тестирование и понимание, так как их влияние локально – они зависят только от аргументов. Пример чистой функции: математическая функция, например `square(x) { return x * x; }`. В отличие от нечистой, например, `random()` или функция, меняющая глобальное состояние.
Что такое лексическое окружение (lexical environment) в JavaScript? Senior

Лексическое окружение – это внутренний механизм, с помощью которого JavaScript хранит и связывает идентификаторы (переменные, функции) с их значениями в определённой области видимости. Каждый блок кода (функция, или блок {...} при использовании let/const) создаёт своё лексическое окружение, содержащее запись всех локальных переменных и ссылки на внешнее (родительское) окружение. Когда интерпретатор ищет значение переменной, он сначала смотрит в текущем лексическом окружении, затем поднимается по цепочке внешних окружений (скоупов) вплоть до глобального. Концепция лексических окружений объясняет работу замыканий: замыкание сохраняет ссылку на внешнее окружение, в котором было создано, поэтому имеет доступ к тем переменным.
Объясните понятия "стек вызовов" (call stack) и "куча" (heap) в JavaScript. Senior

Стек вызовов – это структура данных (LIFO), в которой хранится последовательность вызовов функций и контекстов выполнения в процессе работы программы. Когда вызывается новая функция, запись о ней (контекст) помещается наверх стека, а когда функция завершается – запись снимается. Если стек вызовов переполняется (например, из-за бесконечной рекурсии), возникает ошибка \"stack overflow\". Куча (heap) – это большая неструктурированная область памяти, из которой выделяется память под объекты, массивы и другие динамические данные. В JS управлением памятью занимается сборщик мусора, который освобождает память в куче от объектов, на которые нет ссылок. Проще говоря, стек – для контроля порядка выполнения (функции и их локальные переменные), куча – для размещения объектов в памяти.
В чём разница между использованием const и Object.freeze() для объектов? Senior

Использование `const` при объявлении объекта лишь гарантирует, что сама переменная-ссылка не будет переназначена на другой объект. Однако внутреннее содержимое объекта (его свойства) при этом остаётся изменяемым. То есть `const obj = {a:1}` не позволяет сделать `obj = {}` заново, но `obj.a = 2` изменить значение вполне можно. `Object.freeze(obj)` же накладывает запрет на изменения самого объекта: после заморозки нельзя добавлять новые свойства, удалять или менять существующие (и нельзя менять перечислимость/конфигурабельность свойств). Таким образом, `Object.freeze` делает объект (только верхний уровень) неизменным. В сочетании: можно объявить объект через const и заморозить его, тогда переменную нельзя переназначить, и объект не изменить.
Что такое генераторная функция (function*) и как работает yield? Senior

Генератор – это особый вид функции, объявляемой с помощью `function*`, которая может приостанавливать своё выполнение и возобновлять его. Внутри генератора используется ключевое слово `yield` для выдачи промежуточного значения и паузы. Вызов генератора возвращает итератор (объект с методом next). При вызове `.next()` генератор выполняется до ближайшего yield и возвращает его значение, при следующем next – продолжится с места остановки. Если генератор завершается (достиг конца или return), done: true. Например: `function* gen() { yield 1; yield 2; }` – возвращает итератор, у которого первый next() даст {value:1, done:false}, второй – {value:2, done:false}, третий – {value: undefined, done:true}. Генераторы удобны для создания итераторов или реализции \"ленивых\" вычислений, а также могут использоваться для упрощения работы с асинхронным кодом (до появления async/await).
Что возвращает функция, объявленная с async? Senior

Любая функция, объявленная с ключевым словом `async` перед её определением, всегда возвращает Promise. Если в теле async-функции вернуть обычное значение (не промис), оно автоматически оборачивается в resolved Promise. Если функция выбрасывает исключение или происходит необработанная ошибка, возвращаемый промис будет отклонён с этой ошибкой. Например: `async function f() { return 42; }` возвращает Promise, который сразу resolve-ится со значением 42. Аналогично, `return Promise.resolve(42)` или просто `return 42` внутри async-функции – эквивалентны. Благодаря этому async/await синтаксически выглядит как обычный return/throw, но всегда работает через промисы.
Что такое паттерн "Наблюдатель" (Observer) и где он используется? Senior

Паттерн \"Наблюдатель\" – это шаблон проектирования, при котором один объект (\"издатель\" или \"субъект\") поддерживает список других объектов (\"наблюдателей\") и автоматически уведомляет их об изменениях состояния, вызывая определённый метод. В JavaScript данный паттерн проявляется, например, в DOM-событиях: элемент (издатель) при наступлении события вызывает все подписанные обработчики (наблюдатели). Другой пример – реализация EventEmitter в Node.js (объект, позволяющий подписаться на события и эмитить их). Паттерн Observer широко используется для реализации системы событий, реактивных интерфейсов (в фреймворках), и в архитектуре \"publish-subscribe\" (издатель/подписчик), где подписчики получают уведомления о происходящих в издателе событиях.
Чем различаются __proto__ и свойство prototype? Senior

`obj.__proto__` – это свойство конкретного объекта, указывающее на его прототип (то есть другой объект, от которого obj наследует свойства). А свойство `Function.prototype` – это свойство функции-конструктора, которое определяет, каким будет прототип у всех создаваемых этой функцией экземпляров. Например: у функции-конструктора User есть User.prototype. Если создать объект: `let u = new User()`, то `u.__proto__ === User.prototype`. Итого: prototype – свойство функции (класса), __proto__ – свойство экземпляра. prototype используется при создании объектов через new (формируя их внутренний прототип), а __proto__ позволяет в рантайме обращаться к прототипу конкретного объекта.
Что такое XSS-атака и как от неё защититься? Senior

XSS (Cross-Site Scripting) – это уязвимость, при которой злоумышленник внедряет в веб-страницу вредоносный JavaScript-код, который затем выполняется у других пользователей. Например, если сайт выводит без фильтрации пользовательский ввод, атакующий может вставить `<script>...</script>` – и этот скрипт будет выполнен у всех, кто откроет страницу. Последствия XSS – кража cookie, токенов, выполнение действий от имени пользователя. Защита от XSS: тщательно экранировать/фильтровать выводимые данные (спецсимволы HTML заменять на безопасные последовательности), использовать Content Security Policy (CSP), избегать `eval` и небезопасных конструкций. Если нужно вставлять HTML от пользователя – применять безопасные библиотеки для санитизации.
Для чего нужны атрибуты async и defer в теге `<script>`? Senior

Оба атрибута предназначены для загрузки внешних скриптов без блокировки HTML-документа. `async` означает, что скрипт загружается асинхронно и выполняется сразу после загрузки, не дожидаясь других скриптов. При этом порядок выполнения async-скриптов не гарантируется (какой загрузился первым, тот и запустился). Атрибут `defer` тоже загружает скрипт параллельно, но откладывает его выполнение до тех пор, пока весь HTML-документ не будет полностью обработан (DOMContentLoaded). Кроме того, скрипты с defer сохраняют порядок относительно друг друга. Используя async, ставят независимые скрипты (например, аналитика), а defer – скрипты, которым нужно DOM и которые могут идти в определённом порядке.
Чем отличается event.stopImmediatePropagation() от event.stopPropagation()? Senior

Оба метода предназначены для прекращения распространения события вверх по DOM. Однако `stopPropagation()` просто предотвращает всплытие события к родительским элементам, но не мешает другим обработчикам этого же события на том же элементе выполниться. `stopImmediatePropagation()` же, помимо остановки всплытия, также не позволяет дальнейшим обработчикам этого же события на текущем элементе исполниться. То есть, если на элементе несколько обработчиков одного события, вызов stopImmediatePropagation в первом обработчике предотвратит вызов последующих обработчиков на нём.
Зачем вызывают setTimeout(func, 0)? Senior

Вызов `setTimeout(func, 0)` планирует выполнение функции `func` сразу после текущего исполнения кода, поставив её в очередь сообщений. По сути, это способ отложить выполнение на минимально возможное время – когда текущий стек завершится и Event Loop возьмёт новую задачу (наш колбек). Практически это применяют, чтобы, например, отложить выполнение тяжёлой функции, позволив браузеру обновить интерфейс, или выстроить правильный порядок событий (некоторые действия выполнить асинхронно, даже если они могли бы быть синхронными). В современных браузерах аналог – `queueMicrotask` для микрозадач, но setTimeout с нулевой задержкой остаётся простым способом разместить задачу в конец очереди макрозадач.
Что такое контекст выполнения (execution context) в JavaScript? Senior

Контекст выполнения – это абстракция, описывающая среду, в которой выполняется текущий код. Каждый раз при вызове функции создаётся новый контекст выполнения. Он включает: 1) лексическое окружение (переменные, функции, аргументы, `this` и т.д.), 2) информацию о том, как функция была вызвана (например, значение this, идентификатор функции), 3) может содержать внешние данные (ссылка на внешнее окружение). Глобальный код выполняется в глобальном контексте выполнения. Контексты образуют стек вызовов. Когда функция заканчивает выполнение, её контекст снимается со стека. Управление контекстами – важная часть работы движка, скрытая от разработчика, но понимание, что у каждой функции свой \"внутренний мир\" (локальные переменные, this и пр.), – это и есть контекст выполнения.
Поддерживает ли JavaScript оптимизацию хвостовых вызовов (tail-call optimization)? Senior

Спецификация ES2015 ввела возможность оптимизации хвостовых вызовов (то есть нерастущей рекурсии: когда последним действием функции является вызов другой функции). В теории, в строгом режиме движок может не увеличивать стек при таком вызове, а переиспользовать текущий контекст, что позволяет писать рекурсивные функции без риска переполнения стека. Однако на практике на 2024 год большинство JS-движков (V8, SpiderMonkey) не реализуют TCO из соображений совместимости и сложности. Исключением является движок Safari (WebKit), где tail-call optimization поддерживается в строгом режиме. Таким образом, в общем случае JavaScript разработчику лучше не рассчитывать на TCO – хвостовая рекурсия может привести к переполнению стека в большинстве сред.
Что такое шаблон "Модуль" (Module pattern) в JavaScript? Senior

Module pattern – паттерн, использовавшийся до появления нативных модулей, для организации кода в модуле с приватными и публичными частями. Обычно реализуется через IIFE: создаётся немедленно вызываемая функция, внутри которой объявляются \"приватные\" переменные и функции, а возвращается объект с \"публичным\" API (функциями, которые можно вызвать снаружи). Полученный объект сохраняется в переменной (или глобальной переменной с именем модуля). Такой подход изолирует внутренние детали (они недоступны снаружи, лежат в замыкании) и выставляет наружу только нужную функциональность. Пример: \n```js\nconst CounterModule = (function(){ let count = 0; return { inc() { count++; }, get() { return count; } } })();\n```\nТут CounterModule – модуль с приватной переменной count.
В чём разница между глобальным объектом в браузере и в Node.js? Senior

В среде браузера глобальным объектом является `window` (а также его эквивалент `self` или `globalThis`), он представляет собой глобальную область видимости: глобальные переменные становятся свойствами window. В Node.js глобальный объект называется `global` (и также доступен `globalThis` с Node v12+). Поэтому, например, в браузере `window.alert` вызывает alert, а в Node `global.setTimeout` – это глобальная функция таймера. Код, написанный для браузера, может использовать window для доступ к глобалу, а в Node – global. Сейчас спецификация предоставляет универсальный доступ через `globalThis`, который одинаково доступен и в браузере, и в Node.
Что делает метод Promise.allSettled()? Senior

Promise.allSettled, добавленный в ES2020, ждёт завершения всех переданных промисов, но в отличие от Promise.all, он никогда не переходит в состояние rejected. Он всегда выполняется успешно, даже если некоторые промисы были отклонены. Результатом allSettled является промис, который выполняется с массивом результатов в виде объектов: {status: "fulfilled", value: ...} для успешно выполненных или {status: "rejected", reason: ...} для отклонённых промисов. Это полезно, когда нужно дождаться *всех* операций, не прерываясь из-за ошибки, и затем обработать индивидуально их результаты и ошибки.
Что произойдёт, если конструктор функции при вызове через `new` вернёт объект? Senior

По правилам работы `new`, если конструктор (функция, вызванная с new) явно возвращает объект (`return someObj`), то результатом вызова new станет именно этот объект, а не созданный по умолчанию экземпляр. Это позволяет конструкторам иногда возвращать из себя совершенно другой объект. Если же конструктор возвращает примитивное значение (число, строку и т.д.) или ничего не возвращает, то это игнорируется, и возвращается обычный созданный объект `this`. Таким образом, return объекта в конструкторе \"подменяет\" итог.
Какое значение принимает `this` при вызове функции без контекста в строгом режиме и вне строгого? Senior

Если функция вызывается как обычная (`func()`), без привязки к объекту, то в нестрогом режиме `this` внутри неё будет указывать на глобальный объект (в браузере это window). В строгом режиме (`"use strict"`) значение `this` в таком случае будет undefined. Это сделано, чтобы предотвращать неявное использование глобального контекста. Таким образом, отличие: в non-strict функции без контекста: this = window; в strict функции: this = undefined (и попытка обращаться к свойствам this вызовет ошибку).
Как JavaScript выполняет нестрогое сравнение (==) разных типов? Senior

При использовании оператора `==` (нестрогое равенство) если типы операндов различаются, JS приводит их к одному типу по определённым правилам перед сравнением. Основные правила: при сравнении строки и числа – строка приводится к числу (`"5" == 5` -> 5 == 5 -> true); boolean сравнивается, предварительно приводясь к числу (true -> 1, false -> 0); null и undefined при сравнении друг с другом считаются равными, но ни к чему другому не приводятся (null == undefined -> true, но null != 0); объект при сравнении с примитивом преобразуется в примитив через метод valueOf или toString (например, `[1] == "1"` -> "1" == "1" -> true, потому что массив [1] приводится к "1"). Эти правила довольно сложные, поэтому для предсказуемости часто предпочитают использовать === и явные преобразования.
Как объявить приватное поле класса? Senior

В современном JavaScript (ES2022) появилась возможность объявлять приватные поля класса с помощью символа `#` перед именем поля. Например: \n```js\nclass MyClass {\n #secret;\n constructor(val) {\n this.#secret = val;\n }\n getSecret() {\n return this.#secret;\n }\n}\n```\nПоле #secret – приватное: к нему нельзя обратиться снаружи класса (например, obj.#secret вызовет синтаксическую ошибку). Приватные поля реализуются на уровне языка, обеспечивая инкапсуляцию – они видны только внутри методов этого класса.
В чём разница между Object.seal() и Object.freeze()? Senior

`Object.freeze(obj)` полностью замораживает объект: запрет на добавление новых свойств, удаление существующих, а также на изменение значений текущих свойств (и на изменение их атрибутов). Объект становится неизменным. `Object.seal(obj)` – «запечатывает» объект: нельзя добавлять новые свойства и удалять существующие, но менять значения существующих свойств можно (если сами свойства не были объявлены как read-only). То есть seal запрещает расширять/сокращать объект, но не запрещает модифицировать данные в нём, а freeze запрещает любые изменения. Оба метода возвращают сам объект (для удобства), и оба работают поверхностно (не затрагивают вложенные объекты).
Что такое "Temporal Dead Zone" в JavaScript? Senior

Temporal Dead Zone (TDZ) – это период времени от начала области видимости (например, функции или блока) до момента фактического объявления переменной `let` или `const`, в течение которого переменная существует, но недоступна для использования. Если попытаться обратиться к переменной в TDZ, возникнет ReferenceError. Проще: переменные let/const поднимаются логически, но не инициализируются. Это объясняет, почему нельзя использовать переменную, объявленную через let, до её строчки объявления. TDZ заканчивается, когда исполнение кода достигает строки объявления переменной – тогда она инициализируется. Этот механизм сделан для предотвращения доступа к переменной до её явного объявления, в отличие от var, которое при hoisting инициализируется undefined.
Как JavaScript преобразует объект к примитивному значению? Senior

Когда требуется использовать объект там, где нужен примитив (например, при сложении объекта с числом или сравнении с строкой), JavaScript пытается преобразовать объект к примитиву (строке или числу). Алгоритм таков: он вызывает у объекта метод `valueOf` (если существует) – должен вернуть примитив. Если valueOf не вернул примитив, вызывается метод `toString`. То, что вернёт toString (обычно строка), и будет примитивным представлением. Например, у массива метод toString возвращает объединённые элементы, поэтому `[1,2] + ""` -> `"1,2"`. У объекта по умолчанию valueOf возвращает сам объект, а toString – строку `"[object Object]"`. Поэтому, например, `{} + ""` -> \"[object Object]\".
Что произойдёт, если использовать объект как ключ свойства обычного объекта? Senior

Если использовать объект как ключ в обычном объекте (через назначение obj[someObject] = value), этот ключ неявно преобразуется в строку. По правилу преобразования объектов к примитиву, объект по умолчанию становится `"[object Object]"`. Таким образом, все объекты-ключи превратятся в одну и ту же строку "[object Object]". Это значит, что если вы попробуете использовать два разных объекта в качестве ключей, на самом деле они будут перезаписывать одно свойство. По этой причине для карт \"объект -> значение\" применяют Map, где ключи могут быть объектами напрямую (без преобразования).
Чему равно выражение [] == ![] и почему? Senior

Выражение `[] == ![]` оценивается как true. Разберём по шагам: `![]` – логическое НЕ, при приведении массива [] к boolean он считается true (непустой объект -> true), а !true даёт false. Теперь сравнение: [] == false. При нестрогом сравнении, если один операнд boolean (false), он приводится к числу: false -> 0. Сравнение становится [] == 0. Далее массив [] приводится к примитиву: для массива valueOf возвращает сам массив, toString возвращает пустую строку `\"\"`. Пустая строка при нестрогом сравнении с числом приводится к числу 0. Получается 0 == 0, что истинно. Поэтому результат true. Этот пример демонстрирует, как неочевидно работает абстрактное сравнение с приведением типов.