74 лучших вопросов и ответов на собеседовании по React JS

Вопросы и ответы на собеседовании по React

Вот вопросы и ответы ReactJ на собеседовании для новичков, а также для опытных кандидатов, желающих получить работу своей мечты.

1) Что такое Reactjs?

React — это библиотека JavaScript, которая упрощает создание пользовательских интерфейсов. Его разработал Facebook.

---

2) Использует ли React HTML?

Нет, он использует JSX, который похож на HTML.

Бесплатная загрузка в формате PDF: Вопросы и ответы для интервью по React

---

3) Когда был впервые выпущен React?

React был впервые выпущен в марте 2013 года.

---

4) Назовите мне два наиболее существенных недостатка React.

• Интеграция React с инфраструктурой MVC, такой как Rails, требует сложной настройки.
• React требует от пользователей знаний об интеграции пользовательского интерфейса в структуру MVC.

---

5) Укажите разницу между реальным DOM и виртуальным DOM.

Настоящий ДОМ	Виртуальный DOM
Обновляется медленно.	Он обновляется быстрее.
Это позволяет прямое обновление из HTML.	Его нельзя использовать для непосредственного обновления HTML.
Это тратит слишком много памяти.	Потребление памяти меньше

---

6) Что такое концепция Flux в React?

Facebook широко использует концепцию архитектуры Flux для разработки клиентских веб-приложений. Это не фреймворк или библиотека. Это просто новый тип архитектуры, дополняющий React и концепцию однонаправленного потока данных.

---

7) Определите термин Redux в React.

Redux — это библиотека, используемая для разработки интерфейса. Это контейнер состояний для приложений JavaScript, который следует использовать для управления состоянием приложений. Вы можете протестировать и запустить приложение, разработанное с помощью Redux, в разных средах.

---

8) Что такое функция «Магазин» в Redux?

В Redux есть функция «Магазин», которая позволяет вам сохранять все состояние приложения в одном месте. Поэтому состояние всех компонентов сохраняется в Магазине, поэтому вы будете получать регулярные обновления непосредственно из Магазина. Единое дерево состояний помогает отслеживать изменения с течением времени, а также отлаживать или проверять приложение.

---

9) Что такое действие в Redux?

Это функция, которая возвращает объект действия. Тип действия и данные действия всегда хранятся в объекте действия. Действия могут отправлять данные между Магазином и программным приложением. Вся информация, получаемая Магазином, создается в результате действий.

---

10) Назовите важные особенности React.

Вот важные особенности React.

• Позволяет использовать сторонние библиотеки.
• Сохранение времени
• Более быстрая разработка
• Простота и компонуемость
• Полностью поддерживается Facebook.
• Стабильность кода благодаря однонаправленной привязке данных
• Компоненты React

---

11) Объясните термин «компоненты без состояния».

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

---

12) Объясните React Router

React Router — это библиотека маршрутизации, которая позволяет добавлять новые потоки экрана в ваше приложение, а также синхронизирует URL-адрес с тем, что отображается на странице.

---

13) Какие пакеты анимации популярны в экосистеме React?

Популярный пакет анимации в экосистеме React:

• Реагировать на движение
• Реагировать на группу перехода

---

14) Что такое Джест?

Jest — это среда модульного тестирования JavaScript, созданная Facebook на основе Jasmine. Он предлагает автоматическое создание макетов и среду jsdom. Он также используется в качестве компонента тестирования.

---

15) Что такое диспетчер?

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

---

16) Что подразумевается под функцией обратного вызова? Какова его цель?

Функция обратного вызова должна вызываться после завершения работы setState и повторной визуализации компонента. Поскольку setState является асинхронным, поэтому он принимает вторую функцию обратного вызова.

---

17) Объясните термин «компонент высокого порядка».

Компонент более высокого порядка, также известный как HOC, представляет собой усовершенствованный метод повторного использования логики компонента. Это не часть React API, но они представляют собой шаблон, вытекающий из композиционной природы React.

---

18) Объясните сегмент презентации.

Презентационная часть — это сегмент, который позволяет отображать HTML. Емкость сегмента указана в наценке.

---

19) Что такое реквизиты в React JS?

Props — это свойства, то есть способ передачи данных от родительского элемента к дочернему. Можно сказать, что props — это всего лишь канал связи между компонентами. Он всегда передается от родительского элемента к дочернему.

---

20) Для чего используется ключевое слово super в React?

Ключевое слово super помогает вам получать доступ и вызывать функции родительского объекта.

---

21) Объясните крылатую фразу доходности в JavaScript

Ключевая фраза «Выход» используется для задержки и продолжить работа генератора, известная как доходность крылатой фразы.

---

22) Назовите два типа компонента React.

Два типа реагирующих компонентов:

• Функциональный компонент
• Компонент класса

---

23) Объясните синтетическое событие в React js.

Синтетическое событие — это тип объекта, который действует как кроссбраузерная обёртка вокруг нативного события браузера. Оно также помогает нам объединять поведение различных браузеров в API сигналов.

---

24) Что такое состояние реакции?

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

---

25) Как обновить состояние в React JS?

Состояние компонента можно обновить прямо или косвенно.

---

26) Объясните использование функции стрелки в React.

Стрелочная функция помогает предсказать поведение ошибок при передаче в качестве обратного вызова. Таким образом, это предотвращает ошибку, вызванную всем этим.

---

27) Каковы этапы жизненного цикла React?

Важными этапами жизненного цикла React js являются:

• Инициализация
• Обновления штата/объекта
• Разрушение — это жизненный цикл React

---

28) Назовите основную разницу между Плюсами и Государством.

Основное различие между ними заключается в том, что State изменяемо, а Pro неизменяемы.

---

29) Объясните чистые компоненты в React js.

Чистые компоненты — это самые быстрые компоненты, которые могут заменить любой компонент только с помощью render(). Это помогает вам повысить простоту кода и производительность приложения.

---

30) Какая информация управляет сегментом в React?

Существует в основном два вида информации, управляющей сегментом: состояние и реквизиты.

• Состояние: информация о состоянии, которая изменится, нам нужно использовать State.
• Реквизиты: Реквизиты задаются родительским элементом и рассчитываются на протяжении всего срока службы детали.

---

31) Что такое «создать-реагировать-приложение»?

«create-react-app» — это инструмент командной строки, который позволяет вам создать одно базовое приложение реагирования.

---

32) Объясните использование слова «ключ» в списке реагирования.

Ключи позволяют предоставить каждому элементу списка стабильную идентичность. Ключи должны быть уникальными.

---

33) Что такое детский реквизит?

Дочерние реквизиты используются для передачи компонента другим компонентам в качестве свойств. Вы можете получить к нему доступ, используя

{props.children}

---

34) Объясните границы ошибок?

Границы ошибок помогают обнаружить ошибку Javascript в любом месте дочерних компонентов. Они чаще всего используются для регистрации ошибок и отображения резервного пользовательского интерфейса.

---

35) Какая польза от пустых тегов <> ?

Пустые теги используются в React для объявления фрагментов.

---

36) Объясните строгий режим

StrictMode позволяет запускать проверки и предупреждения для реагирующих компонентов. Он работает только в разрабатываемой сборке. Это поможет вам выделить проблемы без отображения какого-либо видимого пользовательского интерфейса.

---

37) Что такое среагировавшие порталы?

Портал позволяет отображать дочерние элементы в узле DOM. Создать метод портала для этого используется.

---

38) Что такое контекст?

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

---

39) Какая польза от Webpack?

Webpack по сути является сборщиком модулей. В основном он запускается в процессе разработки.

---

40) Что такое Babel в React js?

Babel — это компилятор JavaScript, который преобразует новейшие версии JavaScript, такие как ES6, ES7, в старый добрый JavaScript ES5, понятный большинству браузеров.

---

41) Как браузер может прочитать файл JSX?

Если вы хотите, чтобы браузер читал JSX, этот файл JSX следует заменить с помощью преобразователя JSX, такого как Babel, а затем отправить обратно в браузер.

---

42) Каковы основные проблемы использования архитектуры MVC в React?

Вот основные проблемы, с которыми вы столкнетесь при работе с архитектурой MVC:

• Обработка DOM довольно дорогая
• Большую часть времени приложения работали медленно и неэффективно.
• Из-за циклических функций вокруг моделей и идей создана сложная модель.

---

43) Что можно сделать, если имеется более одной линии выражения?

В этот момент вам остается единственный вариант — многострочное выражение JSX.

---

44) В чем заключается сокращение?

Сокращение — это прикладной метод обработки состояния.

---

45) Объясните термин синтетические события.

На самом деле это кроссбраузерная оболочка собственного события браузера. Эти события имеют интерфейсы stopPropagation() и PreventDefault().

---

46) Когда следует использовать элементы высшего класса для функционального элемента?

Если ваш элемент проходит стадию или жизненный цикл, нам следует использовать элементы высшего класса.

---

47) Как можно поделиться элементом при разборе?

Используя State, мы можем делиться данными.

---

48) Объясните термин примирение

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

---

49) Как можно перерисовать компонент без использования функции setState()?

Вы можете использовать функцию ForceUpdate() для повторной отрисовки любого компонента.

---

50) Можете ли вы обновить реквизиты в реакции?

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

---

51) Объясните термин «Реструктуризация».

Реструктуризация – это процесс извлечения массив объекты. После завершения процесса вы можете выделить каждый объект в отдельную переменную.

---

52) Можете ли вы обновить значения реквизита?

Невозможно обновить значение реквизита, поскольку оно неизменяемо.

---

53) Объясните смысл монтажа и демонтажа.

• Процесс присоединения элемента к DCOM называется монтажом.
• Процесс отсоединения элемента от DCOM называется процессом размонтирования.

---

54) Для чего нужна библиотека prop-types?

Библиотека Prop-types позволяет выполнять проверку типов реквизитов и аналогичных объектов во время выполнения в недавнем приложении.

---

55) Объясните крючки реагирования

Хуки React позволяют использовать State и другие функции React без написания класса.

---

56) Что такое фрагменты?

Вы можете использовать ключевое слово фрагмента, чтобы сгруппировать список дочерних компонентов без использования каких-либо дополнительных узлов в DOM. Например :

render() {

return (
);
}

---

57) В чем основная разница между createElement и cloneElment?

• createElement используется в реакции для создания реагирующих элементов.
• cloneElement используется для клонирования элемента и передачи ему новых реквизитов.

---

58) Что такое контролируемые компоненты?

Управляемые компоненты — это компонент, который управляет элементами ввода.

---

59) Зачем нужно использовать реквизит.дети?

Этот props.children позволяет вам передавать компонент в качестве данных другим компонентам.

---

60) Перечислите некоторые методы в пакете реагирования.

Важными методами для пакетов реакции являются:

• оказывать()
• гидрат()
• создатьПортал()
• размонтироватьКомпонентАтNode()
• найтиDOMNode()

---

61) Как мы можем выполнить рендеринг на стороне сервера в React?

Мы можем использовать реакцию для рендеринга на стороне сервера.

---

62) Укажите разницу между getInitialState() и конструктором()?

Если вы хотите создать один компонент, расширив React. Component», конструктор поможет вам инициализировать состояние. Но если вы хотите создать, используя Reat.createClass. тогда вам следует использовать «genInitiaState».

---

63) Что такое рефы?

Ref — это атрибут элементов DOM. Основная цель ссылок — легко найти элементы DOM.

---

64) Что такое ComponentWillMount()

КомпонентWillMount() предназначен для выполнения вызовов API после запуска компонента и настройки значений в состояние. Чтобы выполнить вызов API, используйте HttpClient, например Axios, или мы можем использовать fetch() для запуска вызова AJAX.

---

65) Как отправить данные в магазин?

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

---

66) Как вы сможете выполнять больше действий с помощью Redux?

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

---

67) Как можно пролить редукторы?

Мы можем распределить спасательные операции в зависимости от действий при событии. Это действие следует разделить на отдельные модули.

---

68) Назовите любые пять предопределенных прототипов, используемых в React.

Наиболее важными прототипами, используемыми в React js, являются:

• номер
• string
• массив
• объект
• элемент

---

69) Какова цель использованияbindActionsCreators?

BindActionCreator помогает вам привязать событие на основе диспетчера действий к элементу HTML.

---

70) Что такое REFS в React

Ref — ссылка на элемент. В большинстве случаев этого следует избегать. Однако иногда он используется, когда вам нужно напрямую получить доступ к DOM или экземпляру компонента.

---

71) Можно ли прикрепить элемент JSX к другим компонентам JSX?

Да, вы можете использовать элемент Attach JSX с другими компонентами JSX, что очень похоже на вложение элементов HTML.

---

72) Какая текущая стабильная версия React?

Текущая стабильная версия React — версия 17.5.

---

73) Назовите важную особенность рабочего процесса Redux.

Важными особенностями рабочего процесса Redux являются:

• Сброс: помогает сбросить состояние магазина.
• Возврат: позволяет вернуться к последнему зафиксированному состоянию.
• Развертка: все действия по отключению, которые вы могли выполнить по ошибке, будут удалены.
• Commit: помогает сделать текущее состояние исходным.

---

74) Укажите разницу между React JS и React Native.

React JS — это интерфейсная библиотека JavaScript с открытым исходным кодом, используемая для создания пользовательских интерфейсов, а React Native — это мобильная платформа с открытым исходным кодом, которая позволяет разработчикам использовать React на таких платформах, как Android и iOS. Эти вопросы на собеседовании также помогут вам в устной речи.