[JavaScript] 연산자 (operator)

연산자란 프로그래밍에서 특정의 계산을 하기 위해 만들어진 기호들이다. 연산자에는 산술, 관계/비교, 논리, 대입, 복합, 증감연산자 등이 있다.

계산의 우선순위를 갖고있으며 ( ) 연산자로 우선순위를 높일 수 있다.

• 우선순위 순서 : 전위형증감연산자(++a) > 산술 > 관계 > 논리 > 대입 > 복합 > 후위형증감연산자 (a++)
• 단항연산자 > 이항연산자

01. 산술 연산자

이항연산자이며, 계산을 하기위해 사용된다.

• 뺄셈 (-)
• 곱셈 (*)
• 나눗셈 (/)
• 나머지 (%) = mod (modulus)
  • 홀수, 짝수, 배수를 판별할 때 사용한다.
  • 2로 나눠서 나눈 몫이 1이면 홀수, 0이면 짝수
• 숫자의 덧셈, 문자열의 결합 (+)
  • 숫자와 문자의 결합 = 문자
  • 숫자+숫자 일 때만 = 숫자
  • ex)

    console.log('당신의 나이는' + 20+30 + '세입니다');   
    // 당신의 나이는 2030세 입니다.   
    

자동형변환 ( + 제외 )

문자열 결합의 기능이 없는 - * / % 들은 ‘문자화 된 숫자’ (‘100’) 을 자동으로 숫자로 변환하여 계산한다.

var number = 100;
number = number - '50';

console.log(number); // 50 : 자동형변환으로 숫자로 계산됨

강제형변환

‘문자화 된 숫자’의 숫자합의 필요한 경우 Number를 사용한다.

var num1 = '100';
var num2 = '100';

var result = Number(num1) + Number(num2);
console.log(result);

02. 관계 연산자 / 비교 연산자

결과가 true / false 로 처리된다.
조건절로 주로 사용된다.
값은 Boolean 으로 나옴

• 크다 (>)
• 크거나 같다 (>=)
• 작다 (<)
• 작거나 같다 (<=)
• 같다 (==)
• 다르다 (!=)

• 문자일때는 가나다순으로 계산된다.
• 자동형변환
  • ‘문자화 된 숫자’ (‘100’) 을 자동으로 숫자로 변환하여 계산한다.
  • 양쪽 값 중 하나만 숫자여도 계산이 가능하다. 둘다 문자이면 문자열 순서대로 계산된다.

console.log(100 > '50'); //true : 자동형변환으로 숫자로 계산됨
console.log('100' > '50'); //false : 둘다 문자이므로 문자순으로 계산됨

일치 연산자

• 같다 (===): 좌변과 우변의 자료형과 값이 일치함을 나타냄
• 다르다 (!==): 좌변과 우변의 자료형과 값이 불일치함을 나타냄

if (true == 1) {
  console.log('조건에 참입니다.'); // 참, 자료형이 달라도 참
}

if (true === 1) {
  console.log('조건에 참입니다.'); // 거짓, 자료형이 달라서 거짓
}

03. 논리 연산자

일반 논리 연산자와 비트 논리 연산자로 나뉜다

true나 false를 연산하는 연산자.
결과가 true / false로 처리
조건절로 사용된다.

일반 논리 연산자

• 교집합 (&&): 하나라도 거짓이면 거짓, 모두 참이어야 참 (이항연산자)
• 합집합 (||): 모두 거짓일때만 거짓, 하나라도 참이면 참 (이항연산자)
• 여집합 (!): 참은 거짓으로, 거짓은 참으로
  • 단항 연산자는 이항 연산자보다 연산순위가 높다

비트 논리 연산자

• 비트 곱(&): 두 비트 모두 1일 때만 1이고, 하나라도 0이면 0
• 비트 합(|): 두 비트 중 하나라도 1이면 1이고, 모두 0이면 0
• 비트 부정(~): 비트 값이 1이면 0, 0이면 1
• 배타적 비트합(^): 두 비트가 같을 때 0이고, 다를 때 1

var x = 5; // 0101 (2진수로 변환)
var y = 7; // 0111 (2진수로 변환)
var result;

result = (x & y); // 비트곱
document.write("x & y = "+ result +"<br>"); // x & y = 5

result = (x | y); // 비트합
document.write("x | y = "+ result +"<br>"); // x | y = 7

result = (x ^ y); // 배타적 비트합
document.write("x ^ y = "+ result +"<br>"); // x ^ y = 2

result = (~x); // 비트 부정
document.write("~x = "+ result +"<br>"); // ~x = -6

04. 대입 연산자

• 변수 = 값 : 좌측 변수에 우측 값을 넣어준다

05. 복합 연산자

축약해서 사용하는 의미의 문법

• 더한 값을 대입 (+=)
• 뺀 값을 대입 (-=)
• 곱한 값을 대입 (*=)
• 나눈 값을 대입 (/=)
• 나머지 값을 대입 (%=)

a += 100; // a = a + 100;

06. 증감 연산자

단항연산자

• 증가연산자 (++): 해당 변수의 값을 1씩 증가 a++; ++a;
• 감소연산자 (--): 해당 변수의 값을 1씩 감소 a--; --a;

우선순위

• 후위형 (a++;): 우선순위가 가장 낮다
• 전위형 (++a;): 우선순위가 가장 높다

a++; // a+=1; a=a+1;

증감연산자 연습 문제

var x = 5;
var y = 10;
var z = (x++) + (++x) + (y++);
// z = 5 + 7 + 10 = 22

var a = 5;
var i = (a++) * (++a)
// i = 5 * 7 = 35

var b = 5;
var j = (b++) * (++b) * (++b)
// j = 5 * 7 * 8 = 280

var c = 5;
var k = (++c) + (++c) + (c++) + (++c)
// k = 6 + 7 + 7 + 9 = 29

var a = 2;
var b = 3;
var c = 9;
var r1, r2, r3;
r1 = ++a + ++b;
// 7 = 3 + 4
r2 = c++;
// r2 = 9
r3 = b-- - ++a + ++a + b--;
// r3 = 4 - 4 + 5 + 3 = 8