[자바스크립트] 기본 연산자와 수학

 

기본 연산자와 수학

• 기본 연산자를 시작으로 자바스크립트에서만 제공하는 연산자를 배워보자.

 

 

'단항', '이항', '피연산자'

피연산자

• 연산을 수행하는 대상
• 5 * 2에는 왼쪽 피연산자 5와 오른쪽 피연산자 2, 총 두 개의 피연산자가 있다.
• 피연산자는 '인수'라는 용어로도 불린다.
• 피연산자를 하나만 받는 연산자는 단항 연산자라고 부른다.
• let x = 1; x = -x; alert( x ); // -1, 단항 마이너스 연산자는 부호를 뒤집습니다.
• 두 개의 연산자는 이항 연산자라고 부른다.

 

 

수학

• 덧셈 연산자 +
• 뺄셈 연산자 -
• 곱셈 연산자 *
• 나눗셈 연산자 /
• 나머지 연산자 %
• 거듭제곱 연산자 **

 

 

이항 연산자 '+'와 문자열 연결

• +로 문자열이 전달되면 문자열을 병합(연결)한다.

let s = "my" + "string";
alert(s); // mystring

 

⚠️ 주의

• 이상 연산자 +를 사용할 때는 피연산자 중 하나가 문자열이면 다른 하나도 문자열로 변환된다는 점을 주의!!

alert( '1' + 2 ); // "12"
alert( 2 + '1' ); // "21"
alert(2 + 2 + '1' ); // '221'이 아니라 '41'이 출력.

• 피연산자 중 어느 하나가 문자열이면 다른 하나도 문자열로 변환된다.

 

뺄셈과 나눗셈에의 상황

alert( 6 - '2' ); // 4, '2'를 숫자로 바꾼 후 연산
alert( '6' / '2' ); // 3, 두 피연산자가 숫자로 바뀐 후 연산

 

 

단항 연산자 +와 숫자형으로의 변환

• 덧셈 연산자 +는 이항 연산자뿐만 아니라 단항 연산자로도 사용할 수 있다.
• 숫자에 단항 덧셈 연산자를 붙이면 변화 없다.
• 그러나 피연산자가 숫자가 아닌 경우엔 숫자형으로의 변환이 일어난다.

// 숫자에는 아무런 영향을 미치지 않는다.
let x = 1;
alert( +x ); // 1

let y = -2;
alert( +y ); // -2

// 숫자형이 아닌 피연산자는 숫자형으로 변화한다.
alert( +true ); // 1
alert( +"" );   // 0

• HTML 폼(form) 필드에서 값을 가져왔는데 그 값이 문자형일 때 숫자로 바꿔줘야 한다.

let apples = "2";
let oranges = "3";

alert( +apples + +oranges ); // 5
// '단항 덧셈 연산자'는 우선순위 17로, '덧셈 연산자'의 우선순위 13보다 높다. 따라서 '단항 덧셈 연산자'가 '덧셈 연산자'보다 먼저 수행되는 것이다.
// 자세한 사항은 연산자 우선순위 참고

 

 

할당 연산자 체이닝 (권장 안 함)

let a, b, c;

a = b = c = 2 + 2;

alert( a ); // 4
alert( b ); // 4
alert( c ); // 4

• 여러 개 연결한 경우, 평가는 우측부터 진행
• 가장 우측의 2+2부터 평가되고 그 뒤 c, b, a에 순차적으로 할당
• 모든 변수가 단일 값을 공유
• but, 가독성을 위해 줄을 나눠 작성할 것

c = 2 + 2;
b = c;
a = c;

 

 

증가·감소 연산자

• 증가(increment) 연산자 ++는 변수를 1 증가(counter++;)
• 감소(decrement) 연산자 --는 변수를 1 감소(counter--;)
• ++와-- 연산자는 변수 앞이나 뒤에 올 수 있다.
  • counter++와 같이 피연산자 뒤에 올 때는, '후위형(postfix form)'
  • ++counter와 같이 피연산자 앞에 올 때는, '전위형(prefix form)'

 

 

비트 연산자

• 비트 AND ( & )
• 비트 OR ( | )
• 비트 XOR ( ^ )
• 비트 NOT ( ~ )
• 왼쪽 시프트(LEFT SHIFT) ( << )
• 오른쪽 시프트(RIGHT SHIFT) ( >> )
• 부호 없는 오른쪽 시프트(ZERO-FILL RIGHT SHIFT) ( >>> )

 

 

쉼표 연산자(권장 안 함)

let a = (1 + 2, 3 + 4);

alert( a ); // 7 (3 + 4의 결과)
// --------------------------------

// 한 줄에서 세 개의 연산이 수행됨
for (a = 1, b = 3, c = a * b; a < 10; a++) {
 ...
}

 

 

📌 참고

• 모던 JavaScript 튜토리얼