Les bases du langage JavaScript reposent sur un ensemble de notions essentielles qui permettent de rendre les pages web dynamiques, interactives et intelligentes.
Que ce soit pour manipuler des données, réagir aux actions de l’utilisateur ou modifier le contenu d’une page en temps réel, ces concepts sont incontournables dans les études, les examens et les premiers projets professionnels.
Cette page d’entraînement vous plonge au cœur des mécanismes fondamentaux du JavaScript moderne : gestion des variables, tableaux, objets, fonctions, événements et logique conditionnelle.
Elle met également en lumière les outils indispensables pour comprendre le comportement du code et éviter les erreurs fréquentes.
L’objectif est de vous accompagner de manière progressive, avec une approche pédagogique claire, afin de développer des automatismes solides.
En maîtrisant ces bases, vous posez des fondations fiables pour évoluer vers des applications plus complexes et mieux structurées.
Les bases du langage JavaScript reposent sur un ensemble de notions essentielles qui permettent de rendre les pages web dynamiques, interactives et intelligentes.
Que ce soit pour manipuler des données, réagir aux actions de l’utilisateur ou modifier le contenu d’une page en temps réel, ces concepts sont incontournables dans les études, les examens et les premiers projets professionnels.
Cette page d’entraînement vous plonge au cœur des mécanismes fondamentaux du JavaScript moderne : gestion des variables, tableaux, objets, fonctions, événements et logique conditionnelle.
Elle met également en lumière les outils indispensables pour comprendre le comportement du code et éviter les erreurs fréquentes.
L’objectif est de vous accompagner de manière progressive, avec une approche pédagogique claire, afin de développer des automatismes solides.
En maîtrisant ces bases, vous posez des fondations fiables pour évoluer vers des applications plus complexes et mieux structurées.
QCM
1
Corrigé
Comment déclare-t-on une variable dont la valeur ne doit jamais être réassignée ?
A. let
B. var
C. const
D. static
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
'const' définit une constante dont la référence ne peut pas être modifiée après son initialisation.
QCM
2
Corrigé
Quel opérateur est utilisé pour vérifier l'égalité stricte (valeur et type) ?
A. ==
B. ===
C. =
D. equals
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
L'opérateur '===' compare le contenu et le type sans conversion implicite, contrairement au '=='.
QCM
3
Corrigé
Quelle est la sortie de : console.log(typeof [1, 2, 3]) ?
A. array
B. list
C. collection
D. object
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
En JavaScript, les tableaux sont techniquement des objets de type spécial.
QCM
4
Corrigé
Quelle méthode permet d'ajouter un élément à la fin d'un tableau ?
A. push()
B. pop()
C. shift()
D. unshift()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
La méthode 'push()' ajoute un ou plusieurs éléments à la fin du tableau.
QCM
5
Corrigé
Comment accède-t-on au premier élément d'un tableau nommé 'data' ?
A. data(0)
B. data.first()
C. data[1]
D. data[0]
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
L'indexation des tableaux commence à 0 en JavaScript.
QCM
6
Corrigé
Quelle méthode permet de sélectionner un élément HTML par son identifiant unique ?
A. document.getElementById()
B. document.querySelector()
C. document.getElementsByTagName()
D. document.getClass()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
'getElementById' est la méthode la plus rapide pour cibler un ID spécifique dans le DOM.
QCM
7
Corrigé
Quel événement se déclenche lorsqu'un utilisateur clique sur un bouton ?
A. onhover
B. submit
C. click
D. focus
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
L'événement 'click' capte les pressions de souris ou de doigts sur un élément.
QCM
8
Corrigé
Que signifie l'acronyme DOM ?
A. Document Object Model
B. Data Oriented Module
C. Digital Object Management
D. Dynamic Object Mode
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
Le DOM est l'interface de programmation représentant le document HTML sous forme d'arborescence.
QCM
9
Corrigé
Quelle est la syntaxe correcte d'une fonction fléchée ?
A. function => () {}
B. () => {}
C. arrow function() {}
D. callback: () {}
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
La syntaxe '() => {}' est un raccourci moderne pour définir des fonctions anonymes.
QCM
10
Corrigé
Comment modifier le contenu textuel d'un élément HTML ?
A. element.value
B. element.setText
C. element.textContent
D. element.style
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
La propriété 'textContent' permet de définir ou récupérer le texte brut d'un nœud.
QCM
11
Corrigé
Quel opérateur logique représente le 'OU' (OR) ?
A. &&
B. !
C. ??
D. ||
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
Les barres verticales '||' renvoient vrai si au moins l'une des conditions est vraie.
QCM
12
Corrigé
Dans un bloc 'switch', à quoi sert le mot-clé 'default' ?
A. À définir la valeur par défaut de la variable
B. À exécuter du code si aucun 'case' ne correspond
C. À arrêter l'exécution du script
D. À forcer la sortie de la boucle
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
Le bloc 'default' agit comme un 'else' final pour traiter les cas non prévus.
QCM
13
Corrigé
Quelle méthode transforme un objet JavaScript en chaîne de caractères JSON ?
A. JSON.stringify()
B. JSON.parse()
C. JSON.toObject()
D. JSON.convert()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
'stringify' linéarise un objet en texte, format idéal pour l'envoi de données.
QCM
14
Corrigé
Comment s'appelle une fonction définie à l'intérieur d'un objet ?
A. Une variable
B. Une boucle
C. Une méthode
D. Une classe
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
Une fonction rattachée à un objet est appelée une méthode de cet objet.
QCM
15
Corrigé
Quelle méthode permet de créer un nouvel élément HTML via JavaScript ?
A. document.new()
B. document.createElement()
C. document.addChild()
D. document.writeElement()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
'createElement' génère un nouvel élément en mémoire qu'il faudra ensuite injecter dans le DOM.
QCM
16
Corrigé
Quel mot-clé est utilisé pour gérer les erreurs dans un bloc de code ?
A. error
B. fail
C. catch
D. break
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
Le bloc 'catch' intercepte les exceptions lancées dans le bloc 'try'.
QCM
17
Corrigé
Quelle méthode retourne un nouveau tableau avec les éléments filtrés selon une condition ?
A. filter()
B. map()
C. forEach()
D. find()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
'filter' crée un sous-ensemble du tableau original basé sur un test booléen.
QCM
18
Corrigé
Quelle instruction permet de sortir immédiatement d'une boucle 'for' ?
A. stop
B. exit
C. continue
D. break
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
'break' interrompt brutalement l'exécution de la boucle en cours.
QCM
19
Corrigé
Quel est le résultat de : "5" + 2 ?
A. 7
B. 52
C. NaN
D. undefined
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
L'opérateur '+' effectue une concaténation dès qu'un des opérandes est une chaîne de caractères.
QCM
20
Corrigé
Comment appelle-t-on une fonction passée en argument à une autre fonction ?
A. Une promesse
B. Un callback
C. Une méthode
D. Un itérateur
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
Un callback est une fonction 'rappelée' ultérieurement par une autre fonction.
QCM
21
Corrigé
Quelle est la valeur de vérité de l'expression : (true && false) ?
A. false
B. true
C. undefined
D. null
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
Avec '&&' (ET), les deux opérandes doivent être vrais pour que le résultat soit vrai.
QCM
22
Corrigé
Comment peut-on arrêter la propagation d'un événement dans le DOM ?
A. event.preventDefault()
B. event.stopPropagation()
C. event.stop()
D. event.cancel()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
'stopPropagation()' empêche l'événement de remonter (bubbling) vers les éléments parents.
QCM
23
Corrigé
Quel mot-clé est utilisé pour attendre la résolution d'une promesse ?
A. wait
B. delay
C. await
D. pause
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
'await' suspend l'exécution d'une fonction async jusqu'à ce que la promesse soit tenue.
QCM
24
Corrigé
Quelle méthode de tableau est utilisée pour transformer chaque élément en une nouvelle valeur ?
A. reduce()
B. filter()
C. sort()
D. map()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
'map' produit un nouveau tableau de même taille avec les valeurs transformées.
QCM
25
Corrigé
Quel objet global permet d'afficher des messages dans la console de debug ?
A. window
B. console
C. system
D. debug
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
L'objet 'console' fournit des méthodes comme log, error et warn.
QCM
26
Corrigé
Que retourne : Boolean("") ?
A. false
B. true
C. undefined
D. NaN
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
A
Justification :
Une chaîne de caractères vide est considérée comme une valeur 'falsy' en JavaScript.
QCM
27
Corrigé
Comment ajouter un écouteur d'événement à un élément sans écraser les précédents ?
A. element.onclick = function
B. element.listen()
C. element.addEventListener()
D. element.attach()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
'addEventListener' est la méthode standard pour cumuler plusieurs écouteurs sur un même événement.
QCM
28
Corrigé
Quelle propriété d'un objet 'event' cible l'élément précis qui a déclenché l'action ?
A. event.origin
B. event.source
C. event.target
D. event.sender
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
C
Justification :
'.target' contient la référence de l'élément DOM à l'origine du déclenchement.
QCM
29
Corrigé
Comment transformer la chaîne '123' en nombre entier ?
A. Integer.parse('123')
B. parseInt('123')
C. Number.toInt('123')
D. cast('123')
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
B
Justification :
'parseInt' analyse une chaîne et retourne un entier dans la base spécifiée.
QCM
30
Corrigé
Quelle méthode permet de retirer le dernier élément d'un tableau ?
A. shift()
B. slice()
C. splice()
D. pop()
Afficher la réponse
Cliquez pour voir la correction
Réponse correcte :
D
Justification :
La méthode 'pop()' retire le dernier élément et modifie la longueur du tableau.
Mots & Définitions
Consultez les définitions des termes importants.
const est un mot-clé utilisé pour déclarer une variable dont la référence ne peut pas être réassignée. Il garantit une meilleure sécurité du code en évitant les modifications involontaires. Cela n’empêche pas la modification du contenu d’un objet ou d’un tableau.
L’égalité stricte compare à la fois la valeur et le type de deux éléments. Elle évite les conversions automatiques qui peuvent provoquer des erreurs logiques. Son usage est fortement recommandé pour des tests fiables.
typeof est un opérateur qui permet d’identifier le type d’une valeur ou d’une variable. Il est utile pour comprendre le comportement d’une donnée lors de l’exécution. Certains résultats nécessitent toutefois une interprétation attentive.
Un tableau est une structure de données permettant de stocker plusieurs valeurs ordonnées. Chaque élément est accessible par un index numérique. Les tableaux sont essentiels pour manipuler des listes de données.
push() est une méthode qui ajoute un élément à la fin d’un tableau. Elle modifie directement le tableau existant. Cette méthode est couramment utilisée pour enrichir une liste.
Le DOM représente la structure de la page web sous forme d’objets manipulables en JavaScript. Il permet d’accéder, modifier et réagir aux éléments HTML. C’est le lien principal entre JavaScript et l’interface utilisateur.
Un événement correspond à une action déclenchée par l’utilisateur ou le navigateur. Il permet de rendre une page interactive en réagissant aux actions. Les événements sont fondamentaux dans les interfaces dynamiques.
La fonction fléchée est une syntaxe moderne et concise pour définir une fonction. Elle simplifie l’écriture du code et gère différemment le contexte. Elle est très utilisée dans le JavaScript moderne.
textContent permet de modifier ou lire le texte d’un élément HTML sans interpréter les balises. Il garantit un affichage sûr du contenu textuel. Cette propriété est souvent préférée pour éviter les injections.
L’opérateur OR permet de vérifier si au moins une condition est vraie. Il est utilisé dans les tests logiques pour élargir les cas de validation. Il joue un rôle central dans les structures conditionnelles.
JSON est un format texte utilisé pour représenter et échanger des données structurées. Il est largement employé dans les communications web. Sa syntaxe est simple et proche des objets JavaScript.
Une méthode est une fonction associée à un objet. Elle définit les actions que l’objet peut effectuer. Les méthodes facilitent une organisation logique du code.
Un callback est une fonction passée en argument à une autre fonction. Il permet d’exécuter du code après une opération spécifique. Ce mécanisme est très courant en programmation asynchrone.
Les promesses permettent de gérer des opérations asynchrones de manière structurée. await simplifie leur utilisation en rendant le code plus lisible. Ensemble, ils facilitent la gestion des tâches différées.
addEventListener permet d’attacher un événement à un élément sans supprimer les précédents. Il offre une gestion propre et flexible des interactions. Cette méthode est la plus recommandée pour gérer les événements.
À propos de ce QCM
Les thèmes abordés dans cette série de QCM couvrent le socle indispensable de tout développeur JavaScript.
La gestion des variables constitue un premier pilier : comprendre la différence entre les mots-clés de déclaration, le typage dynamique et les conversions implicites permet d’éviter de nombreux pièges logiques.
Les opérateurs de comparaison et les opérateurs logiques jouent également un rôle central dans l’écriture de conditions fiables, capables de refléter correctement les intentions du programmeur.
Les tableaux occupent une place importante dans la manipulation des données.
Ils permettent de stocker, ajouter, supprimer et transformer des ensembles de valeurs grâce à des méthodes adaptées.
Savoir accéder à un élément précis, parcourir une liste ou produire un nouveau tableau à partir d’un existant fait partie des compétences attendues dans tout exercice ou projet JavaScript.
Les fonctions, quant à elles, structurent le code et favorisent sa réutilisation.
Les fonctions fléchées et les fonctions de rappel illustrent une écriture plus moderne et plus expressive, notamment dans les traitements asynchrones.
La manipulation du DOM constitue un autre axe majeur.
Elle permet de sélectionner des éléments HTML, de modifier leur contenu et de réagir aux événements utilisateurs comme les clics ou les saisies.
La bonne gestion des événements, ainsi que le contrôle de leur propagation, sont essentiels pour construire des interfaces fluides et prévisibles.
Enfin, les notions liées à l’asynchronisme, comme les promesses et l’utilisation d’un mot-clé permettant d’attendre leur résolution, sont devenues incontournables dans les applications web actuelles.
L’ensemble de ces concepts développe des compétences clés : compréhension du fonctionnement interne du langage, capacité à raisonner sur l’exécution du code, et autonomie dans la résolution de problèmes concrets.
Cette approche renforce la préparation aux examens tout en apportant une réelle valeur pratique.
Conclusion
Ces QCM offrent un entraînement complet pour consolider les bases essentielles du JavaScript moderne.
En travaillant régulièrement les variables, les tableaux, les fonctions, les événements et la logique du langage, vous améliorez votre capacité à écrire un code clair, fiable et maintenable.
Cette progression permet de mieux comprendre les erreurs, d’anticiper les comportements inattendus et de gagner en confiance.
Pour tirer le meilleur parti de cet apprentissage, il est conseillé de compléter ces exercices par de petites expérimentations pratiques.
Avec de la régularité, ces notions deviennent naturelles et constituent un socle solide pour aborder des projets web plus avancés et plus ambitieux.
