ESLint의 curly 규칙: 코드 안정성과 가독성 향상을 위한 중괄호

ESLint의 curly 규칙은 JavaScript 코드에서 제어 구문의 중괄호({}) 사용을 일관되게 강제합니다. 이 규칙의 주요 목적은 코드의 가독성을 높이고 잠재적인 버그를 방지하는 것인데요.

"curly"는 곱슬곱슬한 머리카락을 의미하는 "curl"에서 유래했습니다. 이 룰은 중괄호({})가 곱슬곱슬하게 생긴 모양을 가리키는데요.

JavaScript 문법의 특성: JavaScript에서는 if, for, while 등의 제어 구문에서 단일 문장일 경우 중괄호를 생략할 수 있습니다. 그러나 이러한 문법적 유연성은 때때로 예기치 않은 동작을 초래할 수 있는데요. 중괄호를 생략할 경우, 다중 문장 중 오직 첫 번째 문장만이 조건부로 실행되고, 나머지 문장들은 조건과 무관하게 항상 실행됩니다. 예를 들어:

if (condition)
    doSomething();
    doSomethingElse(); 

이 코드에서 doSomethingElse()는 condition의 값과 관계없이 항상 실행됩니다.

따라서 중괄호를 일관되게 사용하면 이러한 잠재적 오류를 방지할 수 있는데요.

if (condition) {
    doSomething();
    doSomethingElse(); // condition이 true일 때만 실행
}

이런 방식은 코드의 의도를 명확히 하고, 버그를 방지할 수 있습니다.

curly 규칙 구현은 간단한데요. ESLint 설정 파일(.eslintrc)에서 다음과 같이 규칙을 활성화할 수 있습니다:

{
    "rules": {
        "curly": "warn" // 또는 "error"
    }
}

이런 규칙은 특히 팀 프로젝트에서 일관된 코딩 스타일을 유지하는 데 유용합니다. 예를 들어, 단일 라인 if 문을 금지하는 팀 가이드라인이 있다면, 이 ESLint 규칙을 통해 자동으로 강제할 수 있습니다.

curly 규칙을 포함한 적절한 ESLint 설정은 코드의 일관성, 가독성, 그리고 안정성을 향상시킬 수 있습니다. 이는 개발 팀의 생산성 향상과 버그 감소로 이어질 수 있으므로, ESLint 규칙을 통해 자동화 하는것을 추천드립니다.

https://eslint.org/docs/latest/rules/curly