9. 자바스크립트(JavaScript) 연산자(2)

 

1. 논리 연산자

• 논리 연산자(Logical Operators)는 어떠한 명제에 대한 논리적인 판단을 내리는 연산자입니다.
• 참 또는 거짓의 값을 받아 논리적 연산의 결과로 true, false를 반환합니다.
• 종류
  • AND 연산자(&&)
    • 표현식1 && 표현식2와 같아 작성합니다.
    • 표현식1과 표현식2 모두가 참인 경우 true를 반환하고 그렇지 않은 경우 false를 반환합니다.
  • OR 논리 연산자(||)
    • 표현식1 || 표현식2와 같이 작성합니다.
    • 표현식1, 표현식2 둘 중 하나가 참인 경우 true를 반환합니다.
  • NOT 논리 연산자(!)
    • !표현식으로 작성합니다.
    • true를 !로 부정(Not)하면 false가 되고 false를 !로 부정하면 true가 됩니다.
  • !! 연산자
    • not 연산자에 한 번 더 not 연산자를 처리하는 방법

// AND 논리 연산자 &&
console.log(true && true)                   // true
console.log(true && false)                  // false
console.log("문장" === "문장" && 5 === 5)   // true
console.log(5 === 5 && "문장1" === "문장2") // false   문장1과 문장2의 값이 false이기 때문에 모두 참이 아니므로 false로 반환

// OR 논리 연산자 ||
console.log(true || false)                  // true
console.log(false || false)                 // false
console.log("문장" === "문장" || 5 === 10)  // true    문장과 문장의 값이 true이고 5와 10은 다른 값이므로 false를 반환하지만 둘 중 하나가 true이므로 true를 반환

// NOT 논리 연산자 !
console.log(!true)                          // false
console.log(!false)                         // true
console.log(!5)                             // false
console.log(!"문장")                        // false    숫자형 5와 "문장"은 항상 true인 값이므로 NOT 연산자를 대입하면 값이 false

// !! 연산자
console.log(!!5)                            // true
console.log(!!"문장")                       // true

• Boolean 자료형이 아니더라도 값을 논리 연산자로 처리하면 참인지 거짓인지 구분이 가능합니다.
• 값의 정보가 유효한 경우 참(true)의 값을 판단되고 논리 연산자의 결과값은 무조건 true가 반환됩니다.
  ex) 1 2 3 "문자" true [1, 2, 3] {num: "1"} function() {}
• 값의 정보가 비어 있는 경우 유효하지 않다고 판단되어 거짓을 의미하는 값인 false를 반환합니다.
  ex) false 0 -0 "" NaN null undefined 는 무조건 false인 값을 의미합니다.

2. 삼항 연산자

• 삼항 연산자는 if 와 switch 처럼 조건문을 처리하는 연산자입니다.
• if 조건문의 축약형으로 사용하며 세 개의 문장으로 구성되어 있습니다.
  => 조건문 ? 표현문1 : 표현문2
• 조건문은 반드시 결과가 참(true), 거짓(false)으로 반환되어야 합니다.
• 결과가 true이면 표현문1을 실행하고 false이면 표현문2를 실행합니다.
• 삼항 연산의 결과로 반환된 값은 다시 변수로 할당할 수 있습니다.
  => 할당되는 값은 삼항 연산 실행문의 마지막 값이 할당됩니다.

const condition = 5 > 10                               // 10이 더 작기 때문에 false를 반환
condition ? console.log("LEft") : console.log("Right") // Right    condition 의 결과가 false 이므로 "Right"를 반환

const result = condition ? (                           // 변수 result 에 삼항 연산식을 대입
  console.log("삼항 연산식의 첫 번째 표현식 입니다."),
  "표현식1"
) : (
  console.log("삼항 연산식의 두 번째 표현식 입니다."),
  "표현식2"
  )
  // condition의 값 false로 인해 두 번째 표현식이 실행되어 "삼항 연산식의 두 번째 표현식 입니다." 콘솔 로그가 출력되고, 
  // 변수 result 에는 마지막 값인 "표현식2"가 할당
  
  console.log(result)
  /*
  삼항 연산식의 두 번째 표현식 입니다.
  표현식2
  */

3. 비트 연산자

• 비트(Bit)
  • 이진수(Binary digit)의 줄임말로 0과 1로 구성된 숫자 체계를 갖고 있는 이진수 단일 값입니다.
  • 데이터의 가장 작은 기억장치의 최소 단위
• 바이트(Byte)
  • 컴퓨터 용량의 기본 단위로 컴퓨터의 RAM과 하드 디스크 용량, 파일 브라우저에서 보이는 파일 크기 등을 측정하는 단위로 쓰입니다.
• 바이트보다 더 작은 단위가 비트입니다.
• 바이트를 비트로 변환 계산하면 1byte = 8bit 입니다.
  => 이러한 비트를 활용한 연산이 비트 연산자입니다. 비트 연산은 숫자 1과 0으로만 구성된 값인 이진수로 연산이 가능합니다.
• 자바스크립트의 비트 연산자는 크게 비트 논리 연산자와 비트 이동 연산자로 나눕니다.
  • 비트 논리 연산자
    • AND 연산자(&)
      • a & b로 작성합니다.
      • 곱하기처럼 0이 하나라도 있으면 결과 값이 0이 됩니다.
      • 반대로 대응되는 비트는 변환하고, 모든 값이 1일 때만 1을 반환합니다.
    • NOT 연산자(~)
      • ~a 로 작성합니다.
      • 입력된 비트 값을 반대의 값(1이면 0, 0이면 1)으로 바꿔 반환합니다.
    • OR 연산자(})
      • a | b로 작성합니다.
      • 대응되는 비트 값 중 최소 하나만 1이어도 1을 반환합니다.
    • XOR 연산자(^)
      • a ^ b로 작성합니다.
      • 배타적으로 1인 경우에만 1을 반환합니다.
  • 비트 이동 연산자
    • <<
      • a << b 로 작성합니다.
      • a의 이진수 표현을 b 비트의 자릿수만큼 왼쪽으로 이동하고, 오른쪽은 0으로 채웁니다.
    • >>
      • a >> b 로 작성합니다.
      • a의 이진수 표현을 b비트의 자릿수만큼 오른쪽으로 이동하고, 오른쪽 남은 비트는 버립니다.
      • 왼쪽의 빈자리는 원래 해당 자리에 있던 비트 값으로 채웁니다.
    • >>>
      • a >>> b 로 작성합니다.
      • a의 이진수 표현을 b비트만큼 오른쪽으로 이동합니다.
      • 오른쪽 남은 비트는 버리고 왼쪽의 빈자리는 0으로 채웁니다.

console.log(13 & 10)   // 8
console.log(~13)       // -14
console.log(13 || 10)  // 13
console.log(13 ^ 10)   // 7
console.log(2 << 2)    // 8
console.log(13 >> 1)   // 6
console.log(13 >>> 2)  // 3

* 10진수를 이진수로 변환하는 방법
- .toString(2)를 활용하면 바이너리 형태로 변환할 수 있음