IT/IT 인터넷

[자바스크립트] 내가 뽑은 비트 연산자에 대한 활용 베스트 TOP 3와 정성 가득 설명글

print() 2025. 2. 25. 02:15
300x250

 

안녕하신가~ 오늘도 열공!

 

오늘은 비트 연산자에 대해 공부를 해보았다. 정처기 딸 때 공부했으니 복습이다.

 

비트 연산자는 가독성이 떨어져서 실무에서 잘 사용은 안 하는데 성능 최적화가 필요한 수준에서 주로 사용된다.

 

근데 막상 쓸려고 하면 이미 만들어진 걸 엎고 구조변경이 필요하기에 고객의 간절한 요청이 아니면 일반적인 상황에서는 쓸 일이 없을 듯하다.

 

비트 연산자에 대해 기억이 잘 안 나는 사람에게 표를 보여주겠다. 개발자들의 학교 w3schools의 자료이다. 비트 연산자에 대한 기본적인 건 스쿨에서 배워오시라~

 

w3schools에서 캡처한 비트 연산자 표

 

 

1. 홀수/짝수 판별(& 연산자 활용)

 

비트 연산을 사용하면 n % 2 보다 더 빠르게 홀수/짝수를 판별하는 코드를 짤 수 있다.

 

function isEven(n) {
  return (n & 1) === 0;
}

console.log(isEven(4)); // true (짝수)
console.log(isEven(7)); // false (홀수)

 

& 연산자는 같은 비트 자리에 두 값다 1일 경우 1을 리턴한다.

 

1로 & 연산을 해주면 첫 번째 비트가 1인지만 체크하기에 홀수/짝수 판단이 가능하다.

 

1은 0001 비트

2는 0010 비트

3은 0011 비트

4는 0100 비트

5는 0101 비트

6은 0110 비트

 

자 비트의 규칙을 알아버렸는가? 첫 번째 자리를 보면 홀수일때  1 짝수일 때 0 인 것을 알 수 있다. 후훗.

 

저 샘플 소스는 마지막 비트를 체크해서 0이 나오면 true를 리턴해서 짝수이고 1이 나오면 false를 리턴해서 홀수인 것을 알 수 있다.

 

 

2. 특정 비트가 켜져 있는지 확인, 네트워크 최적화, 온라인 게임 최적화 (&, << 연산자 활용)

 

아직도 메모리를 낭비하고 있는 당신! 비트 체크 로직을 추가하여 10개의 변수를 하나의 변수로 관리해 보시라.

 

function hasBit(num, bit) {
  return (num & (1 << bit)) !== 0;
}

console.log(hasBit(5, 0)); // true (5의 0번째 비트: 1)
console.log(hasBit(5, 1)); // false (5의 1번째 비트: 0)
console.log(hasBit(5, 2)); // true (5의 2번째 비트: 1)

 

기계어에 가까운 언어를 사용할수록 처리 속도가 빨라진다는 사실은 개발자라면 누구나 알고있다.

 

하지만 우리가 쓰고 있는 개발 언어는 대부분 고 수준의 자연어에 가까운 언어를 사용해 처리 속도가 떨어진다.

 

그렇다고 기계어를 쓰기엔 1시간 걸릴 개발을 몇 달 혹은 몇 년이 걸릴 수 있다.

 

그래서 자연어에 가까운 언어를 주로 사용하여 개발 속도를 높이되 성능이 필요한 특정 부분에선 기계어의 장점을 가져와 성능을 개선할 필요가 있다.

 

온라인 게임에서 유저가 위쪽 버튼을 눌렸을 때 자연어와 기계어 장점을 사용하였을 때 비교

 

자연어에 가까운 파라미터 - json

 

{

    "위" : true,
    "아래" : false,
    "왼쪽" : false,
    "오른쪽" : false
}

 

 

비트 체크 로직을 사용하여 성능을 올릴 때 파라미터 - 숫자 하나

 

8

 

 

비트 4자리를 놓고 왼쪽 순서대로 위, 아래, 왼쪽, 오른쪽라고 가정하였을 때 1000 비트면 8이고 위 json 파라미터와 동일하게 사용할 수 있다.

 

모든 방향키를 누르면 1111 비트로 15

 

아래와 오른쪽을 누르면 0101 비트로 5

 

초당 60번 입력을 주고받는 온라인게임에서 20명의 유저 데이터를 처리할 때 어떤 파라미터를 넘기고 싶으신가? 샘플 코드를 복사해서 당장 적용하시라!

 

3. 값을 빠르게 2의 배수로 곱하거나 나누기 (<<, >> 연산자 활용)

 

console.log(5 << 1); // 10 (5 * 2¹)
console.log(5 << 2); // 20 (5 * 2²)

console.log(8 >> 1); // 4  (8 / 2¹)
console.log(8 >> 2); // 2  (8 / 2²)

 

 

CPU 레벨에서 연산이 최적화되어 일반 곱하기, 나누기보다 연산이 빠른 방법이니 샘플 코드를 참고해서 잘 사용하시라.

 

갑자기 귀찮아져서 급 마무리. 끝.

 

300x250