wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Quiz React

Total questions: 54

Worksheet time: 2hrs 48mins

Name
Class
Date
1.

Qu'est-ce que React dans le contexte du développement web?

a)

Un type de base de données

b)

Un framework JavaScript pour développer des interfaces utilisateurs

c)

Un langage de programmation

d)

Un outil de gestion de projet

2.

Comment React détermine-t-il quels composants doivent être rafraîchis lors de la mise à jour de l'application?

a)

En utilisant une base de données externe

b)

En reprogrammant tous les composants

c)

En conservant une représentation interne (une arborescence) des éléments

d)

En demandant à l'utilisateur

3.

Quel est l'objectif principal de l'optimisation utilisée par React lors du rafraîchissement de l'écran?

a)

Augmenter le coût d'accès au DOM

b)

Limiter les accès coûteux au vrai DOM

c)

Ralentir l'application

d)

Améliorer les graphiques

4.

React Native est spécifiquement conçu pour quel type de plateformes?

a)

Web uniquement

b)

Android et iOS

c)

Navigateurs web

d)

Serveurs

5.

Quel est le rôle principal de la bibliothèque React?

a)

Gérer le DOM du navigateur

b)

Offrir une interface de programmation commune à toutes les plateformes

c)

Faire le rendu graphique des composantes React uniquement sur iOS

d)

Charger des bibliothèques spécifiques pour Android

6.

Quelle commande utilise-t-on pour créer une application React vide?

a)

npm start

b)

npm install react

c)

npx create-react-app app_react_vide

d)

npm update react

7.

Quelle commande est utilisée pour démarrer le serveur de développement après avoir créé l'application React?

a)

npm run build

b)

npm start

c)

npm install

d)

npm serve

8.

Quel fichier dans une application React contient le numéro de version spécifique de chaque dépendance installée par npm ?

a)

package.json

b)

README.md

c)

index.html

d)

App.js

9.

Quel répertoire contient tous les fichiers statiques transmis au navigateur dans une application React ?

a)

src

b)

public

c)

node_modules

d)

js

10.

Est-il possible de recréer le répertoire node_modules si celui-ci est supprimé ?

a)

Non, il n'est pas possible de le recréer.

b)

Oui, en utilisant la commande "npm start".

c)

Oui, en utilisant la commande "npm install".

d)

Non, cela nécessite une réinstallation complète de Node.js.

11.

Dans le contexte de React, que signifie le terme "DOM virtuel"?

a)

Une base de données utilisée par React.

b)

Un modèle en mémoire qui représente la structure de la page web.

c)

Un outil de développement pour déboguer les applications.

d)

Une nouvelle version de JavaScript utilisée par React.

12.

Qu'est-ce que JSX dans le contexte de React?

a)

Un langage de programmation complet

b)

Une extension de JavaScript

c)

Un compilateur de code

d)

Une bibliothèque pour le réseau

13.

Comment JSX traite-t-il les expressions JavaScript à l'intérieur du code?

a)

En les ignorant

b)

En les exécutant séparément

c)

En les encapsulant dans des accolades {}

d)

En les convertissant en chaînes de caractères

14.

Quelle est la principale raison d'utiliser JSX dans le développement avec React?

a)

Pour augmenter la performance de l'application

b)

Pour simplifier l'écriture du code et sa maintenance

c)

Pour intégrer des bases de données

d)

Pour améliorer la sécurité de l'application

15.

Quel attribut HTML est utilisé pour définir la source d'une image?

a)

src

b)

href

c)

type

d)

class

16.

Quelle commande est utilisée pour importer des feuilles de style dans le fichier App.css

a)

import './App.css';

b)

include './App.css';

c)

require './App.css';

d)

link './App.css';

17.

Dans un fichier HTML ordinaire, à quoi les sélecteurs de classes CSS sont-ils associés?

a)

Éléments HTML avec l'attribut id

b)

Éléments HTML avec l'attribut style

c)

Éléments HTML avec l'attribut class

d)

Éléments HTML sans attributs

18.

Quel attribut doit-on utiliser au lieu de 'class' dans une application React pour associer des styles CSS?

a)

className

b)

classList

c)

classStyle

d)

classType

19.

Quelle propriété CSS supprime les points des listes dans le style '.liste'?

a)

list-style: none;

b)

list-decoration: none;

c)

list-type: none;

d)

list-display: none;

20.

Qu'est-ce qu'une composante dans le contexte de l'interface utilisateur ?

a)

Un élément qui ne peut pas accepter de paramètres.

b)

Un élément qui encapsule des états, une logique et un style.

c)

Un simple fichier JavaScript sans logique.

d)

Une partie du document HTML.

21.

Comment une composante peut-elle être utilisée pour améliorer la maintenance du code?

a)

En augmentant la quantité de code nécessaire.

b)

En limitant la répétition du code.

c)

En compliquant la structure du code.

d)

En utilisant moins de JavaScript.

22.

Quel est le rôle des "props" dans une composante React?

a)

Ils servent à stocker des données temporaires.

b)

Ils permettent de passer des paramètres au moment de l'utilisation de la composante.

c)

Ils définissent le style CSS de la composante.

d)

Ils empêchent la composante de recevoir des paramètres.

23.

Que signifie l'expression "export default" dans le contexte des composantes React?

a)

Cela indique que la composante ne peut pas être réutilisée.

b)

Cela spécifie que la composante doit être utilisée sans JSX.

c)

Cela déclare que la composante est accessible en tant que module par défaut.

d)

Cela force la composante à utiliser un style spécifique.

24.

Comment peut-on améliorer la composante App pour bénéficier du fait que les données sont contenues dans un tableau?

a)

En ajoutant plus de styles CSS

b)

En utilisant une boucle pour générer les composantes Item

c)

En convertissant le tableau en objet

d)

En éliminant le tableau

25.

Quelle propriété est essentielle pour chaque élément d'une liste dans React pour maintenir une performance optimale lors des mises à jour?

a)

className

b)

id

c)

key

d)

src

26.

Dans React, que représente le paramètre 'children' lorsqu'il est passé à une composante?

a)

Une référence à la fonction parent

b)

Les éléments enfants que la composante parent doit afficher

c)

Une méthode pour passer des données aux composantes

d)

Un identifiant unique pour chaque composante enfant

27.

Comment la gestion des événements dans React est-elle décrite par rapport à HTML/JavaScript?

a)

Complètement différente

b)

Légèrement similaire

c)

Très similaire

d)

Pas mentionné

28.

Qu'est-ce qui est nécessaire pour installer une fonction de rappel sur un élément HTML/JSX dans React?

a)

Un attribut spécial sans valeur

b)

Un événement et un attribut avec valeur

c)

Un attribut avec une fonction de rappel comme valeur

d)

Aucune installation n'est nécessaire

29.

Vrai ou faux. Les variables locales déclenchent un rafraîchissement.

a)

Vrai

b)

Faux

30.

Les composantes d'état sont mises à jour quand?

a)

lors du rafraîchissement

b)

après le rafraîchissement

c)

avant le rafraîchissement

d)

toujours

31.

Vrai ou faux. Chaque instance d'une composante a ses propres variables d'état et elles sont privées

a)

Vrai

b)

Faux

32.

Les seules valeurs possibles pour Display sont:

a)

center

b)

flex

c)

column

d)

None

33.

Dans les flexbox, qu'est ce que l'attribut flex fait?

a)

Détermine la direction de l'axe principal

b)

Définit comment l’élément utilisera l’espace disponible selon l’axe principal

c)

Les items continuent sur la line ou la colonne suivante

d)

Défini l'agencement des éléments selon l'axe principal

34.

Dans les flexbox, qu'est ce que l'attribut flexDirection fait?

a)

Détermine la direction de l'axe principal

b)

Définit comment l’élément utilisera l’espace disponible selon l’axe principal

c)

Les items continuent sur la line ou la colonne suivante

d)

Défini l'agencement des éléments selon l'axe principal

35.

Dans les flexbox, qu'est ce que l'attribut flexWrap fait?

a)

Détermine la direction de l'axe principal

b)

Définit comment l’élément utilisera l’espace disponible selon l’axe principal

c)

Les items continuent sur la line ou la colonne suivante

d)

Défini l'agencement des éléments selon l'axe principal

36.

Dans les flexbox, qu'est ce que l'attribut justifyContent fait?

a)

Détermine la direction de l'axe principal

b)

Défini l'agencement selon l'axe transversal

c)

Les items continuent sur la line ou la colonne suivante

d)

Défini l'agencement des éléments selon l'axe principal

37.

Dans les flexbox, qu'est ce que l'attribut alignItem fait?

a)

Détermine la direction de l'axe principal

b)

Défini l'agencement selon l'axe transversal

c)

Les items continuent sur la line ou la colonne suivante

d)

Défini l'agencement des éléments selon l'axe principal

38.

Quel est l'attribut qui donne accès au tableau d'objet dans la composante FlatList?

(a)  

39.

Quel est l'attribut qui défini l'apparence des items dans la composante FlatList?

(a)  

40.

Quels sont les deux attributs qui permettent de rendre visible seulement une partie des objets dans la composante FlatList?

a)

initialToRender et maxToRenderPerBatch

b)

initialNumToRender et maxNumToRenderPerBatch

c)

initialNumToRender et maxToRenderPerBatch

d)

initialNumToRender et maxToRender

41.

Cette méthode permet de positionner un item de la liste identifié par son index sur l’écran au lieu d'utiliser FlatList.

a)

ScrollView

b)

useEffect

c)

scrollFromIndex

d)

scrollToIndex

42.

Vrai ou Faux. La modification d'un useRef déclenche un rafraîchissement?

a)

Vrai

b)

Faux

43.

Un [sélectionKey] à la fin d'un useEffect

a)

s'exécute 1 fois après le rafraîchissement initial

b)

s'exécute après le rafraîchissement

c)

s'exécute à chaque rafraîchissement

44.

Un [] à la fin d'un useEffect

a)

s'exécute 1 fois après le rafraîchissement initial

b)

s'exécute après le rafraîchissement

c)

s'exécute à chaque rafraîchissement

45.

Rien à la fin d'un useEffect

a)

s'exécute 1 fois après le rafraîchissement initial

b)

s'exécute après le rafraîchissement

c)

s'exécute à chaque rafraîchissement

46.

Une promise

a)

représente le résultat attendu d'un appel de fonction asynchrone

b)

permet d'obtenir un résultat

c)

représente le résultat attendu d'un appel de fonction synchrone

47.

Qu'est-ce qui permet d'obtenir le résultat d'une promise?

a)

fetch

b)

then

c)

GET

d)

than

48.

Quel attribut peut on mettre sur une composante <Navigator> pour forcer la route de départ?

a)

initialName

b)

name

c)

initialRouteName

d)

initialNameRoute

49.

<Screen name "Films" component={FilmScreens} options ={{ ______: "Films affichés"}}/>. Quel(s) est/sont l/les attribut(s) de options pour mettre un titre par défaut?

a)

title et headerTitle

b)

titre et headerTitre

c)

name et headerName

d)

title et titleHeader

50.

Quelle composante forme la pile de navigation?

a)

NavigationContainer

b)

Navigator

c)

Screen

d)

Navigation

51.

Dans le contexte de navigation, fetch est l'équivalent de quoi?

a)

GET

b)

POST

c)

then

52.

onPress_cb={()=> navigation.navigate('Film')} sert à quoi?

a)

reviens à l'écran précédent

b)

va sur 'film'

c)

affiche l'écran 'films' et l'ajoute à la pile

d)

reviens au premier écran de la pile

53.

À quoi sert la composante MapView?

a)

afficher un marqueur

b)

afficher la carte

c)

créer une carte

d)

mettre à jour la carte

54.

Avec quel attribut peut-on changer la couleur d'un <Polygone> et <Circle>

a)

stokeColor

b)

colorStroke

c)

strokeColor

d)

color