[JavaScript] 자바스크립트 화살표 함수(Arrow Function) 사용하기

011 _ 자바스크립트 화살표 함수(Arrow Function) 사용하기

[적용]

• 함수를 간략히 정의하고 싶을 때
• this를 지정하고 싶을 때

---

[내용]

function 외에도 화살표 함수를 사용하여 함수를 정의할 수 있다.

화살표 함수의 장점은 다음과 같다.

1. 함수를 간략히 기술할 수 있다.

2. this를 묶는 것이 가능하다

---

[문법]

구문	의미
(파라미터) => { 처리내용 }	함수를 정의

---

[예시1]

화살표 함수는 다음과 같이 정의하여 사용한다.

 

JavaScript

// 함수의 정의
const calcSum = (a, b, c) => {
    const result = a + b + c;
    return result;
};

// 함수의 실행
calcSum(1, 2, 3);  // 결과: 6

---

[예시2]

화살표 함수는 일반 함수와 달리 일부를 생략할 수 있다.

파라미터가 하나인 경우는()의 생략이 가능하나,

파라미터가 없거나 2개 이상인 경우는 생략할 수 없다.

입력 a에 대해 a + 2의 결과를 반화하는 함수를 확인해 보자.

 

JavaScript

// 함수의 정의
const myFunction = (a) => {
    return a + 2;
};

// 함수의 정의(괄호를 생략)
const myFunction2 = a => {
    return a + 2;
};

// 화살표 함수의 정의가 한 줄인 경우 {}와 return을 생략할 수 있다.
const myFunction3 = (a) => a + 2;

---

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김