Débogage
Le débogage consiste à trouver pourquoi le programme fait la mauvaise chose. Cette page a une commande, { drink: "tea", size: "regular" }, et un mauvais nom de propriété. Le bug lit order.cup. Le journal cassé est tea / undefined. Après la correction, la ligne de la page est fixed / tea / regular.
Ce n'est pas la leçon des classes
La page précédente a construit Drink et SpecialDrink. Sa ligne était tea / regular / mint. Rien n'y était cassé exprès.
Ici les données sont déjà correctes. Le bug lit order.cup, alors que l'objet a size, pas cup. La vraie propriété est size.
Lire la valeur avant de réécrire la fonction
console.log affiche une valeur et n'arrête pas le script. console.warn marque un avertissement. console.error marque un échec. Aucun ne répare les données. Ils rendent seulement la mauvaise valeur visible.
Le nom de propriété est faux
label joint order.drink et order.cup. drink existe, donc le premier mot est tea. cup n'existe pas, donc le second mot est undefined.
const order = { drink: "tea", size: "regular" };
function label(order) {
return order.drink + " / " + order.cup;
}
console.log(label(order));
Le journal est tea / undefined. L'objet a toujours size. La fonction ne l'a jamais lu.
Marquer l'échec
Quand size manque, appelle console.error("missing size"). Ce fragment passe une commande sans taille pour que le chemin d'erreur s'exécute. console.error("missing size") ne lance pas d'exception.
function label(order) {
if (!order.size) {
console.error("missing size");
return order.drink + " / missing size";
}
return order.drink + " / " + order.size;
}
console.log(label({ drink: "tea" }));
La console montre l'erreur missing size, et le texte renvoyé est tea / missing size. Une commande vide de size renvoie tea / missing size. Une chaîne vide compte aussi comme absente, car !"" est vrai.
Pause volontaire
L'instruction debugger demande au navigateur de s'arrêter seulement quand les outils de développement sont ouverts. S'ils sont fermés, l'instruction ne fait rien et la ligne suivante s'exécute.
const order = { drink: "tea", size: "regular" };
debugger;
console.log(order.size);
Avec les outils ouverts, l'exécution s'arrête sur debugger et tu peux inspecter order. Avec les outils fermés, le journal suivant est regular. debugger n'est pas une erreur et ne change pas order.
La liste d'appels
Si label appelle format et que format lance, la console liste les deux noms. Commence en haut de la liste : c'est la ligne qui a échoué. Puis reviens à l'appelant. Le bug de cette page ne lance rien. undefined est une valeur, donc la liste reste silencieuse tant que tu ne la journalises pas.
Changer un seul nom
Remplace order.cup par order.size. N'ajoute pas une propriété cup seulement pour faire taire undefined. L'objet était déjà juste. La vraie propriété est size.
La ligne après la correction
La page lit size, le vérifie et écrit un court statut avant l'étiquette.
<!DOCTYPE html>
<html>
<body>
<p id="line">…</p>
<script>
const order = { drink: "tea", size: "regular" };
function label(order) {
if (!order.size) {
console.error("missing size");
return order.drink + " / missing size";
}
return order.drink + " / " + order.size;
}
document.getElementById("line").textContent = "fixed / " + label(order);
</script>
</body>
</html>
La ligne se lit fixed / tea / regular. Le mot fixed n'est qu'un statut. La boisson et la taille viennent de l'objet. tea / undefined était la fonction cassée.
Au comptoir
- Journalise
label(order)tant qu'elle litorder.cup. Le journal est tea / undefined. - Passe
{ drink: "tea" }et lis l'erreur. Le texte renvoyé est tea / missing size. - Laisse
debuggerdans le script. Outils fermés, le journal suivant reste regular. - Lis la ligne de la page : fixed / tea / regular.
Erreurs fréquentes
- Changer l'objet parce que le journal dit undefined
- Prendre
console.logpour une pause ;console.logn'arrête pas le script - Attendre que
debuggerarrête la page quand les outils sont fermés - Lire
tea / regular / mintdepuis la page des classes - Appeler
console.error("missing size")en croyant que cela lance
À retenir
console.logmontre une valeur et le script continue- La lecture cassée est
order.cup; la vraie propriété estsize console.error("missing size")marque l'échec et ne lance pasdebuggers'arrête seulement pendant que les outils de développement sont ouverts- La ligne de la page se lit fixed / tea / regular
🧠 Testez Vos Connaissances
Testez Vos Connaissances
Mettez-vous au défi avec ce quiz interactif et voyez à quel point vous comprenez le sujet
📝 Instructions
- Lisez chaque question attentivement
- Sélectionnez la meilleure réponse pour chaque question
- Vous pouvez refaire le quiz autant de fois que vous le souhaitez
- Votre progression sera affichée en haut