JavaScript

Operator

lshjju 2026. 2. 14. 18:26

데이터를 가공하고 논리를 판단하는 도구인 **연산자(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