[JS] Arrow Function(화살표 함수) 정리

[JS] Arrow Function(화살표 함수) 정리

• ES6에서는 람다식 표현을 더욱 간결하게 해주는 Arrow문법이 추가되었다
• 표현식
• const(let) 변수명 = (파라미터) => {... 함수내용 ...}
• 실수로 비교연산자['<=' '>=']를 가끔 '=>'로 쓰는 사람들이 있는데 앞으로 주의하자

 // ES5
var selected = allJobs.filter(function (job) {
  return job.isSelected();
});
// ES6
var selected = allJobs.filter(job => job.isSelected());

// ES5
var total = values.reduce(function (a, b) {
  return a + b;
}, 0);

// ES6
var total = values.reduce((a, b) => a + b, 0);

{}이 객체인지 블럭인지 구분이 안될때는 아래와 같이 처리해주자

var chewToys = puppies.map(puppy => {});   // Error
var chewToys = puppies.map(puppy => ({})); // 객체로 인식

기존 자바스크립트에서 익명함수를 변수에 할당하는 것과 비교

var _addFunc = function(a, b){
    return a+b;
}

다음은 같은 예제를 arrow function으로 만든것

const _addFunc = (a, b) => {
    return a+b;
}

만약, 위의 예제와 같이 함수의 내용이 한줄이면 블럭('{}')을 생략 가능
블럭을 생략한다는것은 바로 return한다는 것

const _addFunc = (a, b) => a+b;

출처

• http://pro-self-studier.tistory.com/11?category=659080
• https://web-front-end.tistory.com/21