데이터를 가공하고 논리를 판단하는 도구인 **연산자(Operators)**에 대해 알아보겠습니다.
연산자는 변수에 담긴 자료들을 계산하거나 비교하여 새로운 값을 만들어내는 역할을 합니다.
1. 산술 연산자 (Arithmetic Operators)
숫자 데이터를 가지고 기본적인 수학 계산을 수행합니다.
- + (더하기), - (빼기), * (곱하기), / (나누기)
- % (나머지): 나눗셈 후 남은 값을 구합니다. (홀수/짝수 판별 시 자주 사용)
- ** (거듭제곱): 숫자를 제곱합니다. (예: 2 ** 3은 8)
2. 대입 연산자 (Assignment Operators)
변수에 값을 저장하거나, 기존 값에 계산된 결과를 다시 저장할 때 사용합니다.
- =: 오른쪽 값을 왼쪽 변수에 대입합니다.
- +=, -=, *=, /=: 산술 연산과 대입을 한 번에 수행합니다. (예: a += 5는 a = a + 5와 같음)
3. 비교 연산자 (Comparison Operators)
두 값을 비교하여 참(true) 또는 거짓(false)을 반환합니다.
- == / !=: 값이 같은지/다른지 비교합니다. (자료형은 따지지 않음)
- === / !==: 값과 자료형이 모두 같은지/다른지 엄격하게 비교합니다. (권장 방식)
- > / < / >= / <=: 크기를 비교합니다.
4. 논리 연산자 (Logical Operators)
여러 조건을 결합하거나 조건을 반전시킬 때 사용합니다.
- && (AND): 모든 조건이 참일 때만 참을 반환합니다.
- || (OR): 조건 중 하나라도 참이면 참을 반환합니다.
- ! (NOT): 참을 거짓으로, 거짓을 참으로 뒤집습니다.
🖥️ 실전 예제 코드: "연산자 종합 선물세트"
JavaScript
// 1. 산술 및 대입 연산
let score = 10;
score += 5; // score는 15
console.log(score % 2); // 1 (나머지 연산으로 홀수임을 확인)
// 2. 비교 연산 (엄격한 비교)
console.log(10 == "10"); // true (값만 같으면 됨)
console.log(10 === "10"); // false (자료형이 다름: 숫자 vs 문자열)
// 3. 논리 연산
let isAdult = true;
let hasTicket = false;
// 성인이고 티켓도 있어야 입장 가능
console.log(isAdult && hasTicket); // false
// 성인이거나 티켓이 있으면 입장 가능
console.log(isAdult || hasTicket); // true
학습 정리
- **=== (일치 연산자)**를 사용하는 것이 예상치 못한 버그를 막는 좋은 습관이다.
- **% (나머지 연산자)**는 배수나 짝수를 찾는 로직에서 매우 유용하다.
- 논리 연산자를 활용하면 복잡한 조건문도 간결하게 표현할 수 있다.
데이터를 자유자재로 요리하는 연산자의 세계를 정복하셨습니다!
🖥️ 연산자별 실전 예제 코드
1. 산술 연산자 예제
수학적 계산을 수행하며, 특히 나머지 연산자(%)의 활용법을 눈여겨보세요.
JavaScript
let a = 10;
let b = 3;
console.log(a + b); // 13
console.log(a - b); // 7
console.log(a * b); // 30
console.log(a / b); // 3.3333...
console.log(a % b); // 1 (10을 3으로 나눈 나머지)
console.log(a ** b); // 1000 (10의 3제곱)
// 나머지 연산자 활용: 홀짝 판별
let num = 7;
console.log(num % 2 === 0 ? "짝수" : "홀수"); // "홀수"
2. 대입 및 복합 대입 연산자 예제
변수의 값을 업데이트할 때 코드를 줄여주는 역할을 합니다.
JavaScript
let total = 100;
total += 50; // total = total + 50과 같음 (150)
total -= 20; // total = total - 20과 같음 (130)
total *= 2; // total = total * 2와 같음 (260)
total /= 10; // total = total / 10과 같음 (26)
console.log("최종 합계:", total); // 26
3. 비교 연산자 예제 (일반 비교 vs 엄격한 비교)
자바스크립트에서는 타입까지 체크하는 === 사용이 매우 중요합니다.
JavaScript
let x = 5;
let y = "5";
// 일반 비교 (값만 같으면 참)
console.log(x == y); // true
// 엄격한 비교 (값과 자료형이 모두 같아야 참)
console.log(x === y); // false (숫자 5와 문자열 "5"는 다름)
// 부등호 비교
console.log(10 > 5); // true
console.log(10 <= 10); // true
console.log(10 !== 5); // true (10과 5는 같지 않음)
4. 논리 연산자 예제
여러 조건을 묶어서 판단할 때 사용합니다.
JavaScript
let hasID = true; // 신분증 소지 여부
let isAdult = false; // 성인 여부
// AND (&&): 둘 다 참이어야 함
console.log(hasID && isAdult); // false (신분증은 있지만 성인이 아님)
// OR (||): 하나만 참이어야 함
console.log(hasID || isAdult); // true (신분증이 있으므로 통과)
// NOT (!): 참/거짓을 뒤집음
console.log(!hasID); // false (true의 반대)
5. 증감 연산자 예제
값을 1씩 증가시키거나 감소시킬 때 사용하며, 위치에 따라 실행 순서가 달라집니다.
JavaScript
let count = 0;
count++; // count = count + 1 (1)
console.log(count);
count--; // count = count - 1 (0)
console.log(count);
// 전위(++n)와 후위(n++)의 차이
let n = 5;
console.log(n++); // 5 출력 후 6으로 증가 (현재 줄에서는 증가 전 값 사용)
console.log(++n); // 7로 먼저 증가 후 출력 (현재 줄에서 증가된 값 사용)
학습 정리
- 산술 연산자 중 **%**는 데이터의 규칙성(배수, 순환)을 찾을 때 필수적이다.
- 비교 시에는 반드시 **===**를 사용하여 데이터 타입 오류를 방지한다.
- 논리 연산자는 복잡한 사용자 권한 체크나 조건문 구성 시 핵심 도구가 된다.
연산자의 모든 예제까지 꼼꼼하게 확인하셨습니다!

'JavaScript' 카테고리의 다른 글
| Variables (0) | 2026.02.14 |
|---|---|
| Data types (0) | 2026.02.14 |
| Conditional statement (0) | 2026.02.14 |
| Loop statement (0) | 2026.02.14 |
| break (0) | 2026.02.14 |