<aside> 💡 [목적] 코딩 컨벤션은 코드 가독성과 이해를 증진시키며, 일관된 스타일을 통해 협업과 유지보수를 용이하게 만듭니다. 자바스크립트의 유연성과 특성으로부터 오는 혼란을 줄여주고, 효율적인 코드 작성을 돕습니다.

[적용효과] 코딩 컨벤션을 준수하면 가독성이 좋아지고, 성능에 영향을 주거나 오류를 발생시키는 잠재적 위험 요소를 줄여줍니다. 특히 프로젝트의 규모가 커질 수록 유지보수 비용을 줄이는 데 도움이 된다.

프로그램의 성능을 해치지 않은 범위 내에서 가독성과 관리 용이성을 우선하여 작성하였습니다.

</aside>

목차

참고 이 문서는 ES5 이상을 다루며 ES6를 기준으로 작성하였다. ES5에서 지켜야할 컨벤션은 (ES5)태그를 달아 구분하였다.

들여쓰기 (Indentation)

1. 들여쓰기 스타일:

• 공백 문자(스페이스)를 사용하거나 탭(Tab) 문자를 사용할 수 있습니다. 중요한 것은 일관된 스타일을 유지하는 것입니다.

  // 스페이스를 사용한 들여쓰기 (권장)
  function exampleFunction() {
    if (condition) {
      // 코드 블록
    }
  }
  
  // 탭을 사용한 들여쓰기
  function exampleFunction() {
  	if (condition) {
  		// 코드 블록
  	}
  }
  

2. 들여쓰기 크기:

• 들여쓰기 크기는 2개의 스페이스를 사용합니다.

  // 2개의 스페이스를 사용한 들여쓰기 (권장)
  function exampleFunction() {
    if (condition) {
      // 코드 블록
    }
  }
  

3. 중괄호 위치:

• 중괄호를 열린 줄의 끝에 두어 작성합니다.

  // 좋은 예
  function exampleFunction() {
    if (condition) {
      // 코드 블록
    }
  }
  
  // 좋지 않은 예
  function exampleFunction()
  {
    if (condition)
    {
      // 코드 블록
    }
  }
  
  

4. 콤마 위치:

• 객체 리터럴이나 배열 등에서 콤마는 항상 요소 뒤에 위치합니다.

  // 좋은 예
  const myArray = [1, 2, 3];
  
  const myObject = {
    property1: 'value1',
    property2: 'value2',
  };
  
  // 좋지 않은 예
  const myArray = [1, 2, 3,];
  
  const myObject = {
    property1: 'value1',
    property2: 'value2',
  };
  
  

명명 규칙 (Naming Conventions)

<aside> 💡 원문 : USER LOGIN LOG 카멜(Camel)식: userLoginLog 파스칼(Pascal)식: UserLoginLo 케밥(Kebab)식: user-login-log 스네이크(Snake)식: user_login_log 또는 USER_LOGIN_LOG

</aside>

1. 변수 (Variables):

   • Camel Case를 사용하며, 변수명은 명사나 명사구로 지정합니다.

   • 해당 변수가 나타내는 데이터 또는 역할을 명확하게 표현해야 합니다.

   • 약어는 최소화하며 가능한한 의미 있는 단어를 사용합니다.

     // 좋지 않은 예
     let x = 10;
     
     // 좋은 예
     let itemCount = 10;
     

2. 상수 (Constants):

   • 상수는 대문자와 언더스코어를 사용하여 명명하며, 단어 사이에 언더스코어(_)를 삽입합니다.

     const MAX_COUNT = 100;