자바스크립트에서 문자열을 숫자로 변환할 때 parseInt()나 parseFloat() 혹은 조금 더 빠른 Number()를 사용하곤 합니다.
하지만 더욱 간단하고 멋있게 쓸 수 있는 +를 사용해 보는건 어떨까요? 뭔가 더 있어보일 수 있습니다
목차
0. 단항 연산자가 뭔데?
단항 연산자는 한 개의 피연산자와 결합하는 연산자를 의미합니다.
단항 연산자가 앞에 오고 뒤에 요소가 오는 방식으로 사용합니다.
ex) -10
위 예시에서 봤듯이 우리는 그동안 알게 모르게 단항연산자를 많이 사용해왔죠.
가장 대표적으로 - 단항 연산자를 숫자 앞에 붙이면? 기존에는 양수값이었던 숫자형 데이터를 음수값으로 바꿔줄 수 있습니다.
1. +도 단항연산자라고?
맞습니다. -가 단항연산자인데, +도 질수 없었는지, 이 친구도 단항연산자의 역할을 할 수 있다고 합니다.
그렇다면.. 진짜로 앞에 어떠한 요소도 없이 어떤 요소의 뒤에 +를 붙이면 어떻게 될까요?
숫자형 데이터 앞에는 +를 붙여봤자 아무 의미도 없습니다.
let a = 10;
console.log(+a) // 10
console.log(typeof +a) // number
그렇다면 문자형 데이터 앞에 +를 붙이면 어떻게 될까요?
let a = "10";
console.log(typeof a) // string
console.log(+a) // 10
console.log(typeof +a) // number
와!!! string 형태의 데이터가 number 형태로 바뀌었습니다!
이처럼 + 단항연산자는 데이터를 숫자형 데이터로 바꿔줄 수 있는 경우 바꿔주는 연산자입니다.
문자열 뿐만 아니라 true, false, null, 16진수값 역시 숫자 타입으로 반환해줍니다.
아래 예시에서는 다양한 요소들을 + 단항연산자의 피연산자로 넣어봤습니다.
let a = true;
let b = false;
let c = null;
let d = "-10";
let e = "0xAAAA";
console.log(+a) // 1
console.log(+b) // 0
console.log(+c) // 0
console.log(+d) // -10
console.log(+e) // 43690 <- 16진수를 number형태로 변환
console.log(typeof +a) // number
console.log(typeof +b) // number
console.log(typeof +c) // number
console.log(typeof +d) // number
console.log(typeof +e) // number
하지만 당연히 숫자로 표현할 수 없는 요소들은 정상적으로 number 형태로 바꿀 수 없습니다.
이런 경우에는 숫자가 아니라는 의미의 NaN (Not a Number)를 출력하게 됩니다.
let a = "abc";
console.log(+a) // NaN
console.log(typeof +a) // undefined
지금까지 직접 예제를 통해 살펴봤는데, 아래 mdn 사이트에서도 이와 관련된 내용이 나와있으니 참조하시면 좋습니다!
최근댓글