[JavaScript] 제어문의 세계: 조건과 반복, 함수

하영(Emma)·2025년 4월 23일

JavaScript

목록 보기
3/8
post-thumbnail

6. 조건문과 반복문

JavaScript에서 프로그램의 흐름을 제어할 때 사용하는 대표적인 문법은 조건문반복문이다.
사용자의 입력, 조건에 따라 실행 분기나 반복을 구성할 수 있으며, 동적 로직 구현에 필수적이다.


6-1. 조건문

조건에 따라 코드 실행 흐름을 달리하고 싶을 때 사용한다.

if / else if / else

let score = 85;

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

switch 문

let fruit = "apple";

switch (fruit) {
  case "apple":
    console.log("사과입니다");
    break;
  case "banana":
    console.log("바나나입니다");
    break;
  default:
    console.log("알 수 없는 과일입니다");
}

break를 쓰지 않으면 다음 case까지 실행됨에 주의!


6-2. 반복문

같은 작업을 여러 번 반복하고 싶을 때 사용한다.

for문

for (let i = 0; i < 5; i++) {
  console.log(i);
}

for...of (배열 전용)

let arr = [1, 2, 3];

for (let num of arr) {
  console.log(num);
}

for...in (객체 전용)

let person = { name: "Emma", age: 25 };

for (let key in person) {
  console.log(`${key}: ${person[key]}`);
}

while문

let i = 0;
while (i < 3) {
  console.log(i);
  i++;
}

do-while문

let i = 0;
do {
  console.log(i);
  i++;
} while (i < 3);

break / continue

  • break : 반복문을 즉시 종료
  • continue : 다음 반복으로 건너뛰기
for (let i = 1; i <= 5; i++) {
  if (i === 3) continue;
  if (i === 5) break;
  console.log(i);  // 1, 2, 4
}

7. 함수 (Function)

함수는 특정 작업을 수행하는 코드 블록으로, 재사용성, 유지보수성, 가독성을 높이기 위해 사용된다.


7-1. 함수란?

  • 특정 기능을 하나로 묶은 코드 단위
  • JS 함수는 매개변수 타입이나 개수에 제약이 없음
  • 인자의 개수가 부족하면 undefined, 초과 인자는 무시됨
let data;           // undefined
let data2 = null;   // null

예시

function add(num1, num2) {
  console.log(num1, num2);
}

add(1);          // 1 undefined
add(1, null);    // 1 null
add(1, 2, 4);    // 1 2 (초과 인자 무시)

7-2. 함수 정의 방법

JavaScript에서 함수를 정의하는 방법은 대표적으로 2가지가 있다.

기본 함수 선언 방식

function add(num1, num2) {
  return num1 + num2;
}

console.log(add(3, 5));  // 8
  • function 함수명(매개변수) { ... }
  • 가장 전통적인 함수 선언 방식
  • 호이스팅(코드 선언보다 위에서 호출 가능) 지원

화살표 함수 (Arrow Function)

const minus = (a, b) => {
  return a - b;
};

console.log(minus(7, 2)); // 5
  • const 함수명 = (매개변수) => { 실행 코드 }
  • 한 줄인 경우 중괄호와 return 생략 가능
const square = x => x * x;
console.log(square(4));  // 16
  • 익명 함수로 정의되며 변수에 할당
  • this 바인딩 없음, 객체 내부 메서드로 사용 시 주의

함수 정의 비교 요약표

구분선언 방식호출 방식특징
기본 함수function fn()fn()호이스팅됨, 일반 함수
화살표 함수const fn = () => {}fn()호이스팅 안 됨, this 바인딩 없음

profile
Data Scientist, interested in CV, NLP

0개의 댓글