본문으로 건너뛰기
실습하기

화살표 함수(Arrow Functions)

화살표 함수를 사용하면 함수를 더 간결하게 표현할 수 있습니다.

화살표 함수는 함수를 정의할 때 function 키워드 대신 화살표(=>) 기호를 사용하여 함수를 작성합니다.


화살표 함수의 기본 구조
const functionName = (parameter1, parameter2) => {
  // 함수 내용
};

화살표 함수 예시
const add = (a, b) => a + b;

console.log(add(1, 2)); // 3 출력

화살표 함수를 사용하면 기존 함수보다 간단하게 코드를 작성할 수 있습니다.

기존 함수와 화살표 함수 비교
// 기존 함수
const sayHello = function (name) {
  return '안녕하세요, ' + name + '!';
};

// 화살표 함수
const sayHello = (name) => '안녕하세요, ' + name + '!';

화살표 함수의 예시​

화살표 함수를 사용하여 다음과 같이 함수를 작성할 수 있습니다.


매개변수가 없는 경우​

괄호를 사용해서 매개변수를 생략할 수 있습니다.

매개변수가 없는 화살표 함수
const greet = () => '안녕하세요!';

매개변수가 하나인 경우​

매개변수가 하나인 경우 괄호를 생략할 수 있습니다.

매개변수가 하나인 화살표 함수
const double = x => x * 2;

매개변수가 둘 이상인 경우​

다음과 같이 쉼표로 구분하여 매개변수를 나열합니다.

매개변수가 2개 이상인 화살표 함수
const add = (a, b) => a + b;

다음 내용이 궁금하다면?

코드프렌즈 PLUS 멤버십 가입 or 강의를 등록해 주세요!