Maison  >  Article  >  interface Web  >  (Collection) Introduction aux questions d'entretien courantes dans React

(Collection) Introduction aux questions d'entretien courantes dans React

不言
不言avant
2018-10-22 17:35:021810parcourir

Le contenu de cet article est une introduction aux (collections de) questions d'entretien courantes dans React. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il vous sera utile.

Ce qui suit est une liste de questions d'entretien couramment utilisées sur React :

Que vous soyez un intervieweur ou un recruteur, vous pouvez vous référer aux questions suivantes

Assurez-vous de mettre en signet

Comment fonctionne React

React créera un DOM virtuel (virtual DOM). Lorsque l'état d'un composant change, React marquera d'abord les changements dans le DOM virtuel via l'algorithme de « différence ». La deuxième étape est la réconciliation, et le DOM sera mis à jour avec les résultats de la différence.

Quels sont les avantages de l'utilisation de React

Vous pouvez facilement savoir comment un composant est rendu en regardant simplement la fonction de rendu

L'introduction de JSX crée des composants Le code est plus lisible et il est plus facile de comprendre la disposition des composants ou la façon dont les composants se réfèrent les uns aux autres

Prend en charge le rendu côté serveur, ce qui peut améliorer le référencement et les performances

Facile à tester

React se concentre uniquement sur la couche View, il peut donc être utilisé avec n'importe quel autre framework (tel que Backbone.js, Angular.js)

Composant présentation et composant conteneur Quel est le différence entre

Les composants de présentation se soucient de l'apparence du composant. Display accepte spécifiquement les données et les rappels via des accessoires et n'a presque jamais son propre état, mais lorsque le composant d'affichage a son propre état, il ne se soucie généralement que de l'état de l'interface utilisateur plutôt que de l'état des données.

Les composants du conteneur concernent davantage leur fonctionnement. Les composants conteneur fournissent des données et un comportement au composant de présentation ou à d'autres composants de conteneur. Ils appellent Flux actions et le fournissent comme rappel au composant de présentation. Les composants du conteneur sont souvent avec état car ils sont des sources de données (pour d'autres composants).

Quelle est la différence entre un composant de classe et un composant fonctionnel ?

Les composants de classe vous permettent non seulement d'utiliser davantage de fonctions supplémentaires, telles que le composant lui-même, des hooks d'état et de cycle de vie. permettre également aux composants d'accéder directement au magasin et de maintenir l'état

Lorsqu'un composant reçoit uniquement des accessoires et restitue le composant lui-même sur la page, le composant est un « composant sans état », un tel composant peut être créé à l'aide d'un fonction pure. De tels composants sont également appelés composants stupides ou composants d'affichage

Quelle est la différence entre l'état (du composant) et les propriétés (accessoires)

État Est-ce une structure de données utilisée pour la valeur par défaut de les données nécessaires au montage du composant. L'état peut muter au fil du temps, mais le plus souvent en raison du comportement des événements de l'utilisateur.

Props (abréviation de propriétés) est la configuration du composant. Les accessoires sont transmis des composants parents aux composants enfants, et en ce qui concerne les composants enfants, les accessoires sont immuables. Un composant ne peut pas modifier ses propres accessoires, mais il peut assembler les accessoires de ses sous-composants (gestion unifiée). Les accessoires ne sont pas non plus de simples données : les fonctions de rappel peuvent également être transmises via des accessoires.

Soulignez la différence dans les méthodes de cycle de vie (des composants)

componentWillMount -- principalement utilisé pour la configuration de l'application dans le composant racine

componentDidMount -- tout peut être fait ici Toutes les configurations qui ne peuvent pas être effectuées sans DOM et commencez à obtenir toutes les données dont vous avez besoin ; si vous avez besoin de configurer l'écoute d'événements, vous pouvez également la compléter ici

componentWillReceiveProps -- Cette fonction périodique agit sur l'état causée par des changements d'accessoires spécifiques. Transition

shouldComponentUpdate -- Si vous vous inquiétez du rendu excessif de votre composant, ShouldComponentUpdate est un endroit pour améliorer les performances car il empêche le composant de restituer s'il reçoit de nouveaux accessoires. ShouldComponentUpdate doit renvoyer une valeur booléenne pour déterminer si le composant doit être restitué

componentWillUpdate -- rarement utilisé. Il peut être utilisé pour remplacer les composants componentWillReceiveProps et ShouldComponentUpdate (mais ne peut pas accéder aux accessoires précédents)

componentDidUpdate -- souvent utilisé pour mettre à jour le DOM en réponse à des changements d'accessoires ou d'état

componentWillUnmount -- ici vous Vous pouvez annuler la demande de réseau, ou supprimer tous les écouteurs d'événements liés au composant

Où dans le composant React la requête Ajax doit-elle être effectuée

Dans le composant React, la requête réseau doit être effectuée dans componentDidMount ? Cette méthode sera exécutée lors du premier "montage" du composant (ajouté au DOM) et ne sera exécutée qu'une seule fois dans le cycle de vie du composant. Plus important encore, vous ne pouvez pas garantir qu'avant que le composant ne soit monté La requête Ajax est terminée. Si tel est le cas, cela signifie que vous essayez d'appeler setState sur un composant non monté, ce qui ne fonctionnera pas. Faire une requête réseau dans composantDidMount garantira qu'il existe un composant prêt à être mis à jour.

Qu'est-ce qu'un composant contrôlé ?

En HTML, les éléments de formulaire tels que ,