연산자는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수연산 등을 수행해 하나의 값을 만든다.
피연산자는 하나의 값으로 평가될수 있는 표현식이어야하고 피연산자와 연산자의 조합으로 이루어진 연산자 표현식도 값으로 평가될 수 있는 표현식이다.
자바스크립트는 개발자의 의도와 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동변환되어 연산되는 경우가 있는데 이를 암묵적 타입 변환 또는 타입 강제 변환 이라고 한다.
또한 대부분의 연산자는 다른 코드에 영향을 주지 않지만 일부 연산자는 다른 코드에 영향을 주는 부수 효과가 있다. 부수 효과가 있는 연산자는 할당 연산자(=), 증가/감소 연산자(++/--), delete연산자가 있다.
연산자와 관련된 내용은 java나 C와 같은 연산의미를 가진 것이 많다.
산술 연산자
산술 연산자는 피연산자의 개수에 따라 이항과 단항 산술 연산자로 구분할 수 있으며 산술 연산이 불가능한 경우 NaN을 반환한다.
이항 산술 연산자
이항 산술 연산자는 2개의 피 연산자를 산술 연산하여 숫자값을 만든다. 이항 산술 연산자는 어떤 산술 연산을 해도 피연산자의 값이 바뀌는 경우는 없으며 언제나 새로운 값을 만든다.
| 이항 산술 연산자 | 의미 |
|---|---|
| + | 덧셈 |
| - | 뺄셈 |
| * | 곱셈 |
| / | 나눗셈 |
| % | 나머지 |
단항 산술 연산자
증가/감소 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이루어지는 부수 효과를 가진다.
| 단항 산술 연산자 | 의미 | 부수 효과 |
|---|---|---|
| ++ | 증가 | ○ |
| -- | 감소 | ○ |
| + | 어떠한 효과 없음 | X |
| - | 양수를 음수로, 음수를 양수로 부호를 반전 | X |
증가/감소 연산자는 위치에 따라 의미가 다르다.
- 피연산자 앞에 위치하는 전위 연산자는 먼저 피연산자의 값을 증가/감소 시킨 후, 다른 연산을 수행한다.
- 피연산자의 뒤에 위치하는 후위 연산자는 먼저 다른 연산을 수행 한 후, 피연산자의 값을 증가/감소 시킨다.
문자열 연결 연산자
+연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.
'1' + 2; //'12'
1 + '2'; //12;할당 연산자
할당문은 변수에 값을 할당하는 부수 효과만 있을 뿐 값으로 평가되지 않을 것처럼 보인다. 하지만 할당문은 값으로 평가되는 표현식인 문으로서 할당된 값으로 평가된다.
| 할당 연산자 | 예 | 동일 표현 | 부수 효과 |
|---|---|---|---|
| = | x = 5 | x = 5 | ○ |
| += | x += 5 | x = x + 5 | ○ |
| -= | x -= 5 | x = x - 5 | ○ |
| *= | x *= 5 | x = x * 5 | ○ |
| /= | x /= 5 | x = x / 5 | ○ |
| %= | x %= 5 | x = x % 5 | ○ |
비교 연산자
비교 연산자의 결과는 불리언 값이 반환되며 보통 if나 for문과 같은 제어문의 조건식에 사용된다.
동등/일치 비교 연산자
| 동등/일치 비교 연산자 | 의미 | 사례 | 설명 |
|---|---|---|---|
| == | 동등 비교 | x == y | x와 y의 값이 같음 |
| === | 일치 비교 | x === y | x와 y의 값과 타입이 같음 |
| != | 부동등 비교 | x != y | x와 y의 값이 다름 |
| !== | 불일치 비교 | x !== y | x와 y의 값과 타입이 다름 |
동등 비교 연산자는 피연산자를 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교하는 특징이 있다. 자바스크립트는 변수의 타입이 명시되지 않기 때문에 일치 비교 연산자를 사용하는 것이 더 좋다.
일치 비교 연산자를 사용하였을 때 NaN은 자신과 일치하지 않는 유일한 값으로 숫자가 NaN인지 확인하려면 Number.isNaN 함수를 사용한다.
대소 관계 비교 연산자
| 대소 관계 비교 연산자 | 예제 | 설명 |
|---|---|---|
| > | x > y | x가 y보다 크다 |
| < | x < y | x가 y보다 작다 |
| >= | x >= y | x가 y보다 크거나 같다 |
| <= | x <= y | x가 y보다 작거나 같다 |
삼항 조건 연산자
삼항 조건 연산자는 조건식의 평가 결과에 따라 반환값을 결정한다.
따라서 삼항 조건자 표현식은 값으로 평가할 수 있는 표현식인 문이다
조건식 ? 조건식이 true일때 반환할 값 : 조건식이 false일때 반환할 값
삼항 조건 연산자의 첫번째 피연산자는 조건식 이므로 삼항 조건 연산자 표현식은 조건문이 된다. 삼항 조건 연산자는 if-else문이랑 유사하지만 삼항 조건 연산자 표현식은 값처럼 사용할 수 있고 if-else문은 값처럼 사용할 수 없다는 특징을 가진다.
논리 연산자
논리 연산자는 피연산자가 불리언 값이 아닐경우 불리언 타입으로 암묵적 타입 변환이 일어난다.
| 논리 연산자 | 의미 |
|---|---|
| || | 논리합(OR) |
| && | 논리곱(AND) |
| ! | 부정(NOT) |
타입 연산자
타입 연산자인 typeof 연산자는 데이터 타입을 문자열로 반환한다. typeof 연산자는 string, number, boolean, undefined, symbol, object, function 중 한가지를 반환하는데 이때 null을 반환하는 경우는 없다. typeof 연산자로 null을 연산하면 object값이 반환되기때문에 값이 null타입인지 확인하기 위해서는 일치연산자인 '==='을 사용해야한다.
지수 연산자
지수 연산자가 없을때는 Math.pow 메서드를 지수계산에 이용했다.
ES7에서 도입된 지수 연산자는 좌항의 피연산자를 밑으로, 우항에 피 연산자를 지수로 거듭제곱하여 숫자값을 반환한다.
2 ** 2 // -> 4
3 ** 3 // -> 81
(-5) ** 2 // -> 25그 외 연산자
| 연산자 | 개요 |
|---|---|
| ?. | 옵셔널 체이닝 연산자 |
| ?? | null 병합 연산자 |
| delete | 프로퍼티 삭제 |
| new | 생성자 함수를 호출할 때 사용하여 인스턴스를 생성 |
| instanceof | 좌변의 객체가 우변의 생성자 함수와 연결된 인스턴스인지 판별 |
| in | 프로퍼티 존재 확인 |
그 외에도 연산자 우선순위와 관련된 자세한 내용은 다음 사이트를 참고하면 된다.
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Operator_Precedence
📔출처
위키북스 - 모던 자바스크립트 Deep Dive
https://wikibook.co.kr/mjs/
