[js]tilde(~)와 double tilde(~~)

tilde(~) 연산자

비트 연산자. NOT의 기능을 한다.

2진수의 0 <->1 로 바꾼다.

const a = 5;     // 0000000000000101
console.log(~a); // 1111111111111010
// expected output: -6

const b = -3;    // 1111111111111101
console.log(~b); // 0000000000000010
// expected output: 2

하지만 저것을 콘솔에 실행시켜 보면 expected output과 같이 -6,2 가 나온다. 이를 이진수로 직접 눈으로 확인 하는 법은 없을까?

 

toString() 메서드를 이용하여 이진수로 변환하기

toString() 메서드를 이용하면 10진수를 이진수로 바꿀 수 있다.

const a = 8;
console.log(a.toString(2)); // 1000

근데 여기서 문제점 발생. 음수를 toString(2)로 주면 1000의 보수인 1111111111111111111111111111000가 나와야 하는데, -1000이 나온다. 그러면 NOT연산자를 할 수 없다.

const a = -8;
console.log(a.toString(2)); // -1000

 

double tilde(~~) 연산자

간단히 말하자면 tilde를 2번 반복한 것.

let k = 8 일 때, ~k = -9다. 그렇다면 ~~k는? 원래대로 8이다.

응용법

1. Math.floor() 대신 사용하기

숫자에 ~ 연산을 하게되면서 소수점이 버려진다. 그러므로 ~~를 활용하면 Math.floor()와 동일한 효과를 가져온다.

• 장점: 속도 측면에서 ~~가 더 빠르다. (빠른순: ~~ > Math.floor > parseInt)
• 단점 : 가독성이 좋지 않다.

2. undefined 또는 null을 0으로 변환할 때 사용하기

undefined + 3 === NaN

숫자 아닌 값에 숫자를 더하면 NaN이 된다. 

(예제) 배열 [1,1,1,2,2,3,3,3,3]을 각 숫자가 몇 개인지 객체에 저장하기

const arr = [1,1,1,2,2,3,3,3,3]
const obj1 = {}

arr.forEach(v => {
  if(obj1[v]) obj1[v] += 1
  else obj1[v] = 1
})
// obj1 {1: 3, 2: 2, 3: 4}

 

위와같이  obj에 key값이 있는지 확인해주는 작업이 필요하다. 그렇지 않으면 NaN가 나올 것이기 떄문. ~~를 활용하여 코드를 다시 작성해보자.

const obj2 = {};
arr.forEach(v => obj2[v] = ~~obj2[v] + 1);

undefined가 나올 수 있는 상황을 ~~연산자를 이용해서 0으로 변경하여 간단하게 문제를 해결한다.

글쓴이처럼 나도 알고리즘 답안을 보면서 알게된 연산자라서 앞으로도 문제를 풀 떄 유용하게 사용할 수 있을 것 같다!

 

 

 

---

참고 자료

https://velog.io/@proshy/JS-tilde%EA%B3%BC-double-tilde%EC%97%B0%EC%82%B0%EC%9E%90