Przejdź do głównej zawartości

[JS] Czym różnią się operatory "==" oraz "==="?

Operatory "===" i"==" służą do sprawdzania, czy dane wartości są równe. Różnica między nimi polega na tym, że:
  • operator "==" dokonuje koercji typów
  • operator "===" nie dokonuje koercji typów
Koercja typów (ang. type coersion) jest procesem, w którym przed porównaniem wartości zmiennych następuje próba sprowadzenia ich do tego samego typu. Innymi słowy: operator "===" nigdy nie zwróci nam true, jeśli porównywane zmienne są innych typów. Operator "==" nie jest taki ścisły, i na przykład wartości 0 i false uzna za równe. Przyjrzyjmy się kilku przykładom: 

1
2
3
4
5
6
if(1 == "1") {
  console.log("równe")
}
else {
  console.log("nierówne")
}

Powyższy kod wypisze do konsoli słowo "równe" ponieważ operator "==" sprowadzi wartości 1 i "1" do tego samego typu (number). Gdybyśmy zmienili operator na "==="...

1
2
3
4
5
6
if(1 === "1") {
  console.log("równe")
}
else {
  console.log("nierówne")
}

 ...do konsoli wypisze się słowo "nierówne" ponieważ operator ten bierze pod uwagę równość typów, a w tym przypadku ona nie zachodzi. A co wypisze taki kod? 

1
2
3
4
5
6
if(true == "true") {
  console.log("równe")
}
else {
  console.log("nierówne")
}

Okazuje się, że wynikiem będzie "nierówne".  Dzieje się tak, ponieważ zarówno true, jak i "true" rzutowane są na liczbę. true zamienione na liczbę daje 1, ale "true" po konwersji jest równe NaN. Jak wiemy, NaN jest falsy value, zaś 1 to truthy value, dlatego ich porównanie daje false. Więcej o truthy i falsy values można poczytać tutaj. A taki kod?

1
2
3
4
5
6
if(new Array(3) == ",,") {
  console.log("równe")
}
else {
  console.log("nierówne")
}

Wynikiem będzie "równe". Dzieje się tak dlatego, że dla tablicy koercja na string zwróci jej wartości oddzielone przecinkami. Jako że tablica w przykładzie jest pusta, jej wartość jako string będzie równa tylko dwóm przecinkom. W przypadku operatora "===" typy muszą się zgadzać. Dlatego taki kod wypisze słowo "nierówne":

1
2
3
4
5
6
if(undefined === null) {
  console.log("równe")
}
else {
  console.log("nierówne")
}

Komentarze