프로그래밍 공부를 C언어로 시작하고 비교 연산자에서 같다라는 표현은 == 이 연산자를 사용해야 한다고 배우고 줄곧 ==(동등연산자, equality operator)만을 사용했었습니다.
그러던 어느날 다른 분 자바스크립트 소스를 보다 ===(일치연산자, identity operator)를 사용 하는 걸 보고 궁금해서 알아보게 되었고, 알아본 것을 같이 공유하고자 이 글을 포스팅하게 되었습니다!
자바스크립트에서는 == 연산자를 사용시에 type이 다를 경우에는 자동으로 형변환을 해서 비교를 한다고 합니다.
위에 예제에서 9,10,11번 라인을 보면 false가 예상되는 비교지만 실질적으로는 자동으로 형변환되서 true가 출력되는걸 확인 할 수 있습니다. 그리고, 8번 라인의 경우에는 type이 같고 값도 같으니 당연히 true가 출력되는걸 확인할 수 있고, 12번 라인의 경우에는 type은 같으나 값이 달라 false가 출력되는걸 확인할 수 있습니다.
반면에, === 연산자를 사용시에는 type이 달라도 형변환이 이루어지지 않기 때문에, type이 다르다면 당연히 다른값이 되며, 우리가 실질적으로 원하는 비교를 한다고 보시면 됩니다. 그래서 16,17,18번 라인을 보면 형변환이 되지 않으니 당연히 number와 string은 같을 수 없기에 false가 출력되고, 15번 라인의 경우에는 타입이 같고 값도 같기 때문에 true가 출력되고, 19번 라인의 경우에는 타입은 같지만 값이 달라 false가 출력되는 것을 볼 수 있습니다.
저 같은 경우에는 숫자를 비교할 경우에 저도 모르게 string으로 선언된 1과 number로 선언된 1이 다른 값이라고 생각해야되는데 같다고 생각해서 사용을 했었습니다. 예를 들어 서버에서 가져온 데이터가 문자열('1')로 넣어있든 숫자(1)로 넣어져있든 == 연산자로 비교하여 같다고 처리를 했었습니다. 이걸 공부하면서 이처럼 사용하던게 틀리다고는 하기엔 애매하지만 지양해야하는 방식이란걸 생각되며, 앞으로는 type도 같아야 된다라고 생각하면서 === 연산자를 사용하여 비교를 해야겠다라는 생각을 하게 되었습니다.
이 글을 보신분들은 자바스크립트에서 같다라는 비교연산자를 사용하실때 한번 더 생각해보시면 좋을것 같습니다ㅎㅎ
해당 포스팅이 도움이 되셨기를 바라며 공부하다가 찾아본 다른 예시를 몇개 실행해본 것을 아래 공유해봅니다.
이중에 0==-0, 0===-0 의 결과 true와 NaN==NaN, NaN===NaN의 결과 false는 어떻게 이 결과가 나오는지 사실..
잘 모르겠습니다.. 나머지는 그래도 어느정도 예측을 해볼만 한데 이 두 녀석은 잘 모르겠네요..ㅠ,ㅠ
'[WEB] javascript, jQuery, html, css ...' 카테고리의 다른 글
| IE(Internet Explorer) DATE NAN (2) | 2019.10.23 |
|---|---|
| 웹 코딩 툴 Repl.it (2) | 2019.04.15 |
| tr onclick 특정 td 제외 (3) | 2018.11.22 |
| [꾸울팁!] a 태그 onclick 사용하기!!! (0) | 2017.10.30 |
| javascript debugger (자바스크립트 디버거) (0) | 2017.08.14 |
test.html