📘 Day 3 교재 (배열 메서드: map, filter, reduce)

 0. Day3 시작 (폴더 생성)

✍️

cd ~/OneDrive/Desktop/fullstack
mkdir day03-array-methods
cd day03-array-methods
code .

👉 index.js 파일을 새로 만든다.

---

1. 코드 작성 (index.js)

✍️

// ================== map ==================
// 배열의 모든 요소를 변환해서 새로운 배열을 만듦
let numbers = [1, 2, 3, 4, 5];
let doubled = numbers.map(n => n * 2);

console.log("원본:", numbers);
console.log("map 결과:", doubled);

// ================== filter ==================
// 조건에 맞는 요소만 뽑아 새로운 배열을 만듦
let scores = [45, 82, 67, 90, 33];
let passed = scores.filter(s => s >= 60);

console.log("원본:", scores);
console.log("filter 결과:", passed);

// ================== reduce ==================
// 배열의 모든 요소를 하나로 줄임 (누적 계산)
let prices = [1000, 2000, 3000, 4000];
let total = prices.reduce((acc, cur) => acc + cur, 0);

console.log("원본:", prices);
console.log("reduce 결과(총합):", total);

---

2. 실행 절차

✍️

cd ~/OneDrive/Desktop/fullstack/day03-array-methods
node index.js

👀 실행 결과:

원본: [ 1, 2, 3, 4, 5 ]
map 결과: [ 2, 4, 6, 8, 10 ]

원본: [ 45, 82, 67, 90, 33 ]
filter 결과: [ 82, 67, 90 ]

원본: [ 1000, 2000, 3000, 4000 ]
reduce 결과(총합): 10000

---

3. 개념 정리

map

• ✅ 꼭 외워야 하는 것: 배열.map(요소 => 변환식)

• 🌱 원리: 배열의 각 요소를 변환해 새 배열 반환

• 💡 실무 예시:

  • 상품 가격에 세금 10% 추가

  • 게시판 글 데이터에서 제목만 추출

filter

• ✅ 꼭 외워야 하는 것: 배열.filter(요소 => 조건식)

• 🌱 원리: 조건에 맞는 데이터만 걸러냄

• 💡 실무 예시:

  • 장바구니에서 품절이 아닌 상품만 보여주기

  • 시험 점수에서 합격자만 추려내기

reduce

• ✅ 꼭 외워야 하는 것: 배열.reduce((누적값, 현재값) => 계산식, 초기값)

• 🌱 원리: 배열을 순회하며 하나의 값으로 누적

• 💡 실무 예시:

  • 장바구니 총 금액 계산

  • 좋아요 수 합산

  • 평균값 구하기

---

4. GitHub 기록 남기기

👉 중요: 항상 fullstack 루트에서!

✍️

cd ~/OneDrive/Desktop/fullstack
git add .
git commit -m "day3: array methods"
git push

👀 이제 GitHub https://github.com/sy920/fullstack 에서
day03-array-methods/index.js 파일 확인 가능

---

✅ Day3 요약

• map: 데이터 변환

• filter: 조건 추출

• reduce: 누적 계산

• day03-array-methods 폴더 생성 및 코드 작성

• GitHub에 day3: array methods 기록 남김