Pourquoi mon code JavaScript échoue-t-il avec `h.className = h.className ? \'erreur\' : \'erreur\'`?

Énigme de priorité des opérateurs : opérateur ternaire et concaténation de JavaScript

L'utilisation de l'opérateur ternaire en JavaScript peut être déroutante, surtout lorsqu'elle est mélangée à d'autres opérateurs. Considérez l'extrait de code suivant :

h.className += h.className ? ' error' : 'error'

Le but de ce code est d'ajouter la chaîne « error » à la propriété className de l'élément HTML « h ». Cependant, le code échoue avec une erreur. Pour comprendre pourquoi, nous devons décortiquer la priorité des opérateurs en JavaScript.

L'opérateur ternaire (?:) a une priorité plus élevée que l'opérateur d'affectation (=). Par conséquent, le code ci-dessus est équivalent à :

h.className = h.className + (h.className ? ' error' : 'error')

Cette interprétation a plus de sens. L'opérateur ternaire vérifie si h.className n'est pas nul ou indéfini (une valeur "véridique"). Si c'est vrai, il ajoute « erreur » à h.className. Sinon, il ajoute « erreur ».

Pour corriger le code d'origine, nous devons ajouter explicitement l'opérateur d'affectation entre parenthèses :

h.className = h.className + (h.className ? ' error' : 'error')

En plaçant l'opérateur d'affectation entre parenthèses, nous remplaçons les règles de priorité et assurez-vous que l'expression ternaire entière est affectée à h.className.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!