WorksheetsQuizz React
Total questions: 30
Worksheet time: 15mins
Que sera affiché dans la console lorsque ce composant est monté ?
'Render' puis 'Effect runs'
'Effect runs' puis 'Render'
'Render' seulement
'Effect runs' seulement
Après 2 clics sur le bouton, que sera affiché ?
2
4
6
8
Combien de fois "Component Rendered" sera-t-il affiché dans la console ?
1 fois
2 fois
3 fois
Infini (boucle infinie)
Que sera affiché après le clic sur le bouton ?
A, B
A, B, C
A, B, C, C (à chaque clic)
Rien ne change (le composant ne se re-rend pas)
Quel est le résultat dans la console après 2 secondes ?
0
1
2
La valeur actuelle de count (environ 2)
Que sera affiché après 5 clics rapides sur le bouton ?
0, 1, 2, 3, 4
5, 5, 5, 5, 5
1, 2, 3, 4, 5
0, 0, 0, 0, 0
Que sera affiché dans la console ?
"Parent renders" et "Child renders" à chaque clic
Seulement "Parent renders" à chaque clic
"Parent renders" une fois, "Child renders" une fois
"Parent renders" à chaque clic, "Child renders" une fois
Quelle est la valeur finale de count affichée ?
0
1
2
3
Combien de rendus seront effectués ?
1
2
3
4
Quel est le comportement de ce formulaire ?
L'utilisateur peut saisir du texte en minuscules
Toutes les saisies sont automatiquement converties en majuscules
Le champ ne peut pas être modifié
Seules les lettres majuscules sont acceptées
Que sera affiché dans la console ?
1, 2, 3... à chaque clic (sans "Render")
"Render" puis 1, "Render" puis 2...
1, 2, 3... et "Render" une seule fois
1, 2, 3... et "Render" à chaque clic
Quel est le résultat final de total ?
0
10
Une erreur
undefined
Que signifie JSX ?
JavaScript XML
Java Syntax Extension
JavaScript Extension
JSON XML
Comment intégrer une expression JavaScript dans JSX ?
{expression}
{{expression}}
`(expression)`
/* expression */
Que sont les « props » dans React ?
L’état interne d’un composant
Les méthodes d’un composant
Des données en lecture seule passées à un composant
Les méthodes de cycle de vie
Quel hook est utilisé pour gérer l’état dans un composant fonctionnel ?
useEffect
useState
useContext
useReducer
Quand un composant se re-rend-il ?
Quand son état change
Quand ses props changent
À la fois A et B
Seulement quand le parent se re-rend
À quoi sert useEffect ?
Mettre à jour l’état
Exécuter des effets de bord dans les composants fonctionnels
Créer des références
Mémoriser des valeurs
Comment effectuer un rendu conditionnel en JSX ?
Utiliser if/else dans JSX
Utiliser des opérateurs ternaires ou &&
Utiliser switch dans JSX
Utiliser des directives #if
À quoi sert une « key » dans les listes ?
Pour styliser les éléments de la liste
Pour identifier de manière unique les éléments d’une liste
Pour définir l’ordre des éléments
Pour déclencher des re-rendus
Quelle méthode est appelée après le premier rendu d’un composant ?
componentWillMount
componentDidMount
componentWillUpdate
render
Comment passer des données d’un composant enfant à un composant parent ?
En utilisant l’état
En utilisant les props
En utilisant des fonctions de rappel passées via les props
En utilisant les refs
Quel est le comportement par défaut de la soumission d’un formulaire dans React ?
Il empêche le rechargement de la page par défaut
Il recharge la page
Il appelle automatiquement event.preventDefault()
Il ne fait rien
Que retourne useRef ?
Un objet de référence mutable
Une variable d’état
Une fonction de nettoyage
Un élément DOM directement
Quel est le but de `React.Fragment` ?
Encapsuler plusieurs éléments sans ajouter de nœuds DOM supplémentaires
Créer des fragments de code réutilisables
Diviser les composants en plus petits morceaux
Améliorer les performances
Comment mettre à jour l'état en se basant sur l'état précédent ?
`setState(nouvelleValeur)`
`setState(prev => nouvelleValeur)`
Modifier directement l'état
Utiliser `this.state = nouvelleValeur`
Qu'est-ce que la prop `children` ?
Une prop qui contient les éléments enfants du composant
Une prop pour lister les composants enfants
Une méthode pour rendre les enfants
Une méthode de cycle de vie
Quel hook remplace `componentDidMount`, `componentDidUpdate` et `componentWillUnmount` ?
`useState`
`useEffect`
`useContext`
`useMemo`
Qu'est-ce qu'un "composant contrôlé" ?
Un composant avec son propre état
Un composant dont la valeur est pilotée par l'état React
Un composant qui ne peut pas être mis à jour
Un composant enveloppé par un composant d'ordre supérieur
À quoi sert `useCallback` ?
Mémoriser une fonction
Mémoriser une valeur
Gérer les effets de bord
Créer un rappel vers un parent
