연산자

어떤 연산을 처리하는 데 사용하도록 미리 정의된 기호를 자바스크립트에서는 연산자(operator)라고 합니다.
대표적으로는 = 연산자가 있으며 이 기호는 데이터를 할당하는 연산을 수행하기 때문에 할당 연산자라고 합니다.

산술 연산자

산술 연산자는 덧셈, 뺄셈, 곱셈, 나눗셈과 같은 수학 연산을 수행하는 연산자를 말합니다.
자바스크립트에서 사용할 수 있는 산술 연산자는 다음 세 가지로 분류할 수 있습니다.

• 이항 산술 연산자 (피연산자 2개)
• 단항 산술 연산자 (피연산자 1개)
• 단항 부정 연산자 (부호 반전)

이항 산술 연산자

이항 산술 연산자는 연산을 수행하는 데 피연산자가 2개 필요한 연산자입니다.
두 개의 값을 가지고 연산을 수행합니다.

연산자	설명	예시	결과
+	덧셈	10 + 3	13
-	뺄셈	10 -3	7
*	곱셈	10 * 3	30
/	나눗셈	10 / 2	5
%	나머지	10 % 3	1

• + 연산자는 숫자형끼리는 덧셈, 문자열과 함께 사용하면 문자열 연결을 수행합니다.

단항 산술 연산자 (증감 연산자)

단항 산술 연산자는 연산을 수행하는 데 피연산자가 1개만 필요한 연산자를 의미합니다.
++ 연산자는 값을 1 증가시키고, -- 연산자는 값을 1 감소시킵니다. 두 연산자를 합쳐서 증감 연산자(증가/감소 연산자)라고 하기도 합니다.

연산 방식은 단항 산술 연산자를 앞에 사용했는지, 뒤에 사용했는지에 따라 결과가 달라집니다.

• 전치 연산은 항상 ~하기 전에 증감합니다. 변수에 값을 할당하기 전에 1부터 증가시킵니다.
• 후치 연산은 ~한 후에 증가합니다. 그래서 변수에 대입할 때 후치 연산을 사용한다면 값을 먼저 할당한 후에 증감 연산을 합니다.

구분	예시	실행 순서	설명
전치	++x	1 증가 → 반환	먼저 증가
후치	x++	반환 → 1 증가	나중에 증가

단항 부정 연산자

단항 부정 연산자는 항상 피연산자 앞에 위치하며 피연산자의 부호를 부정(부호를 반전)하는 연산을 수행합니다.
쉽게 말해, 음수는 양수로 변환하고 양수는 음수로 변환하는 연산을 수행합니다. 따라서 숫자형 데이터가 할당된 변수에만 사용할 수 있습니다.

연산자	설명	예시	결과
-	부호 반전 (부정)	-5, -(-3)	-5, 3

• 단항 부정 연산자는 숫자형에만 사용해야 합니다. 문자열이나 다른 자료형에는 NaN이 나올 수 있습니다.

console.log(-"3");    // -3 (문자열이 숫자로 암시적 변환)
console.log(-"abc");  // NaN

대입 연산자와 복합 대입 연산자

대입 연산자는 데이터를 대입(할당)하는 연산을 수행하는 연산자를 말합니다.
복합 대입 연산자는 산술 연산자와 대입 연산자를 함께 사용해 산술과 할당을 한 번에 수행하는 연산자를 말합니다.

비교 연산자

비교 연산자는 피연산자를 비교한 뒤, 논리형 값인 참(true), 거짓(false)을 반환하는 연산을 수행합니다.

논리 연산자

논리 연산자는 피연산자를 논리적으로 평가한 뒤, 조건에 맞는 피연산자를 반환하는 연산을 수행합니다.

거짓으로 평가되는 값 (Falsy)

자바스크립트에서 다음 값들은 Boolean 변환 시 false로 간주됩니다.

• ""(빈 문자열)
• 0
• Nan
• null
• undefined
• false

나머지 값들은 모두 true로 간주됩니다.

삼항 연산자

삼항 연산자는 세 항 중 가장 왼쪽에 있는 피연산자의 참, 거짓에 따라 나머지 두 항에 있는 피연산자를 선택적으로 반환하는 연산을 수행합니다.

삼항 연산자는 세 항으로 이루어져 있으며, 조건식이 참인지 거짓인지에 따라 실행 결과를 선택적으로 반환합니다.

형식

조건식 ? 참일 때 실행할 값 : 거짓일 때 실행할 값

• 삼항 연산자를 사용하면 조건문(if - else)을 사용하지 않아도 간단한 조건식을 처리할 수 있습니다.

예시: 숫자가 짝수인지 홀수인지 판별

let num = 7;
let result = (num % 2 === 0) ? "짝수" : "홀수";
console.log(result); // "홀수"

예시: 로그인 상태에 따른 화면 메시지

let isLoggedIn = true;
let message = isLoggedIn ? "환영합니다!" : "로그인이 필요합니다.";
console.log(message); // "환영합니다!"

예시: 기본값 설정 (널 병합 대안)

let username = "";
let displayName = username ? username : "Guest";
console.log(displayName); // "Guest"

형 변환

형 변환은 데이터의 자료형이 다른 자료형으로 바뀌는 것을 말합니다.
자바스크립트에는 크게 암시적 형 변환(자동 변환)과 명시적 형 변환(강제 변환)이 있습니다.

암시적 형 변환

암시적 형 변환은 사용자가 형 변환을 의도하지 않았지만, 자바스크립트에서 자동으로 형을 바꿔주는 것을 말합니다.

예시

let result1 = "5" + 3;    // 문자열 + 숫자 → 문자열 "53"
let result2 = "5" - 3;    // 문자열 - 숫자 → 숫자 2
let result3 = "10" * "2"; // 문자열끼리 곱셈 → 숫자 20
let result4 = 0 == false; // 숫자 0과 불린 false 비교 → true

• + 연산자는 문자열이 하나라도 있으면 문자열로 변환
• 산술 연산자는 문자열이 숫자로 해석되면 숫자형으로 변환
• == 연산자는 자료형을 맞춘 후 비교함

주의

console.log(null == undefined); // true
console.log(null == 0);         // false

• 위의 예시처럼, 암시적 형 변환은 예상치 못한 결과를 유발할 수 있으므로, 비교 시에는 항상 ===(일치 연산자)를 사용하는 것이 안전합니다.

명시적 형 변환

명시적 형 변환은 개발자가 의도적으로 형을 변환하는 것입니다.

예시: 문자열로 변환

let num = 100;
console.log(String(num));   // "100"
console.log(num.toString()); // "100"

예시: 숫자로 변환

console.log(Number("123"));   // 123
console.log(Number("3.14"));  // 3.14
console.log(Number("hello")); // NaN

예시: 불린으로 변환

console.log(Boolean(1));     // true
console.log(Boolean(0));     // false
console.log(Boolean(""));    // false
console.log(Boolean("hi"));  // true