아래 두 가지 상황에서 함수를 써야 한다
- 여러 가지 기능을 하는 코드를 한 단어로 묶고 싶을 때(그리고 나중에 재사용할 때)
- 입출력 기능을 만들 때
arrow function
을 사용하는 데에는 몇 가지 이유가 있는데
1. 첫번째로 함수 본연의 입출력 기능을 아주 직관적으로 잘 표현해줌
var 두배만들기 = (x) => { return x * 2 };
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );
화살표 모양을 사용함으로써 함수의 기능을 파악하는 데에 쉬워짐
2. 두번째로 소괄호 생략이 가능함
var 두배만들기 = x => { return x * 2 };
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );
파라미터
가 한 개일 경우 소괄호를 생략할 수 있음
3. 세번째로 중괄호 생략이 가능함
중괄호 안에 return
한 줄 뿐이라면 중괄호와 return
모두 생략 가능함
var 두배만들기 = x => x * 3;
console.log( 두배만들기(4) );
console.log( 두배만들기(8) );
arrow function
을 쓰면 내부에서 this
값을 쓸 때 밖에 있던 this
값을 그대로 사용함
arrow function
은 어디서 쓰던지 내부의 this
값을 변화시키지 않음
따라서 바깥에 있던 this의 의미를 그대로 내부에서도 사용하는 함수가 arrow function
이것이 네번째 장점이자
arrow function
을 사용하는 핵심 이유
var 오브젝트1 = {
함수 : function(){ console.log(this);
}
오브젝트1.함수();
위의 코드를 실행시키면
함수()를 가지고 있는 오브젝트인 오브젝트1
이 콘솔창에 출력됨
var 오브젝트1 = {
함수 : () => { console.log(this); }
}
오브젝트1.함수();
위의 코드를 실행시키면
this
의 값으로 window
가 나옴
arrow function
은 외부에 있던 this
를 그대로 내부로 가져와서 사용하는 함수이기 때문에 일반 function
과 용도가 다름
일반 function
을 대체하여 arrow function
을 사용하는 일이 없도록 하기