모던 자바스크립트(ES6+)에서 가장 사랑받는 문법입니다. 불필요한 function 단어와 중괄호를 날려버려 코드를 극단적으로 깔끔하게 만들어줍니다. 특히 배열 메서드(map, filter)와 찰떡궁합입니다.
화살표 함수의 진화 과정
function (a, b) { return a + b; }
(a, b) => a + b;
// 1. 기존의 함수 표현식 (길고 무거움)
const addOld = function(a, b) {
return a + b;
};
console.log("기존 함수 결과:", addOld(5, 10));
// 2. ES6 화살표 함수 (짧고 간결함)
const addNew = (a, b) => {
return a + b;
};
console.log("화살표 함수 결과:", addNew(5, 10));
// 3. 더 짧게 줄이기! (중괄호와 return 생략 가능)
const multiply = (a, b) => a * b;
console.log("짧은 화살표 함수:", multiply(5, 10));
// 4. 매개변수가 딱 1개라면 괄호조차 생략 가능
const square = x => x * x;
console.log("매개변수 1개일 때:", square(8));
// 5. 배열 메서드와의 찰떡궁합 (map, filter)
const numbers = [1, 2, 3, 4, 5];
// 기존 방식
const doubledOld = numbers.map(function(n) { return n * 2; });
// 화살표 함수 방식 (극단적으로 짧아짐)
const doubledNew = numbers.map(n => n * 2);
console.log("배열 map 결과:", doubledNew); // [2, 4, 6, 8, 10]
// 짝수만 걸러내기 (filter)
const evens = numbers.filter(n => n % 2 === 0);
console.log("배열 filter 결과 (짝수):", evens); // [2, 4]
