LHJ

I'm a FE developer.

5.3 연산자 우선순위

21 Apr 2020 » js_lj

모든 표현식은 값이 된다는 걸 이해했으면, 그 다음은 연산자 우선순위를 이해해야 합니다.
연산자 우선순위를 이해해야 자바스크립트 프로그램이 어떻게 동작하는지 이해할 수 있습니다.

산술 연산자를 설명했으니 자바스크립트의 여러 연산자에 대한 설명을 잠시 멈추고 연산자 우선순위에 대해 생각해 봅시다.
초등 교육을 받았다면 연산자 우선순위에 대해 배웠을 겁니다.

다음 문제는 어렵지 않게 풀 수 있을 겁니다.

8 / 2 + 3 x (4 x 2 - 1)

25라고 답했으면 연산자 우선순위를 정확히 적용한 겁니다.
괄호가 제일 먼저고, 그 다음에 곱셈과 나눗셈을 하고, 마지막으로 덧셈과 뺄셈을 합니다.

자바스크립트는 표현식을 평가할 때도 비슷한 규칙을 적용합니다.
산수에만 쓰는 것은 아닙니다.
자바스크립트에서 표현식을 평가하는 순서도 초등학교에서 배웠던 것과 같습니다.

물론 자바스크립트에는 연산자가 훨씬 더 많으니 기억할 것이 늘어나기는 합니다.
다행히, 산수와 마찬가지로 괄호가 최우선입니다.
표현식 순서가 잘 기억나지 않으면, 가장 먼저 이루어져야 하는 순서대로 괄호를 쓰면 그대로 이루어질 겁니다.

현재 자바스크립트에는 56개의 연산자가 있고, 우선순위를 기준으로 19개의 그룹으로 묶을 수 있습니다.
연산자의 우선순위가 높을수록 먼저 실행됩니다.
부록 B에 연산자 우선순위 테이블이 있습니다.
필자는 이 테이블을 몇 해에 걸쳐 자연스럽게 기억하게 됐지만, 여전히 가끔 찾아보면서 기억을 되살리기도 하고, 새로운 기능을 배우게 되면 어떤 우선순위가 적용되는지 찾아보기도 합니다.

우선순위가 같은 연산자들은 오른쪽에서 왼쪽으로 또는 왼쪽에서 오른쪽으로 평가합니다.
예를 들어 곱셈과 나눗셈의 우선순위는 둘 다 14이고, 이들은 왼쪽에서 오른쪽으로 평가합니다.
곱셈과 나눗셈이 끝나면 우선순위가 3인 할당 연산자를, 오른쪽에서 왼쪽으로 평가하는 식입니다.
이 내용을 염두에 두고 다음 예제의 순서를 생각해 봅시다.

let x = 3, y;
x += y = 6*5/2;
// 이 표현식을 우선순위에 따라 다음에 일어날 행동에 괄호를 치겠습니다.
//
// 곱셈과 나눗셈, 우선순위 14, 왼쪽에서 오른쪽으로
// x += y = (6*5)/2
// x += y = (30)/2
// x += y = 15
// 할당, 우선순위 3, 오른쪽에서 왼쪽으로
// x += (y = 15)
// x += 15    y는 이제 15입니다.
// 18    x는 이제 18입니다.

연산자 우선순위를 이해하는 게 처음에는 벅차 보이겠지만, 곧 숨을 쉬듯 자연스러워질 겁니다.