ESLint 규칙 중 func-style 란?

by

ESLint 규칙 중 func-style 란?

프로그래밍을 하면서 코드의 가독성과 유지보수성을 높이기 위해 스타일 가이드를 따르는 것은 매우 중요합니다. 특히 함수 선언 방식은 코드의 구조와 일관성에 큰 영향을 미칠 수 있습니다. 이번 글에서는 ESLint의 중요한 규칙 중 하나인 func-style 규칙을 살펴보고, 이 규칙이 코드 품질을 어떻게 향상시킬 수 있는지 알아보겠습니다.

func-style 규칙이란?

func-style 규칙은 함수 선언 방식을 일관되게 유지할 수 있도록 도와주는 ESLint 규칙입니다. JavaScript에서는 함수 선언(Function Declaration)과 함수 표현식(Function Expression)이라는 두 가지 방법으로 함수를 정의할 수 있습니다. 이 규칙은 프로젝트 내에서 어떤 방식으로 함수를 선언할 것인지 명확히 하여 코드의 일관성을 유지하게 합니다.

함수 선언 방식의 차이점

  1. 함수 선언 (Function Declaration)

    function greet() {
  console.log('Hello, World!');
}

    함수 선언은 코드 어디서나 호출이 가능합니다. 이는 함수 호이스팅 기능 덕분입니다.

  2. 함수 표현식 (Function Expression)

    const greet = function() {
  console.log('Hello, World!');
};

    함수 표현식은 변수에 함수가 할당되는 방식으로, 해당 변수 이후에만 함수를 사용할 수 있습니다.

ESLint에서 func-style 규칙 설정

ESLint에서 func-style 규칙은 두 가지 옵션을 제공합니다: "declaration"과 "expression". 각 프로젝트의 코드 스타일에 따라 적절한 방식을 선택할 수 있습니다.

  • declaration: 모든 함수를 함수 선언 방식으로 정의합니다.
  • expression: 모든 함수를 함수 표현식 방식으로 정의합니다.

예를 들어, 함수 선언 방법을 고수하고 싶다면 .eslintrc 파일에 다음과 같이 설정할 수 있습니다:

{
  "rules": {
    "func-style": ["error", "declaration"]
  }
}

반대로, 함수 표현식을 선호한다면 다음과 같이 설정합니다:

{
  "rules": {
    "func-style": ["error", "expression"]
  }
}

올바른 사용 방법

func-style 규칙을 통해 일관된 함수 선언 방식을 유지하면 코드의 가독성이 크게 향상됩니다. 팀 내에서는 공통된 함수 선언 방식을 적용함으로써 협업 과정에서 발생할 수 있는 혼란을 줄일 수 있습니다.

아래는 예시 코드입니다:

// 함수 선언 방식
function add(a, b) {
  return a + b;
}

// 함수 표현식 방식
const subtract = function(a, b) {
  return a - b;
};

결론

func-style 규칙은 프로그래머가 함수 선언 방식을 일관되게 유지할 수 있도록 도와주는 ESLint의 유용한 규칙입니다. 코드를 작성할 때 특정 선언 방식을 따름으로써, 코드의 일관성과 가독성을 높이며 유지 보수를 용이하게 할 수 있습니다. ESLint의 func-style 규칙을 활용해 더욱 깔끔하고 이해하기 쉬운 코드를 작성해 보세요!

Leave a Comment