Questions d’entretiens React JS

juin 12, 2020juin 12, 2020 Thomas Aucun commentaire correction, corrigé, entretien, pdf, QCM, question, réponse, test recrutement, Test technique

Questions sur React JS avec des réponses pour la préparation des entretiens d’embauche, des tests en ligne, aux examens et aux certifications. Ces questions et réponses sur React JS comprennent divers sujets. Et sont tirés d’un vrai entretien écrit et certaines parties sont en direct. Cette méthode d’apprentissage systématique préparera facilement toute personne pour réussir son test sur React JS.

Préparez-vous avec cette liste de questions fréquemment posées sur « React JS » afin de pouvoir y répondre en toute confiance.

1. Qu’est-ce que React?

React est une bibliothèque JavaScript front-end développée par Facebook en 2011.
Il suit l’approche basée sur les composants qui aide à créer des composants UI réutilisables.
Il est utilisé pour développer une interface utilisateur Web et mobile complexe et interactive.
Même s’il n’était open source qu’en 2015, il a l’une des plus grandes communautés qui le soutiennent.

2. Quelles sont les fonctionnalités de React?

Les principales fonctionnalités de React sont listées ci-dessous:

Il utilise le DOM virtuel au lieu du vrai DOM.
Il utilise rendering côté serveur.
Il suit le flux de données unidirectionnel ou la liaison de données (ou data-binding en anglais).

3. Faites la différence entre le DOM réel et le DOM virtuel.

DOM réel	DOM virtuel
Il se met à jour lentement.	Il se met à jour plus rapidement.
Peut directement mettre à jour le HTML.	Impossible de mettre à jour directement le HTML.
Crée un nouveau DOM si l’élément est mis à jour.	Met à jour JSX si l’élément est mis à jour.
La manipulation DOM est très coûteuse.	La manipulation DOM est très facile.
Il y a un perte de mémoire.	Pas de perte de mémoire.

4. Énumérez certains des principaux avantages de React.

Certains des principaux avantages de React sont les suivants:

Il augmente les performances de l’application
Il peut être facilement utilisé côté client ainsi que côté serveur
Grâce à JSX, la lisibilité du code augmente
React est facile à intégrer avec d’autres frameworks comme Meteor, Angular, etc.
En utilisant React, l’écriture de test d’interface utilisateur devient extrêmement facile

5. Quelles sont les limitations de React?

Les limitations de React sont listées ci-dessous:

React est juste une bibliothèque, pas un framework complet
Sa bibliothèque est très grande et prend du temps à comprendre
Il peut être difficile pour les programmeurs débutants de le comprendre
Le codage devient complexe car il utilise les modèles en ligne et JSX

6. Qu’est-ce que JSX?

JSX signifie JavaScript XML. Il s’agit d’un type de fichier utilisé par React qui utilise l’expressivité de JavaScript avec HTML. Ce fichier rend les applications robustes et augmente ses performances. Voici un exemple de JSX:

render(){
    return(
		<div>
			<p>Welcome to WayToLearnX!</p>
		</div>
    );
}

7. Expliquez le fonctionnement du DOM virtuel.

DOM virtuel est un objet JavaScript léger qui n’est à l’origine qu’une copie du vrai DOM. Il s’agit d’une arborescence de nœuds qui répertorie les éléments, leurs attributs et leur contenu en tant qu’objets et leurs propriétés. La fonction render de React crée une arborescence de nœuds à partir des composants React. Il met ensuite à jour cet arbre en réponse aux mutations dans le modèle de données qui sont provoquées par diverses actions effectuées par l’utilisateur ou par le système.

Ce DOM virtuel fonctionne en trois étapes simples.
1. Chaque fois que des données changent, l’interface utilisateur entière est restituée en DOM virtuel.

2. Ensuite, la différence entre la représentation DOM précédente et la nouvelle est calculée.

3. Une fois les calculs effectués, le vrai DOM sera mis à jour avec uniquement les choses qui ont changé.

8. Pourquoi les navigateurs ne peuvent-ils pas lire JSX?

Les navigateurs peuvent uniquement lire les objets JavaScript mais JSX pas un objet JavaScript standard. Ainsi, pour permettre à un navigateur de lire JSX, nous devons d’abord transformer le fichier JSX en un objet JavaScript à l’aide de transformateurs JSX comme Babel, puis le transmettre au navigateur.

9. A quoi sert la commande create-react-app?

La commande create-react-app utilisée dans l’interface CLI (interface en ligne de commande) permettant à React de créer des applications sans configuration de build.

create-react-app myApp

10. Qu’est-ce que la méthode render() dans React? Et expliquer son but?

Chaque composant React doit obligatoirement avoir la méthode render(). Il renvoie un seul élément React qui est la représentation du composant DOM natif. Si plusieurs éléments HTML doivent être rendus, ils doivent être regroupés dans une balise englobante telle que <form>, <group>, <div> etc. Cette fonction doit être gardée pure, c’est-à-dire qu’elle doit retourner le même résultat chaque fois qu’il est invoqué.

11. Quelle est la différence entre React Native et React?

React est une bibliothèque JavaScript, prenant en charge à la fois le front-end et la back-end(s’exécutant sur le serveur), pour créer des interfaces utilisateur et des applications Web.

Tandis que, React Native est un framework mobile qui se compile en composants d’application natifs, nous permettant de créer des applications mobiles natives (iOS, Android et Windows) en JavaScript qui nous permet d’utiliser ReactJS pour construire nos composants et implémente ReactJS.

Avec React Native, il est possible d’imiter le comportement d’une application native en JavaScript et à la fin, nous obtiendrons un code spécifique à la plate-forme en sortie. Nous pouvons même mélanger le code natif avec le JavaScript si nous devons optimiser davantage notre application.

Voir aussi : Différence entre React.js et React Native

12. Qu’est-ce que Props?

Props est l’abréviation de Properties dans React. Ce sont des composants en lecture seule qui doivent être maintenus purs, c’est-à-dire immuables. Ils sont toujours transmis du composant parent aux composants enfants tout au long de l’application. Un composant enfant ne peut jamais renvoyer un Props au composant parent. Cela aide à maintenir le flux de données unidirectionnel et est généralement utilisé pour restituer les données générées dynamiquement.

13. A quoi sert l’objet State dans React et comment est-il utilisé?

Les States sont au cœur des composants de React. Les States sont la source des données et doivent être aussi simples que possible. Généralement, les States sont des objets qui déterminent le rendu et le comportement des composants. Ils sont mutables contrairement aux Props et créent des composants dynamiques et interactifs. Ils sont accessibles via this.state().

14. Que pouvez-vous faire avec HOC?

HOC peut être utilisé pour de nombreuses tâches comme:

Réutilisation de code, logique et abstraction de bootstrap
Abstraction et manipulation de State
Manipulation des Props
Render High jacking

15. Que sont les composants purs?

Les composants purs sont les composants les plus simples et les plus rapides qui peuvent être écrits. Ils peuvent remplacer n’importe quel composant qui n’a qu’une seule méthode render(). Ces composants améliorent la simplicité du code et les performances de l’application.

QCMs qui pourraient vous intéresser :