JavaScript 6분 읽기

연산자

NaN을 보게 된다면 산술이 안되는 데이터로 산술 연산을 하진 않았는지 의심해야 하는 것이죠. 예를 들어, 입력으로 받은 숫자가 사실 number타입이 아닌 string타입일 수 있는 것입니다.

연산자

연산자는 표현식을 대상으로 연산을 수행하는 것입니다. 연산의 대상을 피연산자라고 하죠. 연산자에 따라서 피연산자는 한개가 될 수도, 두 개가 될 수도 있습니다.

산술 연산자

피연산자를 대상으로 산술합니다. 즉, 수학적인 계산 수행해 새로운 값을 만드는 것이죠. 산술 연산이 불가능할 경우 NaN을 반환합니다.

NaN을 보게 된다면 산술이 안되는 데이터로 산술 연산을 하진 않았는지 의심해야 하는 것이죠. 예를 들어, 입력으로 받은 숫자가 사실 number타입이 아닌 string타입일 수 있는 것입니다.

// 이항 산술 연산자 ( + - * / % )
1 + 2 // 3
2 - 1 // 1
1 * 2 // 2
4 / 2 // 2
3 / 2 // 1

// 단항 산술 연산자 ( 피연산자가 1개 필요 )
var x = 1;

x++; // 2
x--; // 1
console.log(-x); // -1

// 문자열 연결 연산자 ( + )

'1' + 2 // '12'
1 + 2 // 3

1 + true // 2
1 + false // 1
1 + null // 1

1 + undefined // NaN

증감 연산자 ++ --는 피연산자 앞에 놓이냐 뒤에 놓이냐에 따라 의미가 다릅니다.

  • 앞에 놓이는 경우 : 증가/감소를 수행하고 다른 연산을 수행
  • 뒤에 놓이는 경우 : 다른 연산을 수행하고 증가/감소

여기서 연산은 산술 연산만을 의미하지 않습니다. 변수에 할당하는 것도 할당 연산이죠.

var x = 1;
var result = x++; // x를 할당하고 x 증가 x -> 2

console.log(result); // 1

result = ++x; // x를 증가하고 할당 x -> 3
console.log(result) ; // 3

할당 연산자

할당 연산자는 우변에 있는 피연산자의 결과를 좌변에 있는 변수에 할당합니다.

// 할당 연산자 ( = += -= *= /= %= )
var x = 10;
x += 11; // 21
x -= 11; // 10
x *= 2; // 20
x /= 2; // 10
x %= 3; // 1

비교 연산자

비교 연산자는 두 피연산자를 비교해 그 결과를 불리언 값으로 반환합니다.

동등 비교 연산자

동등 비교 연산자는 ==로 표기합니다.

두 피연산자를 먼저 암묵적 형변환을 통해 타입을 일치시키고 비교하기 때문에 다른 타입의 값이 같다고 결과를 반환할 수 있습니다. 결과를 예측하기 어려워 사용하지 않는 것이 좋겠죠.

1 == 1 // true
1 == 5 // false

1 == '1' // true

부동등 비교 연산자는 !=로 표기합니다. 동작 방식은 동등 비교 연산자와 같고, 두 피연산자가 다른지 확인하여 결과를 반환합니다.

1 != 1; // false
1 != 5; // true

1 != '1'; // false

일치 비교 연산자

일치 비교 연산자는 ===로 표기합니다. 두 피연산자 타입도 같고 값도 같은 경우에만 true를 반환합니다. 자바스크립트에서는 일치 비교 연산자를 사용합니다.

1 === 1 // true
1 === '1' // false

불일치 비교 연산자는 !==로 표기합니다.

1 !== 2; // true
1 !== '1'; // true

대소 관계 비교 연산자

두 피연산자의 크기를 비교하여 불리언 값을 반환합니다.

  • > : 좌변이 우변보다 크다
  • < : 좌변이 우변보다 작다
  • >= : 좌변이 우변보다 크거나 같다
  • <= : 좌변이 우변보다 작거나 같다

삼항 조건 연산자

조건식의 평가 결과에 따라 반환값을 결정합니다.

조건식 ? true인 경우 반환값 : false인 경우 반환값의 형태로 작성하는데, 조건이 길거나 반환값이 길면 혹은 중첩으로 조건을 사용한다면 보기 어렵겠죠? if문을 쓰는 것도 고려해 봐야합니다.

var foo = 0 > 10 ? '0이 10보다 크다' : '0이 10보다 작다'; // '0이 10보다 작다'가 할당

삼항 조건 연산자 표현식은 값을 평가할 수 있는 표현식인 문입니다.

논리 연산자

두 개 혹은 하나의 피연산자를 대상으로 논리 연산을 합니다. 만약 피연산자가 불리언 값이 아니면 암묵적으로 형변환하게 됩니다. 이 방식은 코드를 짧게 만드는데 도움을 주기도 합니다. 논리 연산은 OR, AND, NOT이 있습니다.

OR 는 둘 중 하나라도 참이면 참을 반환하고, 다 거짓이면 거짓을 반환합니다. AND 는 두 값이 모두 참일 때 참을 반환하고, 하나라도 거짓이면 거짓을 반환합니다. NOT 은 피연산자의 값이 참이면 거짓을 반환하고, 거짓이면 참을 반환합니다.

  • || : 논리합(OR)
  • && : 논리곱(AND)
  • ! : 부정(NOT)

연산자 우선순위

수학의 사칙연산과 마찬가지로 프로그래밍에서도 연산자를 연산하는 순서가 있습니다. 여러 개의 연산자로 이뤄진 문에서 연산자의 실행 순서를 결정하는 것입니다.

아래의 표는 비트 연산자를 제외한 연산자 우선순위입니다. 자바스크립트 연산자 우선순위