JavaScript map() VS forEach(), 뭐가 더 좋을까?! 🤔

map()과 forEach(), 둘 다 써봤어? 🔍

자바스크립트에서 배열 다룰 때 제일 많이 쓰는 게 바로 map()이랑 forEach() 인데요.
둘 다 반복문 비슷하게 사용되는데, 실제로는 꽤 다른 놈들이거든요.
간단하게 생각하면 forEach()는 단순히 반복 작업을 할 때 쓰고, map()은 새로운 배열을 만들 때 사용한다! 정도로 알면 되는데... 이게 또 막상 써보면 헷갈리더라구요?ㅋㅋ
그래서 이번에는 두 녀석의 차이점과 언제 어떻게 써야 할지 깔끔하게 정리해 보겠습니다!

---

map()과 forEach(), 같은 듯 다른 녀석들! 📌

map()과 forEach()는 둘 다 배열 메서드라서 사용법 자체는 비슷해요. 근데 기능적으로 보면 꽤 다릅니다!
일단 기본적으로 문법부터 살펴볼게요.

✅ map()의 특징

• 새로운 배열을 리턴한다. (원본 배열은 그대로 유지!)
• 콜백 함수의 반환값으로 새로운 배열을 만들어 줌.
• 주로 배열을 변환할 때 유용하게 쓰인다.

const numbers = [1, 2, 3, 4];
const doubled = numbers.map(num => num * 2);
console.log(doubled); // [2, 4, 6, 8]

✅ forEach()의 특징

• 리턴 값이 없다! 즉, undefined 리턴.
• 단순히 배열을 돌면서 무언가 수행할 때 사용.
• 원본 배열을 수정할 수 있다. (하지만 권장하진 않음!)

const numbers = [1, 2, 3, 4];
numbers.forEach(num => console.log(num * 2)); // 2, 4, 6, 8 출력

---

그럼 뭐가 더 좋을까? 🤔

사실 둘 다 잘만 쓰면 유용한데요. 문제는 "어떤 상황에서 쓰느냐"겠죠?
한 번 비교해봅시다.

🔥 map()을 써야 할 때

• 결과를 새로운 배열로 받고 싶을 때!
• 예를 들어, 데이터를 변환해서 새로운 리스트로 만들어야 할 때.

const names = ['Smith', 'Olivia', 'Emma'];
const upperNames = names.map(name => name.toUpperCase());
console.log(upperNames); // ['SMITH', 'OLIVIA', 'EMMA']

🔥 forEach()를 써야 할 때

단순히 배열을 돌면서 뭔가 작업만 하고 싶을 때.
예를 들어, 콘솔에 출력하거나, DOM 조작할 때 등.

const names = ['철수', '영희', '민수'];
names.forEach(name => console.log(name)); // 철수, 영희, 민수 출력

---

map() VS forEach(), 성능 차이도 있을까? 💡

아주 미세하지만 성능 차이도 있긴 해요.
map()은 새로운 배열을 리턴해야 하니까 약간의 오버헤드가 발생하겠죠?
하지만 일상적인 사용에서는 큰 차이 못 느끼실 겁니다ㅋㅋ

근데 만약 엄청나게 큰 배열을 돌려야 한다? 그럼 이야기가 조금 달라질 수 있어요.
특히, 결과값이 필요 없는 상황에서 map() 대신 forEach()를 쓰면 성능 면에서 좀 더 효율적일 수 있겠죠!

---

언제 뭐 써야 할지 쉽게 구분하기! 📌

1. 결과값이 필요하다? 👉 map() 쓰기!
2. 그냥 작업만 하고 싶다? 👉 forEach() 쓰기!
3. 성능이 중요한 상황에서 리턴값이 필요 없다? 👉 forEach()가 조금 더 유리!

---

map()과 forEach()에 대한 오해들 😅

🔹 map()은 항상 더 좋은가요?
👉 아니요! 리턴값이 필요 없는데 map()을 쓰면 괜히 메모리 낭비!

🔹 forEach()는 무조건 느린가요?
👉 꼭 그렇진 않아요. 특히 단순 작업일 때는 더 효율적일 수도 있죠.

🔹 map()으로 모든 작업을 대체할 수 있나요?
👉 리턴값이 필요 없는 작업에서는 forEach()가 더 적합하답니다.

---

map() VS forEach(), 정리하자면?

두 메서드는 상황에 따라 잘 써야 하는 게 포인트!
예를 들어 데이터 변환할 땐 map(), 단순 작업엔 forEach()가 맞다는 거죠.
근데 솔직히 이론만 보고 이해하기 어렵잖아요? 직접 써보면서 익히는 게 짱임다!

그럼 여러분은 어떻게 생각하시나요? 🤔
map()과 forEach(), 여러분은 언제 어떻게 사용하시나요? 댓글로 알려주세요!