[JavaScript] JavaScript – Arrow Function(화살표함수) 사용 방법

안녕하세요.

 

오늘은 JavaScript에서 제공해주는 기본 문법 중, Arrow Function 화살표 함수 사용방법에 대해서 알아보려고 합니다.

 

지난번 자바스크립트 함수 관련해서 포스팅을 한적이 있는데요.

 

이전의 함수를 표현할 때에는 함수 이름, 스코프 등과 같은 기호들을 포함해서 named function 에 대해서 설명을 드렸다면 오늘은 이러한 함수들의 표현을 훨씬 간결하게 표현해줄 수 있는 문법인 Arrow Function 사용 방법을 알려 드리려고 합니다.

 

말로 하는 것 보다 소스코드를 보면서 이해하는게 훨씬 낫겠죠?ㅎㅎ

 

바로 예제 코드를 통해서 Arrow Function을 어떻게 사용하는지 보여 드리도록 하겠습니다.

 

예제 코드

'use strict';
 
//named function
function sum(a, b){
    return a + b;
}
 
console.log(sum(1, 4));
 
//Arrow function
let sumAgain = (a, b) =>  a + b;
console.log(`Arrow function value = ${sumAgain(5, 6)}`);
 
let foo = (a, b) => { return a + b };
console.log(`Arrow function value = ${foo(4, 5)}`);
 
let sumValue = (a, b) => {
    let c = 5;
    return a + b + c;
}
 
console.log(`Arrow function value = ${sumValue(2, 3)}`);

 

실행 결과

위와 같이 => 기호를 통해서 Arrow Function 함수를 기초적으로 사용하는 방법을 보여 드렸습니다.

 

이외에도, 콜백함수에서 사용하는 방법과 Arrow Function 에서 this 가 나타내는 의미와 Arrow Function 을 사용해서는 안되는 구문들 등과 같이 더 자세히 Arrow Function 에 대해서 공부를 해야 하는데요.

 

저는 웹을 처음 공부하는 사람으로써..일단 Arrow Function에 대해 기초적으로 접근하고 추후에 위의 내용들을 하나하나 공부를 해서 내용을 이해하면 블로그에 글을 포스팅 하도록 하겠습니다.

 

감사합니다.^^