矢印関数

6231 ワード

화살표 함수는 function 키워드를 화살표로 축약하여 함수를 표시하는 방법이다

함수표현식과 화살표 함수를 비교해 보자.

함수표현식
let test = function (x, y) {
  return x + y
}

화살표 함수
let test = (x, y) => {
  return x + y
}


함수의 본문(body)return 문만 있는 경우, 화살표 함수는 return을 생략할 수 있다. {} 중괄호도 생략한다.

let test = (x, y) => x + y // O, 정상 작동
let test = (x, y) => { x + y } // X, undefined 리턴
() 소괄호를 사용하는 것은 가능하다. 이는 일반적인 수식에서의 "괄호 치기"와 동일하다

let test = (x, y) => (x + y)   // O, 정상 작동
만일 함수 내의 표현식이 두 줄 이상일 경우에는, return을 생략하기 보다는 중괄호와 return을 명시적으로 쓰는 것이 좋다

// bad
let getStudentAvg = arr => arr.filter(person => person.job === 'programmer').reduce((sum, person) => (sum + person.grade), 0)

// good
let getStudentAvg = arr => {
  return arr
    .filter(person => person.job === 'programmer')
    .reduce((sum, person) => (sum + person.grade), 0)
}