반응형
화살표 함수 표현 (Arrow Function Expression)
- 전통적인 함수표현을 간편화한 대안이다.
- 전통적인 함수 표현을 간단하게 만든 sugar-code.
- 화살표함수는 해당 객체의 메소드가 아님.
- 문법적으로 틀린 표현이나 개발자들의 편의를 위해 개발된 함수.
▶ 특성
- this나 super에 대한 바인딩이 없고, methods 로 사용될 수 없다.
- new.target키워드가 없다.
- 일반적으로 스코프를 지정할 때 사용하는 call, apply, bind methods를 이용할 수 없다.
- 생성자(Constructor)로 사용할 수 없다.
- yield를 화살표 함수 내부에서 사용할 수 없다.
▶ 형식
(param1, param2, …, paramN) => { statements }
(param1, param2, …, paramN) => expression // 동일함: => { return expression; }
▶ 이해
1. 기본 코드
<body>
<script>
let ar = [1, 2, 3, 4, 5]
const newAr = ar.map(function(value, index, Array)
{
return value + 10
});
console.log(newAr)
//[11, 12, 13, 14, 15]
</script>
</body>
- 1번 박스 생략 (function)
- => (arrow) 생성
<body>
<script>
let ar = [1, 2, 3, 4, 5]
const newAr = ar.map((value, index, Array) => {
return value + 10
});
</script>
</body>
- 2번 박스 생략 (return)
- expression에 ;생략
- {} 생략
<body>
<script>
let ar = [1, 2, 3, 4, 5]
const newAr = ar.map((value, index, Array) => value + 10);
console.log(newAr)
//[11, 12, 13, 14, 15]
</script>
</body>
반응형
'JavaScript' 카테고리의 다른 글
| [JavaScript] IIFE(즉시 실행 함수 표현식), strict mode(엄격 모드) (0) | 2022.04.12 |
|---|---|
| [JavaScript] Method Chaining (메서드 체인) (0) | 2022.04.12 |
| [JavaScript] Callback function(콜백 함수), forEach, map, filter (0) | 2022.04.12 |
| [JavaScript] type에 따른 bubble sort(버블 소트) 예제 (0) | 2022.04.11 |
| [JavaScript] 전개 연산자, Default Parameter (0) | 2022.04.11 |