근본부터 따져보자
암시적 강제변환을 깊숙이 파보니 정말 말도 안되는 것들이 몇가지 발견되었다. 이러니 개발자들 사이에서 강제변환은 악의 축이니 뭐니 하면서, 피하는 게 상책이라는 말이 나돌게 된 것이다.
자, 잠시 숨을 가다듬고 근본부터 다시 따져보자.
예상을 벗어난 정도를 기준을 ㅗ하면 강제변환이 심각한 문제가 될 경우는 7가지다. 하지만 나머지 항목들의 강제변환은 이치에 맞고 설명이 가능하다.
"목욕물과 함꼐 아기를 내던져 버리는" 전형적인 예시로 이것보다 적합한 예가 있을까? 겨우 7개에 불과한 함정 때문에 강제변환이란 시스템을 전부 폐기 해야 할까?
족므 신중한 사람이라면 이렇게 반문할 것이다. "그 많은 강제변환의 좋은 부분을 활용하는 동시에 몇몇 나쁜 부분을 어떻게 요리조리 잘 피해갈 수 있을까?" 나쁜 부분 7인방을 모아보자.
"0" == false; // true
false == 0; // true
false == ""; // true
false == []; // true
"" == 0; // true
"" == []; // true
0 == []; // true
이들 중 처음 4개는 == false
비교와 연괸되며, 다시 말하지만 이런 의미 없는 비교는 절대 하지 말자. 이 한 가지는 기억하기 어렵지 않다. 그다음 3개를 보자.
"" == 0; // true
"" == []; // true
0 == []; // true
이런 강제변환 코드를 실제로 쓸 일이 있을까? 그렇다고 치면 과연 어떤 상황에서 가능성이 있을까?
개인적인 생각으로는 자신이 도통 뭘 하는지 모르고 코딩하는 개발자가 아닌 다음에야 실제 자바스크립트 프로그램에서 == []
식으로 불리언 평가를 할 경우는 극히 드물다. 대신, 다음과 같이 == ""
나 == 0
를 사용하지 않을까?
function doSomthing(a) {
if (a == "") {
// ..
}
}
우연히 doSomething(0)
나 doSomething([])
로 호추하면 어이쿠라고 할 것이다. 다른 예제를 보자.
function doSomthing(a, b) {
if (a == b) {
// ..
}
}
역시 마찬가지로 doSomething("", 0)
나 doSomething([], "")
로 호출하면 문제가 된다.
결국, 강제변환 때문에 골탕 먹을 경우의 수가 있다는 사실은 부인하기 어렵고 함정에 빠지지 않으려면 주의할 필요는 있지만, 코드 베이스 전체를 통틀어 그럴 만한 코드가 나올 가능성은 매우 희박하다는 걸 알 수 있다.
암시적 강제변환의 안전한 사용 방법
아주 중요한 부분이다. 우리가 짠 프로그램을 잘 살펴보고 == 연산자 좡우의 피연산자 값이 실제로 어떤 모습일지 머릿속에 그려 보자. 불행한 사고를 미연에 방지하는 차원에서 몇 가지 동등 비교 원칙을 제시한다.
- 피연산자 중 하나가
true
/false
일 가능성이 있으면 '절대로' == 연산자를 사용하지 말자. - 피연산자 중 하나가
[]
/""
,0
이 될 가능성이 있으면 가급적 == 연산자를 사용하지 말자.
이런 상환이라면 == 대신 ===를 사용하여 우리가 의도하지 않은 강제변환을 차단하는 게 훨씬 좋다. 이 두가지 원칙만 준수해도 웬만한 강제변환의 함정들은 효과적으로 피해갈 수 있으리라 생각한다. 좀 더 분명하게, 코드를 길게 작성하는 것도 골치 아픈 디버깅의 늪에서 빠져 나오는 데 도움이 된다.
결국 == 냐 ===냐 하는 문제는 한 마디로 "동등 비교시 강제변환을 허용할 거냐 말 거냐"와 본질적으로 같다.
비교 로직을 간결하게 표현할 수 있는 강제변환이 유용한 경우가 많다.
전반적으로 암시적 강제변환이 정말로 위험한 경우는 그다지 흔치 않다. 하지만 이런 경우라고 해도 ===로 대체하여 안전하게 가면 그만이다.
"암시적 강제변환이 그렇게 사악하고 위험한 녀석인가요??" - "네 그럴 경우가 없잖지만 99%는 아닙니다!!"
사명감을 지닌 성숙한 개발자가 되자. 강제변환의 강력한 파워를 효과적이고 안전하게 사용하는 방법을 잘 익혀서 주변 동료들 역시 잘 인도해주길 바란다.
참고
- You Don't Know JS - 타입과 문법, 스코프와 클로저( 한빛 미디어 )
'JAVASCRIPT' 카테고리의 다른 글
[JS][문법] 문과 표현식 (0) | 2022.02.13 |
---|---|
[JS][강제변환][마무리] 추상 관계 비교 (0) | 2022.02.13 |
[JS][강제변환] 동등비교 : 희귀 사례 (1) (0) | 2022.02.12 |
[JS][강제변환] 동등비교 : null -> undefined, 객체 -> 비객체 (0) | 2022.02.12 |
[JS][강제변환] 동등비교 : 문자열 -> 숫자, * -> 불리언 (0) | 2022.02.12 |
댓글