Computer >> 컴퓨터 >  >> 프로그래밍 >> JavaScript

자바스크립트 이중 물결표(~~) 연산자란? 사용법과 예제 총정리

이중 물결표(~~) 연산자란?

자바스크립트에서 이중 물결표(~~)는 비트 NOT 연산자(~)를 두 번 연속으로 적용한 형태로, '이중 NOT 비트 연산자'라고도 부릅니다. 첫 번째 ~가 숫자를 32비트 정수로 변환하며 비트를 반전시키고, 두 번째 ~가 다시 비트를 반전시켜 원래 값의 정수 부분만 남기게 됩니다.

결과적으로 소수점 이하를 잘라낸 정수를 얻게 되므로, 많은 개발자들이 Math.floor()의 대체재로 사용합니다. 특히 과거에는 비트 연산이 함수 호출보다 처리 속도가 빠르다는 이유 때문에 성능 최적화 목적으로 널리 활용되었습니다.

사용 예제

아래 코드를 실행하면 이중 물결표 연산자의 동작을 직접 확인할 수 있습니다.

<html>
<body>
<script>
var a = 2;
var b, c, d;

b = ~~a;           // 이중 물결표 연산자 적용
c = Math.floor(a); // Math.floor() 적용
d = ~~b === c;     // 두 결과가 같은지 비교

document.write(b);
document.write("<br>" + c);
document.write("<br>" + d); // true 출력 — 두 값은 동일함
</script>
</body>
</html>

실행 결과는 다음과 같습니다.

  • b = 2 (~~ 연산 결과)
  • c = 2 (Math.floor() 결과)
  • d = true (두 값이 동일함)

Math.floor()와의 차이점 및 주의 사항

~~ 연산자를 사용하기 전에 반드시 알아야 할 차이점이 있습니다.

  • 양수: 양수에서는 Math.floor()와 결과가 같습니다. 예: ~~2.7 → 2, Math.floor(2.7) → 2
  • 음수: 음수에서는 동작 방식이 다릅니다. ~~는 소수점을 단순히 버리지만(0 방향 절삭), Math.floor()는 더 작은 정수로 내립니다. 예: ~~-2.7 → -2, Math.floor(-2.7) → -3
  • 32비트 범위 제한: ~~ 연산은 값을 32비트 정수로 변환하기 때문에 -2,147,483,648 ~ 2,147,483,647 범위를 벗어나는 큰 숫자에는 부정확한 결과를 반환합니다.

따라서 현대 자바스크립트 환경에서는 가독성과 안정성을 고려해 Math.trunc(), Math.floor() 또는 Number.parseInt() 사용을 권장하지만, 레거시 코드나 성능이 중요한 상황에서는 여전히 유용하게 쓰입니다.