728x90
화살표 함수(Arrow Function)란 무엇인가
화살표 함수란 ES6에서 도입된 함수 선언 방식으로 화살표(=>) 문법을 사용해 함수의 표현을 간결하게 할 수 있습니다.
기본 사용법
const 함수이름 = (매개변수) => {
};
매개변수가 하나일 경우에는 괄호를 생략할 수 있고, 함수 본문이 단일 표현식일 경우 중괄호와 `return` 키워드를 생략할 수 있습니다.
const add = (a, b) => a + b;
const square = x => x * x;
기존 함수 표현식과의 차이점
1. this 바인딩
화살표 함수는 자신만의 `this`를 가지지 않고, 선언된 위치에서 `this`를 상속받습니다. 이는 콜백 함수나 이벤트 핸들러에서 유용하게 사용됩니다.
function Person() {
this.age = 0;
setInterval(() => {
this.age++; // this는 Person 객체를 가리킴
}, 1000);
}
const person = new Person();
2. arguments 객체
화살표 함수는 `arguments` 객체를 가지지 않습니다. 대신, 필요한 경우 나머지 매개변수(rest parameter)를 사용할 수 있습니다.
const sum = (...args) => {
return args.reduce((acc, curr) => acc + curr, 0);
};
3. 생성자 함수로 사용할 수 없음
화살표 함수는 생성자 함수로 사용할 수 없습니다. `new` 키워드를 사용하여 화살표 함수를 호출하려고 하면 오류가 발생합니다.
const Foo = () => {};
const bar = new Foo(); // 타입 에러
728x90
'📚 Stack > JavaScript' 카테고리의 다른 글
[JavaScript] React useEffect() 이벤트 훅 (0) | 2024.06.04 |
---|---|
[JavaScript] 템플릿 리터럴 알아보기 (0) | 2024.06.04 |
댓글