형 변환의 기본은 다루지 않습니다. 자세한 사항은 자료 출처에서 보실 수 있습니다.
라고 생각했다.
아래 문제를 보고 아니라고 생각했다.
"" + 1 + 0
"" - 1 + 0
true + false
6 / "3"
"2" * "3"
4 + 5 + "px"
"$" + 4 + 5
"4" - 2
"4px" - 2
7 / 0
" -9 " + 5
" -9 " - 5
null + 1
undefined + 1
" \t \n" - 2
"" + 1 + 0
"" - 1 + 0
위 코드의 결과는 아래와 같다.
10
-1
아니 왜? 🤭
+, -가 바뀌었다고 결과가 이렇게 바뀔일인가? + 연산의 경우 문자열과 숫자 모두 존재하기 때문에 문자열
더하기 숫자
는 문자열 더하기로 숫자가 문자열로 형 변환이 일어난다.
반면, 문자열에는 - 연산이 없기 때문에 - 연산을 하기 위해 문자열이 숫자로 형변환이 일어난다.
6 / "3"
"2" * "3"
"4" - 2
"4px" - 2
" -9 " - 5
모두 문자열이 숫자로 형 변환되는 경우다. /, *, - 등 숫자 연산에서만 존재하는 연산자로 연산을 하는 경우다. 답은 아래와 같다.
2
6
2
NaN
-14
위에서부터 3개의 예제는 흔히 볼 수 있는 형 변환 예제이다. 뒤의 2개 예제 역시 문자열이 숫자로 형 변환되는 예제인데, 처음 보았다.
문자열 "4px"
이 - 연산자를 만나 숫자로 형 변환이 일어난다. "4px"
은 숫자로 형 변환할 수 없기 때문에 NaN
이 된다. NaN
에 -2를 해봐야 NaN
이 된다.
문자열 " -9 "
는 - 연산자를 만나 숫자로 형 변환이 된다. 문자열이 숫자로 형 변환 될 때 공백은 모두 제거 된다. 따라서 " -9 "
는 -9가 되고 계산 결과는 -14가 된다.
" -9 " + 5
반면, 위 예제는 처음 예제와 마찬가지로 + 연산이기 때문에 숫자가 문자열로 형 변환이 된다. 결과는 아래와 같다.
-9 5
위에서 말했던 것과 같이 문자열이 숫자로 형 변환 될 때는 공백이 사라진다. 따라서
" \t \n" - 2
탭과 줄 바꿈은 모두 사라진다. " \t \n"
은 길이가 0인 문자열이 된다. 최종적으로 공백은 숫자로 형 변환 될 때 0이 된다.
null + 1
undefined + 1
위 계산의 결과는 각각
1
NaN
이 된다. null
은 숫자로 형 변환이 될 때, 0이 되고 undefine
은 NaN
이 된다.
나는 왜 형 변환이 쉽다고 생각했을까. 내가 쉬운 예제만 보았던 것이었다. 사람은 항상 겸손해야 한다.