[기초] 02. 연산자,비교,논리

JavaScript 기초 요약

자바스크립트 기초 2: 연산자·비교·조건문·논리 연산

조건 로직 쇼트서킷 실전 패턴

5) 기본 연산자 — 계산뿐 아니라 “문자열 결합”도 자주 나옵니다

• 산술: +, -, *, /, %
• 대입/복합대입: =, +=, *= …
• 증감: ++, -- (전위/후위 차이를 의식하시면 좋습니다)

let n = 10;
n += 3;     // 13
n++;        // 14

"10" + 3    // "103"  (문자열 결합)
"10" - 3    // 7      (숫자로 변환되어 계산)

실무 팁
더하기(+)는 문자열 결합으로도 쓰이기 때문에, 숫자 계산을 의도한다면 Number()로 먼저 변환해 두시면 안전합니다.

6) 비교 연산자와 조건문 — “===(엄격 비교)”를 기본으로 두시면 편합니다

자바스크립트에는 느슨한 비교(==)와 엄격한 비교(===)가 있습니다. 실무에서는 예외를 줄이기 위해 엄격 비교(===)를 기본값으로 두는 경우가 많습니다.

0 == false   // true   (형변환이 일어납니다)
0 === false  // false  (타입까지 같아야 합니다)

조건문 기본 패턴

if (score >= 90) {
  grade = "A";
} else if (score >= 80) {
  grade = "B";
} else {
  grade = "C";
}

자주 헷갈리는 비교

• null / undefined 비교는 케이스가 복잡합니다. 가능하면 ===로 의도를 명확히 하시는 편이 좋습니다.
• 문자열 비교는 사전순(유니코드 순서)으로 이루어집니다.

7) 논리 연산자(&& / || / !) — “쇼트서킷”을 이해하면 코드가 깔끔해집니다

&&/||의 동작과 기본값 패턴을 한 장으로 정리했습니다.

자주 쓰는 패턴

// 1) 조건부 실행
isAdmin && doDangerousThing();

// 2) 기본값
const name = input || "익명";

// 3) 부정
if (!isValid) {
  // ...
}

주의
|| 기본값 패턴은 0이나 ""처럼 “의미 있는 falsy” 값까지 덮어쓸 수 있습니다. 이런 경우에는 ??(nullish coalescing)를 검토하시는 것도 좋습니다(추가 개념).

참고 링크

MDN: 연산자(Expressions and operators)

MDN: 비교 연산자

MDN: 논리 연산자

MDN: nullish coalescing (??)