Ch.9 JavaScript 기초 — 페이지에 생명을

조건문과 함수

if/else 조건문으로 분기 로직을 작성할 수 있다비교 연산자(===, !==, >, <)를 올바르게 사용한다함수 선언과 화살표 함수를 작성할 수 있다

만약 점수가 80점 이상이면? 상황에 따라 다르게 동작합니다

로그인했으면 마이페이지를, 아니면 로그인 화면을 보여주는 것처럼 조건에 따라 다르게 실행하는 것이 프로그래밍의 핵심입니다.

조건 분기와 코드 재사용, 어떻게 할까?

if/else와 function — 조건 분기와 코드 재사용의 두 기둥입니다.

article

핵심 내용

조건이 참이면 실행하고 거짓이면 다른 것을 실행합니다

const score = 85;

if (score >= 90) {
  console.log("A등급");
} else if (score >= 80) {
  console.log("B등급");
} else if (score >= 70) {
  console.log("C등급");
} else {
  console.log("재시험");
}
// 결과: "B등급"

주의: `==` 대신 `===`을 사용하세요! `"1" == 1`은 true이지만 `"1" === 1`은 false입니다. === 는 타입까지 비교하므로 더 안전합니다.

반복되는 코드를 함수로 묶어 이름을 붙여 재사용합니다

매개변수: 함수에 전달하는 입력값 (name)

함수 본문: 실행할 코드 블록 { ... }

return: 함수의 결과를 돌려줌

점수에 따라 등급을 판정하는 함수를 만들어봅시다

JavaScript에서 "값과 타입이 모두 같은지" 비교하는 연산자는?

화살표 함수 (=>) 와 function 선언은 완전히 동일하게 작동한다

다음 코드의 실행 결과는? const x = 10; if (x > 5) { console.log("A"); } else { console.log("B"); }

조건문과 함수 클리어!

key

핵심 용어

🟰

===

값과 타입이 같음 (1 === 1 → true, "1" === 1 → false)

❌

!==

값 또는 타입이 다름

↔️

> / <

크다 / 작다

📏

>= / <=

크거나 같다 / 작거나 같다

edit_note

정리 노트

조건문과 함수 핵심 정리

조건문

if / else
조건이 true이면 if 블록, false이면 else 블록 실행
else if
여러 조건을 순서대로 검사할 때 사용
비교 연산자
===, !==, >, <, >=, <= 등으로 조건 판단

함수

function 선언
function 이름(매개변수) { ... return 값; }
화살표 함수
const 이름 = (매개변수) => { ... }; — 간결한 표기법
return
함수 실행 결과를 호출자에게 돌려주는 키워드
★

함수는 '재사용 가능한 코드 블록'입니다. 반복되는 로직은 함수로 분리하세요.

check_circle

핵심 정리

  • 1if/else로 조건 분기, === 로 엄격 비교
  • 2function과 화살표 함수(=>) 두 가지 선언 방식
  • 3매개변수 → 함수 본문 → return 흐름

퀴즈와 인터랙션으로 더 깊이 학습하세요

play_circle인터랙티브 레슨 시작