JavaScript 배열 메서드 치트시트
가장 자주 쓰는 JavaScript 배열 메서드와 각 반환값, 그리고 결정적으로 원본 배열을 변형하는지 새 배열을 반환하는지. 이 열을 정확히 알면 버그를 크게 줄일 수 있습니다: map·filter는 원본을 건드리지 않아 안전하고, sort·reverse·splice는 제자리에서 바꿉니다.
업데이트 2026-07-06
| 메서드 | 하는 일 | 반환 | 변형 |
|---|---|---|---|
| map() | 모든 요소 변환 | 새 배열 | 아니요 |
| filter() | 테스트를 통과한 요소만 유지 | 새 배열 | 아니요 |
| reduce() | 배열을 하나의 값으로 축약 | 임의의 값 | 아니요 |
| forEach() | 각 요소에 함수 실행 | undefined | 아니요 |
| find() | 테스트를 통과하는 첫 요소 | 요소 / undefined | 아니요 |
| findIndex() | 첫 일치의 인덱스 | 인덱스 / -1 | 아니요 |
| some() | 하나라도 통과하면 true | 불리언 | 아니요 |
| every() | 모두 통과하면 true | 불리언 | 아니요 |
| includes() | 값이 있는지 여부 | 불리언 | 아니요 |
| indexOf() | 값의 인덱스 | 인덱스 / -1 | 아니요 |
| slice() | 배열의 일부 복사 | 새 배열 | 아니요 |
| concat() | 배열들을 새 배열로 병합 | 새 배열 | 아니요 |
| join() | 요소를 문자열로 결합 | 문자열 | 아니요 |
| flat() | 중첩 배열 평탄화 | 새 배열 | 아니요 |
| flatMap() | map() 후 한 단계 평탄화 | 새 배열 | 아니요 |
| at() | 인덱스로 요소(음수 지원) | 요소 | 아니요 |
| push() | 끝에 하나 이상 추가 | 새 길이 | 예 |
| pop() | 마지막 항목 제거 | 제거된 항목 | 예 |
| shift() | 첫 항목 제거 | 제거된 항목 | 예 |
| unshift() | 앞에 항목 추가 | 새 길이 | 예 |
| splice() | 임의 인덱스에 추가/제거 | 제거된 항목들 | 예 |
| sort() | 배열을 제자리 정렬 | 그 배열 | 예 |
| reverse() | 배열을 제자리 뒤집기 | 그 배열 | 예 |
| fill() | 정적 값으로 채우기 | 그 배열 | 예 |
| Array.from() | 이터러블에서 배열 생성 | 새 배열 | 아니요 |
| Array.isArray() | 값이 배열인지 확인 | 불리언 | 아니요 |
팁: 원본을 건드리지 않고 정렬된 복사본이 필요하면 먼저 전개하세요 — [...arr].sort(). 최신 JavaScript에는 새 배열을 반환하는 비변형 쌍둥이(toSorted, toReversed, toSpliced, with)도 있습니다.