# 화살표 함수 예시
> 아래 함수와 같이 `괄호`가 있는 경우도 있고 `return`이 없는 형태도 있고 약간씩 다른 형태로 존해하고 있습니다.
```
// 예 1
const addTwo = (num) => {return num + 2;};
// 예 2
const addTwo = (num) => num + 2;
// 예 3
const addTwo = num => num + 2;
// 예 4
const addTwo = a => {
const newValue = a + 2;
return newValue;
};
```
# 가장 큰 차이점
> 화살표 함수가 간결한 대신 `this` 키워드에 대한 바인딩은 사용할 수 없습니다.
```
// 함수 표현식
const addNumbers = function(number1, number2) {
return number1 + number2;
};
// 화살표 함수 표현식
const addNumbers = (number1, number2) => number1 + number2;
// 실행 시 위 두 함수의 결과는 동일합니다.
console.log(addNumbers(1, 2));
// 결과 : 3
```
# 괄호(Parentheses)
> 변수가 1개인 경우는 괄호를 생략 할 수 있습니다. (있어도 됨)
```
// 예 - 괄호 있는경우
const addNums = (num1, num2) => num1 + num2;
// 예 - 괄호 없는 경우
const addTwo = num => num + 2;
```
> 단, 변수가 없는 경우에는 괄호를 써야 됨.
```
const hello = () => "hello";
console.log(hello());
// 결과 : "hello"
```
> 화살표 기능은 나머지(rest) 매개 변수 및 destructing을(파괴) 지원하며, 두 기능 모두 괄호가 필요합니다.
* 나머지 연산자 예시
```
const nums = (first, ...rest) => rest;
console.log(nums(1, 2, 3, 4));
// 결과 : [ 2, 3, 4 ]
```
* destructing 예시
```
const location = {
country: "Greece",
city: "Athens"
};
const travel = ({city}) => city;
console.log(travel(location));
// 결고 : "Athens"
```
요약 - 매개 변수가 하나만 있는 경우 괄호는 옵션이지만 그 외의 경우에는 필수사항 입니다.
# 함수 몸체
* 간결한 ( concise body ) 문법
> return 은 사용하지 않으며, 값은 반드시 return 되어야 됨
```
const addTwo = a => a + 2;
```
* 블록 ( block body ) 문법
> 중괄호와 return 키워드를 모두 사용하며, return 키워드를 명시 적으로 사용해야 합니다.
```
const multiNums = (a, b) => {return a * b;};
```
# 여러줄의 화살표 함수
> 아래와 같이 화살표 함수는 여러줄일 경우에도 사용할 수 있습니다.
```
const totalDistance = miles => {
if (miles < 15) {
return "Short distance";
} else {
return "Long distance";
}
};
```
# Object (개체) 와 화살표 함수
> 알아야 할 미묘한 구문의 차이가 하나 더 있습니다. 객체 리터럴 표현식을 반환하려는 경우 `함수 본문을 괄호로` 묶습니다.
```
const f = () => ({
city:"Boston"
})
console.log(f().city)
```
> 아래와 같은 방법으로 사용하면 오류를 발생 시킵니다.
```
const f = () => {
city:"Boston"
}
// 결과 : 오류
```
# 맺음말
화살표 함수가 첨에는 정말 적응하기 애매 한데 나중에 적응되면 정말 편하게 사용할 수 있습니다. 하지만 실무에서 사용하는 경우에는 협업 과정에서 다른 사람들이 못알아 듣거나 grunt 에서 uglify 등을 수행할 때 정상적으로 동작하지 않는 경우도 있기 때문에 사용상에 유의를 하긴 해야 될 것 같기는 합니다.
hiveblocks