[TIL] 화살표 함수 뒤 괄호 정리

항상 화살표 함수를 쓸 때마다 뒤 괄호 쓰는게 헷갈려서
정리하고 기억하기 위해 기록!

---

1. 중괄호 {} → 코드 블록

.map((x) => {
  // 여러 줄 코드 가능
  const double = x * 2;
  return double;  // 반드시 return 필요
});

{} 는 “코드 블록”

return 없으면 무조건 undefined

여러 줄 쓸 때 주로 사용

2. 소괄호 () + 중괄호 {} → 객체 리터럴 반환

.map((x) => ({ value: x * 2 }))

그냥 {} 쓰면 블록으로 인식 → undefined

객체를 반환하려면 반드시 ()로 감싸야 함

❌ 잘못된 예시

.map((x) => { value: x * 2 }) // 블록으로 해석 → undefined

3. 아무 괄호 없음 → 한 줄 표현식

.map((x) => x * 2)

한 줄 계산식은 자동으로 반환(return 생략 가능)

단순한 값 변환할 때 편리

---

🧠 기억 꿀팁

{ } = 블록 → return 꼭 써야 함

( { } ) = 객체 → return 없이도 객체 반환

그냥 값 → return 생략 가능