[ Java Script ] 연산자 우선순위 & 할당 & 증가/감소 연산자

📌 연산자 우선순위

하나의 표현식에 둘 이상의 연산자가 있는 경우, 실행 순서는 연산자의 우선순위 ( precedence ) 에 의해 결정된다.

 

1 + 2 * 2 라는 식이 있을 때 곱셈이 먼저, 그 후에 덧셈이 일어난다.

이런 개념이 연산자 우선순위이다. 여기서 곱셈은 덧셈보다 더 높은 우선순위를 가진다.

 

자바스크립트에서 정의한 연산자 우선순위가 마음에 들지 않는다면, 괄호를 사용하면 된다.

 

- 괄호

: 모든 연산자보다 우선순위가 높기 때문에 자바스크립트에서 정의한 연산자 우선순위를 무력화시킨다.

 

자바스크립트의 연산자엔 우선순위가 매겨져 있다.

우선순위 숫자가 클수록 먼저 실행된다. 순위가 같으면 왼쪽부터 시작해서 오른쪽으로 연산이 수행된다.

 

순위	연산자 이름	기호
17	단항 덧셈	+
17	단항 부정	-
16	지수	**
15	곱셈	*
15	나눗셈	/
13	덧셈	+
13	뺄셈	-
3	할당	=

https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Operator_Precedence

'단항 덧셈 연산자'는 우선순위 17 로 '이항 덧셈 연산자' 의 우선순위 13 보다 높다.

표현식 " +apples + +oranges " 에서 단항 덧셈 연산자가 덧셈보다 먼저 수행되는 이유가 바로 이 때문이다.

---

📌 할당 연산자

무언가를 할당할 때 쓰이는 = 도 연산자이다.

이 연산자는 할당 ( assignment ) 연산자라고 불리는데, 우선순위는 3 으로 아주 낮다.

x = 2 * 2 + 1 과 같은 표현식에서 계산이 먼저 이뤄지고, 그 결과가 x 에 해당되는 이유가 바로 이 때문이다.

let x = 2 * 2 + 1;

alert ( x ); // 5

 

🤍 복합 할당 연산자

변수에 연산자를 적용하고 그 결과를 같은 변수에 저장해야하는 경우가 종종 생긴다.

let n = 2;
n = n + 5;
n = n * 2;

+= 와  *= 연산자를 사용하면 짧은 문법으로 동일한 연산을 수행할 수 있다.

let n = 2;
n += 5; // n은 7이 된다. (n = n + 5와 동일).
n *= 2; // n은 14가 된다. (n = n * 2와 동일).

alert( n ); // 14

이런 ' 복합 할당 ' 연산자는 산술 연산자와 비트 연산자에도 적용할 수 있다. /=, -= 등의 연산자를 만들 수 있다.

복합 할당 연산자의 우선순위는 할당 연산자와 동일하다. 

따라서 대부분 다른 연산자가 실행된 후에 복합 할당 연산자가 실행된다.

let n = 2;

n *= 3 + 5;

alert( n ); // 16  (*=의 우측이 먼저 평가되므로, 위 식은 n *= 8과 동일하다.)

---

📌 증가 & 감소 연산자

숫자를 하나 늘리거나 줄이는 것은 자주 사용되는 연산이다.

 

🤍 증가 연산자 

: ++ 는 변수를 1 증가시킨다.

let counter = 2;
counter++;      // counter = counter + 1과 동일하게 동작한다. 하지만 식은 더 짧다.
alert( counter ); // 3

🤍 감소 연산자

: -- 는 변수를 1 감소시킨다.

let counter = 2;
counter--;      // counter = counter - 1과 동일하게 동작한다. 하지만 식은 더 짧다.
alert( counter ); // 1

✍ 증가 & 감소 연산자는 변수에만 쓸 수 있다.  5++ 와 같이 값에 사용하려고 하면 에러가 발생한다.

 

✍ ++ 와  -- 연산자는 변수 앞이나 뒤에 올 수 있다.

- counter++

: 피연산자 뒤에 올 때는, ' 후위형 ( postfix form ) ' 이라고 부른다.

  후위형은 증가 & 감소 전의 기존 값을 반환한다.

 

- ++counter

: 피연산자 앞에 올 때는, ' 전위형 ( prefix form ) ' 이라고 부른다.

  전위형은 증가 & 감소 후의 새로운 값을 반환한다.

 

후위형과 전위형은 피연산자인 counter 을 1 만큼 증가시켜 준다는 점에서 동일한 일을 한다.

두 형의 차이는 ++ / -- 의 반환 값을 사용할 때 나타난다.

 

let counter = 1;
let a = ++counter; // (*)

alert(a); // 2

( * ) 로 표시한 줄의 전위형 ++counter 는 counter 를 증가시키고 새로운 값 2 를 반환한다.

따라서 alert 는 2 를 표시한다.

 

let counter = 1;
let a = counter++; // (*) ++counter를 counter++로 바꿈

alert(a); // 1

( * ) 로 표시한 줄의 후위형 counter++ 는 counter 를 증가시키긴 하지만, 증가 전의 기존 값을 반환한다.

따라서 alert 는 1 을 표시한다.

 

< 증가 & 감소 연산자 내용 정리 >

∎ 반환 값을 사용하지 않는 경우라면, 전위형과 후위형엔 차이가 없다.

let counter = 0;
counter++;
++counter;
alert( counter ); // 2, 위 두 라인은 동일한 연산을 수행한다.

// 반환값을 사용하지 않기 때문에 각각 1씩 더해지기 때문이다.

∎ 값을 증가시키고 난 후, 증가한 값을 바로 사용하려면 전위형 증가 연산자를 사용한다.

let counter = 0;
alert( ++counter ); // 1

∎ 값을 증가시키지만, 증가 전의 기존값을 사용하려면 후위형 증가 연산자를 사용한다.

let counter = 0;
alert( counter++ ); // 0

 

✍ 다른 연산자 사이의 증가 & 감소 연산자

++ / -- 연산자를 표현식 중간에 사용하는 것도 가능하다.

이때, 증가 & 감소 연산자의 우선순위는 다른 대부분의 산술 연산자보다 높기 때문에, 평가가 먼저 이뤄진다.

let counter = 1;
alert( 2 * ++counter ); // 4

let counter = 1;
alert( 2 * counter++ ); // counter++는 '기존'값을 반환하기 때문에 2가 출력된다.

한 줄에서 여러가지 일을 동시에 처리하기 때문에 코드의 가독성이 떨어진다.

' 코드 한 줄엔, 특정 동작 하나 ' 에 관련된 내용만 작성하는게 좋다.

let counter = 1;
alert( 2 * counter );
counter++; // 2

---

01. 연산자 우선순위 & 할당 & 증가/감소 연산자 설명

      https://ko.javascript.info/

기본 연산자와 수학