JavaScript Academy · Leçon

Définir des points d’arrêt

Mettez l’exécution en pause et inspectez l’état.

Définir des points d’arrêt est une leçon JavaScript Academy gratuite sur CoddyKit. Ceci est la leçon 2 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage JavaScript Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours JavaScript Academy comprend 4 leçons au total.

Qu’est-ce qu’un point d’arrêt

Un point d’arrêt indique au débogueur de suspendre l’exécution à une ligne précise. Pendant la pause, vous pouvez examiner les variables et la pile d’appels pour comprendre l’état du programme.

Pourquoi les points d’arrêt sont préférables à la journalisation

Contrairement à la dispersion d’instructions de journalisation, les points d’arrêt vous permettent d’examiner chaque variable dans la portée à un instant donné sans modifier le code, puis de reprendre ou d’avancer pas à pas.

Ouvrir le panneau des sources

Dans les DevTools du navigateur, les points d’arrêt se trouvent dans le panneau des sources. Ouvrez les DevTools, passez aux sources et trouvez votre fichier de script dans l’arborescence des fichiers.

Définir un point d’arrêt sur une ligne

Cliquez dans la marge des numéros de ligne, à côté d’une instruction, pour y définir un point d’arrêt. Un marqueur apparaît et l’exécution s’interrompt lorsque cette ligne est sur le point d’être exécutée.

L’instruction debugger

Ajouter une instruction debugger dans votre code déclenche un point d’arrêt par programmation lorsque les DevTools sont ouverts. Supprimez-la avant de distribuer le code de production.

function compute(x) {
  const doubled = x * 2
  // a debugger statement on the next line would pause execution here
  return doubled + 1
}

Points d’arrêt conditionnels

Un clic droit sur une ligne vous permet d’ajouter une condition. Le débogueur s’interrompt uniquement lorsque l’expression est vraie, ce qui est particulièrement utile dans les boucles.

Points de journalisation

Un point de journalisation affiche un message sans interrompre l’exécution, comme une instruction temporaire de journalisation ajoutée depuis les DevTools plutôt que par une modification du code source.

Examiner les variables

Lors de la pause, le volet Portée répertorie les variables locales, de fermeture et globales avec leurs valeurs actuelles, afin que vous puissiez vérifier vos hypothèses.

Expressions surveillées

Le volet Surveillance évalue les expressions que vous définissez à chaque pause, ce qui vous permet de suivre une valeur calculée à mesure que vous avancez dans le code.

Points d’arrêt sur les événements

Les DevTools peuvent également interrompre l’exécution sur des événements, comme un clic ou une requête réseau, en suspendant l’exécution dès que l’événement se produit.

Gérer les points d’arrêt

Le volet des points d’arrêt répertorie tous vos points d’arrêt. Vous pouvez les désactiver temporairement à l’aide d’une case à cocher ou les supprimer lorsque vous avez terminé le débogage.

Vérification rapide

Vérifiez vos connaissances des points d’arrêt.

Récapitulatif

Récapitulatif : Les points d’arrêt suspendent l’exécution pour permettre une inspection.

Définissez-les dans la marge du panneau des sources
L’instruction debugger interrompt l’exécution par programmation
Les points d’arrêt conditionnels interrompent l’exécution uniquement lorsque la condition est vraie
Examinez la portée et les expressions surveillées pendant la pause

Questions Fréquemment Posées

La leçon « Définir des points d’arrêt » est-elle gratuite ?

Oui — le texte complet de « Définir des points d’arrêt » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours JavaScript Academy, passe à CoddyKit PRO. Le cours JavaScript Academy comprend 4 leçons au total.

Qu'est-ce que j'apprendrai dans « Définir des points d’arrêt » ?

Mettez l’exécution en pause et inspectez l’état. Tu pratiques JavaScript Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.

Dois-je avoir de l'expérience pour commencer JavaScript Academy ?

Aucune expérience préalable n'est requise. JavaScript Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 2 sur 4.

Combien de temps prend la leçon « Définir des points d’arrêt » ?

La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.

Peux-tu écrire et exécuter du code dans cette leçon JavaScript Academy ?

Oui. Chaque leçon JavaScript Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.

Toutes les leçons de ce cours

← Retour à JavaScript Academy