← 목록

ES6 화살표 함수의 기본 사용법

작성: 2025년 05월 14일읽기: 약 3분

자바스크립트를 배우는 여러분, 화살표 함수(arrow functions)에 대해 들어보셨나요? ES6에서 새롭게 도입된 이 기능은 코드를 더욱 간결하고 이해하기 쉽게 만들어 줍니다. 특히 함수를 작성할 때 사용하는 function 키워드 없이도 함수를 만들 수 있어 매우 유용합니다. 이번 포스트에서는 화살표 함수의 기본 사용법을 알아보겠습니다.

화살표 함수란?

화살표 함수는 기본적으로 익명 함수입니다. 즉, 이름이 없는 함수죠. 이를 변수에 할당하여 사용할 수 있습니다. 화살표(=>)를 사용하여 함수의 매개변수와 함수의 본문을 구분합니다.

기본 문법

화살표 함수의 기본 문법은 다음과 같습니다:

const functionName = (parameter1, parameter2, ...) => {
  // 함수 본문
}

간단한 예제로 한 번 살펴봅시다:

const add = (a, b) => {
  return a + b;
}

console.log(add(5, 3)); // 8

여기서 add라는 변수에 화살표 함수를 할당했습니다. 이 함수는 두 매개변수 ab를 받아 그 합을 반환합니다.

매개변수가 하나뿐인 경우

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

const square = x => {
  return x * x;
}

console.log(square(4)); // 16

본문이 한 줄인 경우

함수의 본문이 단 한 줄이고, 그 한 줄이 반환값인 경우, 중괄호와 return 키워드를 생략할 수 있습니다:

const multiply = (a, b) => a * b;

console.log(multiply(2, 3)); // 6

이렇게 코드를 작성하면, 더욱 간결하고 읽기 쉬운 코드를 만들 수 있습니다.

결론

화살표 함수는 자바스크립트에서 함수를 더욱 간결하게 작성할 수 있게 해주는 훌륭한 기능입니다. 매개변수와 본문의 구성에 따라 괄호와 중괄호, return 키워드의 생략이 가능하여 코드를 더욱 간결하게 만들 수 있죠. 이 포스트를 통해 화살표 함수의 기본 사용법을 익혔기를 바랍니다. 웹 개발을 배우는 여정에서 이러한 작은 팁들이 큰 도움이 될 것입니다.