Questions d’entretien JavaScript : les 25 qu’on vous posera (et les réponses qui convainquent)

JavaScript est le langage le plus demandé sur le marché du travail dev en France en 2026. Ce qui veut dire que les entretiens JS sont aussi les plus compétitifs. Ces 25 questions couvrent ce qui est réellement posé dans les entretiens pour des postes junior React, Vue, ou Node.js — pas les casse-têtes algorithmiques de Google, les vraies questions du marché français.

Les fondamentaux du langage

1. Différence entre `var`, `let` et `const`

var : portée fonctionnelle, hoisting, peut être redéclarée. let : portée de bloc, pas de redéclaration, hoisting sans initialisation (TDZ). const : même portée que let, la liaison ne peut pas être réassignée (mais l’objet/tableau pointé reste mutable). En pratique : toujours const par défaut, let si la variable doit changer, jamais var.

2. C’est quoi le hoisting ?

JavaScript « remonte » les déclarations de variables et fonctions en haut de leur portée avant l’exécution. Les fonctions déclarées avec function foo() sont entièrement hoistées (utilisables avant la déclaration). Les var sont hoistées mais pas initialisées (undefined). Les let/const sont dans une zone morte temporelle (TDZ) avant leur déclaration.

3. Expliquez le closure

Une fonction qui « capture » les variables de son scope parent, même après que ce scope soit terminé. Exemple classique : un compteur avec une variable privée. Les closures sont à la base des modules, des callbacks, et des hooks React.

function makeCounter() {
  let count = 0;
  return () => ++count; // closure sur `count`
}
const counter = makeCounter();
counter(); // 1
counter(); // 2

4. Comment fonctionne `this` en JavaScript ?

La valeur de this dépend du contexte d’appel, pas de la définition. Dans une méthode d’objet : l’objet. Dans une fonction normale : l’objet global (ou undefined en mode strict). Dans une arrow function : le this du scope parent (lexical). Avec new : le nouvel objet.

5. Différence entre `==` et `===`

== compare avec coercition de type ("5" == 5 est true). === compare sans coercition — valeur ET type. Utilisez toujours === sauf raison spécifique.

6. C’est quoi le prototype en JavaScript ?

JavaScript utilise l’héritage prototypal. Chaque objet a un lien vers un prototype. Quand vous accédez à une propriété, JS remonte la chaîne de prototypes si elle n’est pas trouvée sur l’objet. Les classes ES6 sont du sucre syntaxique sur ce mécanisme.

Asynchrone — souvent mal maîtrisé

7. Expliquez l’event loop

JavaScript est single-threadé. L’event loop permet d’exécuter du code asynchrone sans bloquer. La call stack exécute le code synchrone. Les callbacks asynchrones (timers, I/O, promesses) sont mis en file d’attente et exécutés quand la stack est vide. Les microtasks (promesses) ont priorité sur les macrotasks (setTimeout).

8. Promise vs async/await

Les deux gèrent l’asynchrone. async/await est du sucre syntaxique sur les Promises — plus lisible, surtout pour les chaînes. await ne peut s’utiliser que dans une fonction async. La gestion d’erreur : .catch() pour les Promises, try/catch pour async/await.

9. C’est quoi `Promise.all()` et quand l’utiliser ?

Exécute plusieurs promesses en parallèle et attend qu’elles se terminent toutes. Utile quand vous avez plusieurs appels API indépendants. Si une échoue, tout échoue. Pour la tolérance aux erreurs : Promise.allSettled().

10. Différence entre `setTimeout(fn, 0)` et une Promise ?

setTimeout(fn, 0) est une macrotask — elle s’exécute après que toutes les microtasks (promesses) de la même itération de l’event loop soient terminées. Les promesses résolues sont des microtasks — elles ont priorité.

React — questions fréquentes

11. C’est quoi le Virtual DOM ?

Une représentation JavaScript légère du DOM réel. React compare (diffing) le Virtual DOM avant et après un changement d’état, calcule le diff minimal, puis met à jour uniquement les parties du DOM réel qui ont changé. Plus performant que de tout re-rendre.

12. Différence entre composant contrôlé et non contrôlé ?

Contrôlé : la valeur du champ est dans le state React et mise à jour via onChange. Source de vérité : React. Non contrôlé : la valeur est dans le DOM, accessible via une ref. Les composants contrôlés sont recommandés pour les formulaires complexes.

13. Expliquez `useEffect` et ses dépendances

S’exécute après le rendu. Le tableau de dépendances contrôle quand il se relance : vide [] = une seule fois au montage, [value] = à chaque changement de value, absent = après chaque rendu. Le retour optionnel est une fonction de cleanup (clearInterval, abortController…).

14. C’est quoi `useMemo` et `useCallback` ?

Optimisations de performance. useMemo mémoïse une valeur calculée. useCallback mémoïse une fonction. Utiles pour éviter des re-renders inutiles en passant des props stables à des composants enfants. À ne pas utiliser par défaut — seulement si vous mesurez un problème de performance.

15. Comment gérez-vous l’état global ?

Context API pour les états simples partagés entre composants éloignés. Zustand ou Redux pour les états complexes avec beaucoup de mises à jour. La question teste si vous connaissez les compromis : Context re-rend tous les consommateurs, d’où l’intérêt d’un store dédié pour les états fréquemment mutés.

Questions pratiques sur le code

16. Comment éviter les mutations directes sur un array/objet en React ?

Ne jamais muter le state directement. Toujours créer une nouvelle référence : spread operator ([...arr, newItem]), map(), filter(), Object.assign() ou spread d’objet. React compare les références pour détecter les changements.

17. Qu’est-ce que le debouncing et le throttling ?

Techniques pour limiter la fréquence d’exécution d’une fonction. Debounce : attend que l’utilisateur arrête de taper avant d’appeler (recherche en temps réel). Throttle : appelle au maximum une fois toutes les N ms (scroll handlers, resize).

18. Différence entre `null`, `undefined` et `NaN` ?

undefined : variable déclarée mais non assignée, paramètre non fourni. null : valeur intentionnellement vide, assignée explicitement. NaN : résultat d’une opération mathématique invalide ("abc" * 2). typeof NaN === "number" — l’une des bizarreries JS à connaître.

19. Comment fonctionne le destructuring ?

Syntaxe ES6 pour extraire des valeurs d’objets ou tableaux. Omniprésent en React (const { name, age } = user, const [state, setState] = useState()). Supporte les valeurs par défaut et le renommage.

20. C’est quoi un module ES6 ?

import/export natifs au navigateur et à Node.js (ESM). Chaque fichier est un module avec sa propre portée. export default pour l’export principal, named exports pour les exports multiples. Différent des require()/module.exports CommonJS de l’ancien Node.js.

Questions bonus sur les performances et la sécurité

21. C’est quoi le XSS et comment s’en protéger en JS ?

Cross-Site Scripting : injection de code JavaScript malveillant dans une page. En React, le JSX échappe automatiquement les valeurs — ne jamais utiliser dangerouslySetInnerHTML avec des données utilisateur non sanitisées. Côté serveur : encoder les sorties HTML, Content Security Policy.

22. Comment optimiser les performances d’une app React ?

Identifier d’abord avec React DevTools Profiler. Puis : code splitting avec React.lazy(), mémoïsation ciblée avec useMemo/useCallback, virtualisation des longues listes, optimisation des images. Ne pas optimiser prématurément.

23. C’est quoi CORS ?

Cross-Origin Resource Sharing. Le navigateur bloque par défaut les requêtes vers un domaine différent de celui de la page. Le serveur doit envoyer les en-têtes CORS appropriés (Access-Control-Allow-Origin) pour autoriser ces requêtes. À configurer côté API, pas côté front.

24. Différence entre localStorage et sessionStorage ?

Tous deux stockent des données côté client en clé/valeur. localStorage : persistant jusqu’à suppression explicite. sessionStorage : effacé à la fermeture de l’onglet. Les deux sont limités à ~5MB, synchrones, et ne doivent jamais stocker de tokens sensibles sans protection.

25. TypeScript — pourquoi l’utiliser ?

TypeScript ajoute le typage statique à JavaScript. Avantages : détection d’erreurs à la compilation, meilleur autocomplete, refactoring plus sûr, documentation implicite via les types. En 2026, c’est devenu le standard dans la plupart des équipes front.

---

À lire aussi : Préparer l’entretien technique — Questions d’entretien PHP/Symfony — Portfolio GitHub : ce que les recruteurs regardent