React Frontend Developer

Question 1

Как работает перерендеринг элементов, когда используются атрибуты data- и как они могут влиять на производительность?

Accepted Answer

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

Question 2

Зачем для тега <script> добавляют атрибуты async и defer?

Accepted Answer

Атрибуты async и defer у тега <script> используются для управления тем, как и когда браузер загружает и выполняет JavaScript. async загружает скрипт асинхронно и выполняет его сразу после загрузки, не дожидаясь завершения загрузки всей страницы. defer также загружает скрипт асинхронно, но откладывает его выполнение до полной загрузки HTML-документа, что предотвращает блокировку рендеринга страницы.

Question 3

Что такое событие в контексте DOM и как его можно обработать?

Accepted Answer

Событие в контексте DOM — это действие, происходящее на веб-странице, например, щелчок мышью или нажатие клавиши. Обработчик события — это функция, которая выполняется, когда это событие происходит. Для обработки события вы можете использовать метод addEventListener(), например:document.getElementById('myButton').addEventListener('click', function() {
    alert('Кнопка нажата!'); 
});Этот код вызывает функцию при нажатии на кнопку.

Question 4

Как работает this для прототипов объекта?

Accepted Answer

Когда метод вызывается на объекте, который наследует этот метод через прототип, this указывает на объект, на котором был вызван метод, а не на сам прототип. То есть, независимо от того, где определен метод — на объекте или на его прототипе — this всегда ссылается на объект, который инициировал вызов.

Question 5

Особенности стрелочных функций (this, arguments) и как изменить контекст?

Accepted Answer

Стрелочные функции не создают собственного контекста this и используют значение this из внешней функции. Они также не имеют объекта arguments, что делает их менее гибкими в некоторых ситуациях. Контекст стрелочной функции изменить нельзя, так как он жёстко привязан к внешней области видимости.

Question 6

Методы call, apply, bind — для чего они нужны?

Accepted Answer

Методы call и apply позволяют вызвать функцию с заданным значением this, но call передаёт аргументы через запятую, а apply — в виде массива. Метод bind возвращает новую функцию с фиксированным значением this, которая может быть вызвана позже. Эти методы полезны для контроля контекста выполнения функции, особенно при работе с методами объектов.

Question 7

Расскажите про this и контекст?

Accepted Answer

В JavaScript this — это ссылка на текущий контекст выполнения, который зависит от того, как вызвана функция. В методах объектов this ссылается на сам объект, а в обычных функциях — на глобальный объект или undefined в строгом режиме. Значение this может быть явно изменено с помощью методов call, apply и bind.

Question 8

Есть ли у стрелочной функции методы call, apply и bind?

Accepted Answer

Стрелочные функции могут использовать методы call, apply и bind, но эти методы не изменяют контекст this внутри стрелочной функции. В отличие от обычных функций, стрелочные функции наследуют значение this из своей внешней области видимости (лексический контекст), и методы call, apply и bind не могут его изменить.

Question 9

Для чего и как работает this в методах объекта?

Accepted Answer

В методах объекта this указывает на сам объект, к которому принадлежит метод. Это позволяет методам объекта работать с его свойствами и другими методами. Значение this может изменяться в зависимости от того, как вызван метод, поэтому важно понимать контекст вызова.

Question 10

Что такое стрелочные функции и чем они отличаются от обычных функций?

Accepted Answer

Стрелочные функции — это сокращенная запись функций, которая не имеет своего контекста this. Они чаще всего используются для упрощения синтаксиса и не поддерживают некоторые особенности обычных функций, например, arguments и this. Эти функции удобны для написания короткого кода, но их нельзя использовать в ситуациях, где важен контекст.

Вопросы React Frontend Developer