[JavaScript] !, !! 연산자

[JavaScript] !, !! 연산자

자바스크립트에는 많은 연산자가 있다. ! 연산자는 타 언어에서도 볼 수 있는 연산자로서 개발자라면 모두 알고 있는 Not 연산자이다. 그렇다면 !! 연산자는 뭘까? 왜 Not -> Not 하면 다시 원래 값인데 2번 사용할까? 한번 간단하게 알아보자.

! 연산자

! 연산자는 많이 사용해보았을 수도 있다. 필자의 경우 조건문에 조건식으로 많이 사용한다. 아래 예시를 보자.

해당 숫자가 홀수인지 아닌지 확인 하는 코드가 필요하다고 하자. 그럼 2가지 방법이 있다. 첫 번째 방법은 홀수인지 확인하는 것, 두 번째 방법은 짝수가 아닌지 확인하는 것이다. 여기서 짝수가 아닌 것을 확인할 때 !even으로 사용할 수 있다. 조건식 그대로 짝수가 아닌 것을 확인하는 것이다. 아래 간단하게 코드를 확인해보자.

if(num % 2 === 1) {}    // 홀수인지 확인하는 코드 
if(!(num % 2 === 0)) {} // 짝수가 아닌지 확인하는 코드

!! 연산자

그럼 !! 연산자는 무엇일까? 코드 그대로 Not Not 이다. 위 ! 연산자에서 사용한 예제를 다시 사용해보자. 홀수인지 확인할 때, !!even 하면 뭔가? 다시 짝수이다. 그럼 !!!even을 해야 홀수가 되는 것이다. 그럼 뭐하러 !! 연산자를 쓰는가? 간단하게 빠르게 알아보자.

!! 연산자는 Boolean 자료형이 아닌 것을 Boolean 자료형으로 만들 때 사용한다. 예를들어 Boolean(3)이면 true가 되는데, !!3을 하여도 true가 된다. 이렇게 간단하게 형 변환을 하고 싶을 때 사용한다. 그런데 왜 3도 참 값인데 굳이 !!3을 하여 true로 만들어 주는 가? 라는 의문이 들 수 있다. 이러한 것은 팝업이나, 다이얼로그를 띄울 때, open 값을 Boolean으로 설정해두는 경우가 있다. 이러한 경우 open={3}을 하면 실행은 되겠지만 warning 에러가 표시될 확률이 높다. 따라서 open={!!3}을 하여 open={true}로 형변환을 해주는 것이다.

if(3){}		// true
if(!3){}	// false
if(!!3){}	// true

console.log(typeof 3)	Number
console.log(typeof !3)	Boolean
console.log(typeof !!3)	Boolean

정리

! 연산자는 Not을 의미한다. !! 연산자는 ! 연산을 2번하여 Boolean 형이 아닌 자료형을 손쉽게 Boolean 형으로 변경할 때 사용한다.

마지막

해당 내용은 틀릴 수도 있다는 것을 감안하여 봐주세요. 틀린 내용 및 오탈자 수정 요청 환영입니다.