자바스크립트의 동일 연산자에는 두 가지가 있다.

  • 관대한 동등/비동등 연산자 "==" "!="
  • 엄격한 일치/불일치 연산자 "===" "!=="

책에서는 동등 연산자는 너무 많은 값을 같다고 판단하므로, 일치 연산자를 사용할 것을 권장하고 있다.

그렇다면 어떤 값들을 동등 연산자로 비교했을 때, 기대한 것과 다르게 값이 나올까 궁금했다.

그리고 Stack Overflow에서 관련된 질문을 찾았고, 가장 많은 명성(?)을 얻은 답변은 다음과 같다.



 일치 연산자  ===  는 타입 변환이 안되는 것을 제외하고 동등 연산자  ==  와 동일하게 동작하며, 일치하는 것으로 간주되려면 타입이 항상 같아야 합니다.

 동등 연산자  ==  는 모든 필수적인 타입 변환을 한 후에 동등함을 비교할 것입니다. 일치 연산자  === 는 타입 변환을 하지 않기 때문에, 두 값이 같은 타입이 아니면  === 는 단순히 false를 반환합니다. 둘 다 속도는 같습니다.

 더글라스 크록포드(JSON의 아버지!)의 JavaScript: The Good Parts를 인용해보겠습니다.


 자바스크립트는 두 세트의 동일 연산자를 가집니다.  ===  와  !== , 그리고 그들의 나쁜 쌍둥이  ==  와  != . 좋은 것들은 당신이 예상하는대로 동작하는 것입니다. 만약 두 개의 피연산자가 동일한 타입, 동일한 값이면  ===  는 true를 만들고,  !== 는 false를 만듭니다. 나쁜 쌍둥이는 피연산자가 같은 타입일 때 올바르게 동작하지만, 다른 타입이라면 그들은 피연산자의 값을 마음대로 하려 할겁니다. 그들의 행동으로 형성된 법칙은 복잡하고 기억하기 어렵습니다. 여기에 몇 가지 흥미로운 케이스가 있습니다.


"" == '0' //false
0 == "" //true
0 == '0' //true

false == 'false' //false
false == '0' // true

false == undefined //false
false == null //false
null == undefined // true

'\t\r\n' == 0 // true

 타당성이 부족한 것이 놀랍습니다. 내 조언은 나쁜 쌍둥이들을 절대 사용하지 말라는 겁니다. 대신, 항상  ===  와  !== 를 사용하세요. 위의 모든 비교들은  ===  로 비교하면 false를 만듭니다.

 레퍼런스 타입에 대해서는  ==  와  ===  는 특별한 경우를 제외하고, 서로 일관성을 갖고 동작합니다.


var a = [1,2,3];
var b = [1,2,3];

var c = {x: 1, y: 2};
var d = {x: 1, y: 2};

var e = "text";
var f = "te" + "xt";

a == b // false
a === b // false

c == d // false
c === d // false

e == f // true
e === f // true


"abc" == new Striing("abc") // true
"abc" === new String("abc") // false

 여기  ==  연산자는 두 객체의 값을 검사하고, true를 반환하지만, 그들이 같은 타입인지 보는  ===  는 false를 반환합니다. 무엇이 맞을까요? 그것은 정말 당신이 비교하려는 것에 따라 달렸습니다. 나의 조언은, 질문을 완전히 돌아가서, String 생성자를 문자열 객체를 생성하는데 사용하지 말라는 것입니다.


'JavaScript' 카테고리의 다른 글

[JavaScript] Trailing Comma 번역자료  (0) 2017.10.02
[JavaScript] 변수 스코프  (0) 2017.04.13
[JavaScript] 생성자 함수  (0) 2017.02.27
[JavaScript] 배열 연결  (0) 2017.01.26

+ Recent posts