본문 바로가기
패스트캠퍼스/프론트엔드 아카데미 : 제 1강 JavaScript & TypeScrip

패스트캠퍼스 환급챌린지 30일차 : 김민태의 프론트엔드 아카데미 : 제 1강 JavaScript & TypeScript Essential 강의 후기

by Tan- 2025. 7. 30.

본 포스팅은 패스트캠퍼스 환급 챌린지 참여를 위해 작성하였습니다.
https://fastcampus.info/4n8ztzq


250730(수) 30일차

문법 - 배열 연산

 

forEach

forEach는 함수를 인자로 받아 문 없이 순회하는 패턴을 보여준다

불변성 유지와 코드 간결성, 변수 없는 안정성 측면에서 장점이 크다

books.forEach((book, index) => {
  console.log(book, index);
});

 

map

기존 배열의 각 원소를 원하는 형태로 변환하여 새로운 배열을 생성한다

콜백 함수에서 객체를 반환하면 문자열 배열이 곧 객체 배열로 바뀌는 등 유용한 방식

const bookObjects = books.map(book => ({ title: book }));

 

filter

배열에서 특정 조건을 만족하는 값만 추출할 때 사용

const henryBooks = books.filter(book => book.title.includes("헨리"));

 

reduce

단순 숫자 합산 뿐만 아니라 배열의 객체들을 하나의 객체로 병합하는 등 다양한 응용이 가능

const sum = numbers.reduce((acc, cur) => acc + cur, 0);

const merged = styles.reduce((acc, cur) => ({ ...acc, ...cur }), {});

 

유사 배열

arguments처럼 배열처럼 보이지만 배열 메서드를 갖지 않는 유사 배열

Array.from( )으로 진짜 배열로 변환해 활용하는 패턴은 과거 레거시 코드와의 호환성에서도 중요한 포인트

Array.from(arguments).reduce(...)

 

이번 강의를 통해 배열은 단순한 데이터 저장소가 아니라 구조를 만들고 변환하는 도구임을 알았다

forEach > map > filter > reduce로 이어지는 함수형 패턴은 반복문보다 훨씬 읽기 쉽고 재사용 가능한 코드