Javascript Operator   자바스크립트 연산자

(2022-06-25)

연산자 , 비트 연산자


1. 자바스크립트 기본 연산자

  ㅇ 단항 연산자
     -  `+` (단항 덧셈, 숫자로 강제 변환)
     -  `-` (단항 부정, 부호 바꿈)  

     -  증가 연산자 : `++` (전위 증가 또는 후위 증가)
     -  감소 연산자 : `--` (전위 감소 또는 후위 감소)
        .  `= ++i`(전위 연산자), `= i++`(후위 연산자) 비교
           ..  `= ++i` : 먼저 평가하고(먼저 1을 더함), 그 다음에 대입
           ..  `= i++` : 먼저 대입하고, 그 다음에 평가(후에 1을 더함)

  ㅇ 산술 연산자
     -  `+` (덧셈), `-` (뺄셈), `*` (곱셈), `/` (나눗셈), `%` (나머지), `**` (거듭제곱)

     - 例)
        .  0/0            => NaN (계산 불능)
        .  true + true    => 2   (논리값 타입을 1 또는 0으로 바꾸어 계산)
        .  1 + null       => 1   (null을 0으로 바꾸어 계산)
        .  1 + ""         => 1   (빈 문자열 ""인 경우에는, 0으로 바꾸어 계산)
        .  1 + undefinded => NaN (계산 불능, undefined를 NaN으로 간주)
        .  "문자열" + 1   => "문자열1" (문자열 취급 변환) => 문자열 병합 연산자

  ㅇ 문자열 병합 연산자
     -  `+`

  ㅇ 할당/대입 연산자 (assignment operator)
     -  `=`

  ㅇ 산술 대입 연산자 (단축형,축약형,복합형)
     -  `+=` : 例) a += b => a = a + b
     -  `-=` : 例) a -= b => a = a - b 
     -  `*=` : 例) a *= b => a = a * b
     -  `/=` : 例) a /= b => a = a / b
     -  `%=` : 例) a %= b => a = a % b

  ㅇ 그룹 연산자 : `( )`
     - 계산 순서를 명시적으로 우선 지정


2. 비교, 논리, 조건(삼항) 연산자비교 연산자 (8개)
     - (느슨한 비교) :  `==`, `!=`, `>`, `<`, `>=`, `<=` (6개)
     - (엄격한 비교) :  `===` , `!==` (2개)

     * `==`, `===` 비교 ☞ 자바스크립트 논리표현식 평가 참조

  ㅇ 논리 연산자
     * 다른 프로그래밍 언어와 달리, 논리식 평가 결과에 따라, 논리값이 아닌 피연산자를 반환
        . 이후, 해당 피연산자가 필요한 장소에서는, 논리값으로 타입 변환 되므로 정상 동작

     - 논리곱 : `&&`
        . 例) a = b && c => 왼쪽 피연산자(b)가 true이면, 오른쪽 피연산자(c)를 반환, 
           .. (만일, 왼쪽 피연산자(b)가 false이면, 왼쪽 피연산자(b)를 반환)
     - 논리합 : `||`
        . 例) a = b || c => 왼쪽 피연산자(b)가 false이면, 오른쪽 피연산자(c)를 반환, 
           .. (만일, 왼쪽 피연산자(b)가 true이면, 왼쪽 피연산자(b)를 반환)
        . 例) 여러 값 후보 중 null,undefined가 아닌 값 선택할 때 유용
        . 例) 초기값 설정시에도 유용
     - 논리부정 : `!`

     * 例) 
        . age >= 18 && console.log("게임 허용"); // 성인이면, 게임 허용
        . age >= 18 || console.log("게임 불가"); // 미성년이면, 게임 불가

  ㅇ 조건 연산자 (삼항 연산자) : ` ? : `
     -  [조건식] ? [참일 경우 반환값] : [거짓일 경우 반환값] 
        . 조건식이 true이면, 2번째 피연산자를 값으로 반환, false이면 3번째 피연산자 반환


3. 비트 연산자

  ※ 내부적으로, 피연산자2의 보수 형식으로 32 비트 정수로 변환하여 처리

  ㅇ 비트 논리 연산자 :  `& (AND)`, `| (OR)`, `^ (XOR)`, `~ (NOT)`
     - 例) 105 & (-91) 10 = 01101001 AND 10100101 2 = 001100001 2 = 33 10비트 시프트 연산자 
     - `<< (왼쪽 시프트)`
        . 例) (01101001)<<3 => 01001000 (왼쪽으로 3 비트 이동, 오른쪽 빈자리는 0 으로 채움)
     - `>> (부호 있는 오른쪽 시프트)`
        . 例) (10100101)>>3 => 11110100 (오른쪽 3 비트 이동, 왼쪽 빈자리는 부호 비트로 채움)
     - `>>> (부호 없는 오른쪽 시프트)`
        . 例) (10100101)>>3 => 00010100 (오른쪽 3 비트 이동, 왼쪽 빈자리는 0 으로 채움)

  ㅇ 비트 대입 연산자 (단축형) : `&=`, `|=`, `^=`, `<<=`, `>>=`, `>>>=`


4. 자바스크립트 기타 연산자

  ㅇ new 연산자        : 새로운 객체를 생성하며 반환
  ㅇ typeof 연산자     : 데이터 타입을 조사하여 그 결과를 반환 
     - 例) ☞ 자바스크립트 타입 구분 참조
  ㅇ instanceof 연산자 : 객체의 종류를 확인하여 그 종류를 반환
  ㅇ in 연산자         : 객체 내 특정 프로퍼티의 존재 여부를 확인
     - 어떤 프로퍼티객체에 포함되면 true, 미 포함이면 false 반환
        . 例) 프로퍼티명 in 객체명; => 평가 결과에 따라 true 또는 false 반환
  ㅇ void 연산자       : 정의되지 않은 값을 반환
  ㅇ ?. 연산자         : Optional Chaning (ES11,ECMAScript2020 이후)
     - 좌항의 피연산자가, null 또는 undefined 이면, undefined를 반환하고,
     - 그렇지 않으면, 우항의 프로퍼티를 이어가며 처리함


5. 자바스크립트 연산자 우선순위

  ㅇ  1)  ()                               : 결합순서 없음
  ㅇ  2)  . , []                           : 왼쪽 → 오른쪽 결합순서,
         new 인수 있는 경우                : 결합순서 없음
  ㅇ  3)  () 함수호출                      : 왼쪽 → 오른쪽 결합순서,
         new 인수 없는 경우                : 오른쪽 → 왼쪽 결합순서
  ㅇ  4)  ++ (후위증가), -- (후위감소)     : 결합순서 없음
  ㅇ  5)  ! , ~ , + (단항덧셈), - (단항부정), typeof, void, delete, ++ (전위증가),
         -- (전위감소)                     : 오른쪽 → 왼쪽 결합순서
  ㅇ  6)  * , / , %                        : 왼쪽 → 오른쪽 결합순서
  ㅇ  7)  + , - , + (문자열병합)           : 왼쪽 → 오른쪽 결합순서
  ㅇ  8)  << , >> , >>>                    : 왼쪽 → 오른쪽 결합순서
  ㅇ  9)  < , <= , > , >= , in, instanceof : 왼쪽 → 오른쪽 결합순서
  ㅇ 10)  == , != , === , !==              : 왼쪽 → 오른쪽 결합순서
  ㅇ 11)  &                                : 왼쪽 → 오른쪽 결합순서
  ㅇ 12)  ^                                : 왼쪽 → 오른쪽 결합순서
  ㅇ 13)  |                                : 왼쪽 → 오른쪽 결합순서
  ㅇ 14)  &&                               : 왼쪽 → 오른쪽 결합순서
  ㅇ 15)  ||                               : 왼쪽 → 오른쪽 결합순서
  ㅇ 16)  ? :                              : 오른쪽 → 왼쪽 결합순서
  ㅇ 17)  yield, yield*                    : 오른쪽 → 왼쪽 결합순서
  ㅇ 18)  = , += , *= , /= , %= , <<= , >>= , >>>= , 
          &= , ^= , |=                     : 오른쪽 → 왼쪽 결합순서
  ㅇ 19)  ...                              : 결합순서 없음
  ㅇ 20)  ,                                : 왼쪽 → 오른쪽 결합순서


6. 자바스크립트 연산자 부수효과

  ㅇ = (대입연산자), ++ (증가연산자), -- (감소연산자), delete 들은,
     연산 후에 변수 자신의 값을 바꾸는 부수효과가 있게 됨

JS 구문,연산자
   1. JS 구문   2. JS 연산자   3. 분할 대입 연산  


Copyrightⓒ written by 차재복 (Cha Jae Bok)               기술용어해설 후원
"본 웹사이트 내 모든 저작물은 원출처를 밝히는 한 자유롭게 사용(상업화포함) 가능합니다"