#19 자바스크립트 연산자 종류

1. 산술 연산자(arithmetic operator)

산술 연산자는 사칙연산을 다루는 가장 기본적이면서도 많이 사용하는 연산자입니다.

산술 연산자는 모두 두 개의 피연산자를 가지는 이항 연산자이며, 피연산자들의 결합 방향은 왼쪽에서 오른쪽입니다.

+	왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 더함.
-	왼쪽 피연산자의 값에서 오른쪽 피연산자의 값을 뺌.
*	왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 곱함.
/	왼쪽 피연산자의 값을 오른쪽 피연산자의 값으로 나눔.
%	왼쪽 피연산자의 값을 오른쪽 피연산자의 값으로 나눈 후, 그 나머지를 반환함.

 

예시)

+	x + y	덧셈
-	x - y	뺄셈
*	x * y	곱셈
/	x / y	나눗셈

 

2. 대입 연산자(assignment operator)

대입 연산자는 변수에 값을 대입할 때 사용하는 이항 연산자이며, 피연산자들의 결합 방향은 오른쪽에서 왼쪽입니다.

또한, 앞서 살펴본 산술 연산자와 결합한 다양한 복합 대입 연산자가 존재합니다.

=	왼쪽 피연산자에 오른쪽 피연산자의 값을 대입함.
+=	왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 더한 후, 그 결괏값을 왼쪽 피연산자에 대입함.
-=	왼쪽 피연산자의 값에서 오른쪽 피연산자의 값을 뺀 후, 그 결괏값을 왼쪽 피연산자에 대입함.
*=	왼쪽 피연산자의 값에 오른쪽 피연산자의 값을 곱한 후, 그 결괏값을 왼쪽 피연산자에 대입함.
/=	왼쪽 피연산자의 값을 오른쪽 피연산자의 값으로 나눈 후, 그 결괏값을 왼쪽 피연산자에 대입함.
%=	왼쪽 피연산자의 값을 오른쪽 피연산자의 값으로 나눈 후, 그 나머지를 왼쪽 피연산자에 대입함.

예시)

=	오른쪽의 값을 왼쪽에 대입합니다.	a = a + 1;
+=	오른쪽의 값을 더해주면서 왼쪽에 대입합니다.	a += 1;
-=	오른쪽의 값을 빼주면서 왼쪽에 대입합니다.	a -= 1;
*=	오른쪽의 값을 곱해주면서 왼쪽에 대입합니다.	a *= 1;

 

3. 증감 연산자(increment and decrement operator)

증감 연산자는 피연산자를 1씩 증가 혹은 감소시킬 때 사용하는 연산자입니다.

이 연산자는 피연산자가 단 하나뿐인 단항 연산자입니다.

증감 연산자는 해당 연산자가 피연산자의 어느 쪽에 위치하는가에 따라 연산의 순서 및 결과가 달라집니다.

++x	먼저 피연산자의 값을 1 증가시킨 후에 해당 연산을 진행함.
x++	먼저 해당 연산을 수행하고 나서, 피연산자의 값을 1 증가시킴.
--x	먼저 피연산자의 값을 1 감소시킨 후에 해당 연산을 진행함.
x--	먼저 해당 연산을 수행하고 나서, 피연산자의 값을 1 감소시킴.

예시)

--i	int i = 3; 일 때 printf("%d", --i);	--i = 2 (i = 2)
i--	int i = 3; 일 때 printf("%d", i--);	i-- = 3 (i = 2)

 

4. 비교 연산자(comparison operator)

비교 연산자는 피연산자 사이의 상대적인 크기를 판단하여, 참(true)과 거짓(false)을 반환합니다.

비교 연산자는 모두 두 개의 피연산자를 가지는 이항 연산자이며, 피연산자들의 결합 방향은 왼쪽에서 오른쪽입니다.

==	왼쪽 피연산자와 오른쪽 피연산자의 값이 같으면 참을 반환함.
===	왼쪽 피연산자와 오른쪽 피연산자의 값이 같고, 같은 타입이면 참을 반환함.
!=	왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않으면 참을 반환함.
!==	왼쪽 피연산자와 오른쪽 피연산자의 값이 같지 않거나, 타입이 다르면 참을 반환함.
>	왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크면 참을 반환함.
>=	왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 크거나 같으면 참을 반환함.
<	왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작으면 참을 반환함.
<=	왼쪽 피연산자의 값이 오른쪽 피연산자의 값보다 작거나 같으면 참을 반환함.

예시)

==	같다	a == b
!=	같지 않다	a != b
>	좌측값이 더 크다	a > b
>=	좌측값이 더 크거나 같다	a >= b

 

5. 논리 연산자(logical operator)

논리 연산자는 주어진 논리식을 판단하여, 참(true)과 거짓(false)을 반환합니다.

&& 연산자와 || 연산자는 두 개의 피연산자를 가지는 이항 연산자이며, 피연산자들의 결합 방향은 왼쪽에서 오른쪽입니다.

! 연산자는 피연산자가 단 하나뿐인 단항 연산자이며, 피연산자의 결합 방향은 오른쪽에서 왼쪽입니다.

&&	논리식이 모두 참이면 참을 반환함. (논리 AND 연산)
||	논리식 중에서 하나라도 참이면 참을 반환함. (논리 OR 연산)
!	논리식의 결과가 참이면 거짓을, 거짓이면 참을 반환함. (논리 NOT 연산)

 

예시)

&&	논리 AND	a && b	a가 참이고, b도 참이면, a && b는 참
||	논리 OR	a || b	a가 참이거나 b가 참이면, a || b는 참
!	논리 NOT	!x	a가 참이면 !a는 거짓, a가 거짓이면 !a는 참

  var a = true , b = false;
  document.write(a && b); // 결과 : false (논리 AND 연산)
  document.write(a || b); // 결과 : true  (논리 OR  연산)

  document.write(!a); // 결과 : false (논리 NOT  연산)

  document.write(!b); // 결과 : true  (논리 NOT  연산)

 

 

6. 비트 연산자(bitwise operator)

비트 연산자는 논리 연산자와 비슷하지만, 비트(bit) 단위로 논리 연산을 수행합니다.

즉, 2진수(binary)를 연산할 때 사용하는 연산자입니다.

또한, 비트 단위로 전체 비트를 왼쪽이나 오른쪽으로 이동시킬 때도 사용합니다.

&	대응되는 비트가 모두 1이면 1을 반환함. (비트 AND 연산)
|	대응되는 비트 중에서 하나라도 1이면 1을 반환함. (비트 OR 연산)
^	대응되는 비트가 서로 다르면 1을 반환함. (비트 XOR 연산)
~	비트를 1이면 0으로, 0이면 1로 반전시킴. (비트 NOT 연산)
<<	지정한 수만큼 비트를 전부 왼쪽으로 이동시킴. (left shift 연산)
>>	부호를 유지하면서 지정한 수만큼 비트를 전부 오른쪽으로 이동시킴. (right shift 연산)
>>>	지정한 수만큼 비트를 전부 오른쪽으로 이동시키며, 새로운 비트는 전부 0이 됨.

 

예시)

x << y	정수 x의 각 비트를 y만큼 왼쪽으로 이동시킵니다. (빈자리는 0으로 채워집니다.)
x >> y	정수 x의 각 비트를 y만큼 오른쪽으로 이동시킵니다. (빈자리는 정수 a의 최상위 부호비트와 같은 값으로 채워집니다.)
x >>> y	정수 x의 각 비트를 y만큼 오른쪽으로 이동시킵니다. (빈자리는 0으로 채워집니다.)

비트 이동 연산자는 정수 데이터의 비트를 왼쪽 또는 오른쪽으로 이동시키는 연산을 합니다.

 

 

&	AND	두 비트 모두 1일 경우에만 연산 결과가 1
|	OR	두 비트 중 하나만 1일 경우에만 연산결과가 1
^	XOR	두 비트중 하나는 1이고 다른 하나가 0일경우에만 연산결과가 1
~	NOT	비트 반전(보수)

 

비트 논리 연산자는 그 대상이 boolean타입일 경우에는 일반 논리 연산자로 활용되지만 대상이 정수형일 경우에는 위의 표와 같이 비트 논리연산자로 활용됩니다. 비트 연산은 두 값을 비트 단위로 나열한 뒤 각 자릿수를 비트 연산자로 연산합니다. 각 자릿수의 연산은 독립적이며 다른 자릿수에 영향을 주지 않습니다. 

 

 

 

예) 십진법으로 표기한 정수 80을 이진법 표기로 변환하면 

128	64	32	16	8	4	2	1
0	1	0	1	0	0	0	0

1010000B

64 + 16 = 80

 

1010000B 가 되는데, 이 이진법으로 변환된 값을 기준으로 연산을 수행하는 연산자가 비트 연산자입니다.

이하 별도의 표기법이 없는 경우는 전부 십진법 숫자이며, 이진법은 (이진법: 숫자) 또는 숫자 뒤에 B가 붙어 있습니다.

 

 

 

 

◆ AND( & ) 연산

AND 연산은 두 개의 숫자(값이)를 각 비트마다 AND 연산합니다. AND 연산은 곱연산으로 두 비트가 모두 1일 경우에만 1를 반환하며, 두 비트 중 하나라도 0이라면 0를 반환합니다.

연산 예시)

1 & 1 = 1

1 & 0 = 0

0 & 1 = 0

0 & 0 = 0

 

80(1010000B)과 68(1000100B)의 AND 연산을 수행해 보겠습니다.

 

document.write(80 & 68); // 결과 64 (1000000B)

 

AND(&) 연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	68	1	0	0	0	1	0	0
결과 값	64	1	0	0	0	0	0	0

 

 

 

◆ OR ( | ) 연산

OR 연산은 두 개의 숫자를 각 비트마다 OR 연산합니다. OR 연산은 합연산으로 두 비트 중 하나라도 1일 경우에는 1를 반환하며, 두 비트가 모두 0인 경우에만 0를 반환합니다.

연산 예시)

1 | 1 = 1

1 | 0 = 1

0 | 1 = 1

0 | 0 = 0

 

80(1010000B)과 68(1000100B)의 OR 연산을 수행해 보겠습니다.

document.write(80 & 68); // 결과 84 (1010100B)

 

OR(|) 연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	68	1	0	0	0	1	0	0
결과 값	84	1	0	1	0	1	0	0

 

 

 

 

 

◆ XOR( ^ ) 연산  (Exclusive OR)

두 비트의 값이 같은 경우 0를 반환하며, 두 비트값이 다른 경우에는 1를 반환합니다.

참고로 두 값을 더한 뒤 mod(%) 2를 했을때의 값과 동일합니다.

연산 예시)

1 ^ 1 = 0

1 ^ 0 = 1

0 ^ 1 = 1

0 ^ 0 = 0

 

80(1010000B)과 68(1000100B)의 XOR 연산을 수행해 보겠습니다.

document.write(80 ^ 68); // 결과 20 (10100B)

 

XOR(^) 연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	68	1	0	0	0	1	0	0
결과 값	20	0	0	1	0	1	0	0

 

 

 

 

◆ NOT( ~ ) 연산 (Bitwise NOT)

NOT 연산은 1을 0으로, 0을 1로 반전시킵니다.

자바스크립트 내에서 음수의 비트 표기법에 의해 NOT 연산자를 수행하면 해당 양수/음수 부호와 반대되는 값이 나옵니다.

const a = 5;     // 00000000000000000000000000000101
const b = -3;    // 11111111111111111111111111111101
  
document.write(~a);   // 11111111111111111111111111111010 (결과:-6) 
document.write(~b);   // 00000000000000000000000000000010 (결과: 2) 

 

 

 

 

 

◆왼쪽(<<) / 오른쪽(>>) SHIFT 연산

왼쪽 SHIFT (<<) 연산자는 모든 비트를 왼쪽으로 x 칸씩 이동시킵니다. 이동 범위를 초과하는 값은 버려지고, 새로 생긴 빈 칸은 0으로 채워집니다.

 

아래 코드는 80(1010000B)의 모든 비트를 왼쪽으로 2칸씩 이동하라는 의미로, 결과는 320(101000000B)이 나옵니다. 왼쪽으로 2칸씩 이동하면서 새로 생긴 끝의 2자리는 0으로 채워집니다.

 

document.write(80 << 2); // 결과 320 (101000000B)

 

SHIFT (<<)연산	십진수	256	128	64	32	16	8	4	2	1
연산 값	80	0	0	1	0	1	0	0	0	0
결과 값	320	1	0	1	0	0	0	0	0	0

 

오른쪽 SHIFT (>>) 연산자는 모든 비트를 오른쪽으로 x 칸씩 이동시킵니다. 이동 범위를 초과하는 부분은 버려집니다.

아래 코드는 80(1010000B)의 모든 비트를 오른쪽으로 2칸씩 이동하라는 의미로, 결과는 20(10100B)이 나옵니다. 오른쪽으로 2칸씩 이동하면서 맨 끝자리 2개의 비트는 버려집니다.

 

document.write(80 >> 2); // 결과 20 (10100B)

 

SHIFT (>>)연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
결과 값	20	0	0	1	0	1	0	0

 

 

 

 

◆오른쪽 (>>>)  지정한 수만큼 비트를 전부 오른쪽으로 이동시키며, 새로운 비트는 전부 0이 됨.

 

document.write(80 >>> 1); // 결과 40 (0101000B)

 

(>>>)연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	1 만큼 비트를 전부 오른쪽으로 이동 즉, 도표로로 보면 전체가 오른쪽으로 1칸 이동된 것과 같다.
결과 값	40	0	1	0	1	0	0	0

 

document.write(80 >>> 2); // 결과 20 (0010100B) 

(>>>)연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	2 만큼 비트를 전부 오른쪽으로 이동 즉, 도표로로 보면 전체가 오른쪽으로 2칸 이동된 것과 같다.
결과 값	20	0	0	1	0	1	0	0

 

document.write(80 >>> 3); // 결과 30 (0001010B) 

(>>>)연산	십진수	64	32	16	8	4	2	1
연산 값	80	1	0	1	0	0	0	0
	3 만큼 비트를 전부 오른쪽으로 이동 즉, 도표로로 보면 전체가 오른쪽으로 2칸 이동된 것과 같다.
결과 값	10	0	0	0	1	0	1	0

 

 

 

 

7. 문자열 결합 연산자

var x = 1 + 1;                    // 피연산자가 둘 다 숫자이면 덧셈 연산을 수행함.

var y = "안녕" + "하세요?"   // 피연산자가 둘 다 문자열이면 문자열 결합 연산을 수행함.

var z = 1 + "월"                  // 피연산자가 하나라도 문자열이면 문자열 결합 연산을 수행함.