Vergleiche in JavaScript: == oder ===?

JavaScript kennt zwei Operatoren zum Vergleich von Werten, == und ===. Viele Entwickler, die von anderen Programmiersprachen umsteigen, verwenden aus Gewohnheit und Unwissen den Operator ==. Doch das ist keine gute Idee. Warum?

Fragt man erfahrene JavaScript-Entwickler, welchen der beiden Vergleichsoperatoren man verwenden solle, lautet die Antwort nahezu immer ===. Das schlagen auch diverse Linter vor, beispielsweise ESLint mit der eqeqeq-Regel. Doch warum gilt das?

Der hauptsächliche Unterschied zwischen == und === in JavaScript besteht darin, dass == im Bedarfsfall eine Typumwandlung durchführt und === nicht. Vergleicht man zwei Werte des gleichen Typs, verhalten sich beide Operatoren gleich:

console.log(23 == 23);
// => true

console.log(23 === 23);
// => true

console.log(23 == 42);
// => false

console.log(23 === 42);
// => false

Anders verhält es sich jedoch, wenn die Typen verschieden sind. Der Operator == versucht dann, eine geeignete Typumwandlung durchzuführen, dass das Ergebnis doch noch true ergibt. Der Operator === hingegen bricht ab und gibt zurück, dass die beiden Werte verschieden sind:

console.log('23' == 23);
// => true

console.log('23' === 23);
// => false

Der Operator === entspricht also eher dem, was man intuitiv erwartet. Alleine deshalb ist es ratsam, diesem Operator den Vorzug zu geben.

Hinzu kommt, dass === unter Umständen schneller ist als ==, also einen (zugegebenermaßen minimalen) Performancevorteil bietet. Sind die beiden zu vergleichenden Werte vom gleichen Typ, geben sich die beiden Operatoren nichts. Sind sie aber von unterschiedlichen Typen, ist === schneller, da auf die zusätzlichen Typkonvertierungen verzichtet und direkt abgebrochen wird.

Auch Douglas Crockford empfiehlt in seinem Buch "JavaScript: The Good Parts", ausschließlich den Operator === zu verwenden:

"JavaScript has two sets of equality operators: === and !==, and their evil twins == and !=. The good ones work the way you would expect. If the two operands are of the same type and have the same value, then === produces true and !== produces false. The evil twins do the right thing when the operands are of the same type, but if they are of different types, they attempt to coerce the values. the rules by which they do that are complicated and unmemorable."

Wenn also nicht bereits geschehen, sollte man generell auf die typsicheren Varianten === und !== umsteigen und das Verhalten am besten direkt per Linter erzwingen.

tl;dr: JavaScript kennt zwei Operatoren zum Vergleich, == und ===. Der erste ist nicht typsicher, der zweite hingegen sehr wohl – weshalb man stets den zweiten verwenden sollte. ()