JS 코딩 컨벤션
자바스크립트 작성 규칙 정리
- 소스 파일 기본 규칙
- 소스 파일의 이름은 알파벳 소문자, 하이픈(-), 언더바(_)로만 작성한다.
- 소스 파일의 확장자는 .js로 통일한다.
- 소스 파일의 인코딩은 UTF-8을 이용한다.
- 한 행에 하나의 명령만을 작성한다.
- 1행당 문자의 최대 수는 80자 이내로 한다.
- 파일의 맨 끝은 개행한다.
- 세미콜론이 필수는 아닌 언어이지만 반드시 붙여준다.
- 공백
- 들여쓰기에 탭을 이용하지 않고 스페이스 2개로 표현한다.
- 공백에 스페이스와 탭을 섞어 쓰지 않는다.
- 콤마와 세미콜론의 뒤에 공백을 넣는다.
- 함수나 객체 등을 정의한 블록의 전후에는 공백 행을 넣는다.
- 공백 행을 연속으로 2개 이상 사용하지 않는다.
- 구문
3-1. 명명 규칙
- 변수명과 함수명은 camelCase를 따라서 작성한다. (예] getReady(), speedOfCar)
- 상수명은 대문자의 언더 스코어 방식을 이용한다. (예] PI, MAX_VERTEX)
- 생성자와 클래스명은 PascalCase를 따라서 작성한다. (예] ImClass)
- 프라이빗 멤버(클래스의 private 멤버 변수)들은 언더바(_)로 시작한다. (예] _name, _id)
- 이벤트 핸들러 함수들은 'on'이라는 단어로 시작한다. (예] onclick, onload)
- 명명할 때 축약어 보다는 의미를 살린 긴 이름을 이용하도록 한다.
3-2. 중괄호 블록 - 중괄호 블록을 열기 전에 개행하지 않는다.
- 중괄호 블록을 닫기 전에 개행한다.
3-3. 제어문
- 제어문 키워드 뒤에 한 칸의 공백을 가지고 괄호를 사용한다.
- 중괄호는 모든 제어문에서 한 줄의 명령을 가지더라도 반드시 포함해야 한다.
- 단, if문에 대해서는 하나의 한 줄의 명령을 가지면 같은 라인에 명령을 작성하고 중괄호를 생략 가능하다.
- 조건문의 조건부는 간단하게 기술한다.
3-4. 변수
- 변수 선언에서 var의 사용 대신 let이나 const를 이용한다.
- 한 번의 선언에서는 하나의 변수만을 선언한다.
- 문자열을 사용할 때는 큰 따옴표(")보단 작은 따옴표(')를 이용한다.
3-5. 기타 구문
- ==과 != 대신에 ===과 !==을 이용한다.
- 숫자는 2/8/10/16진수로 표기하며, b/o/x 이후에 불필요한 0은 표기하지 않는다.
- 문자열에서 eval() 함수는 사용하지 않는다.
- return문을 위한 불필요한 변수 선언은 자제한다
React 코딩 컨벤션
리액트 작성 규칙 정리
-
components 이름은 Pascal case로 작성해라.
pascal case : 첫 단어를 대문자로 시작하는 표기법 -
Non-components 이름은 Camel case로 작성해라.
Camel case : 띄어쓰기 대신 대문자로 단어를 구분하는 표기 방식
(변수, 함수명.. 도 카멜 케이스) -
보통 이벤트 핸들러를 받는 prop 이름은 on~으로 짓고, 이벤트 함수 이름은 handle~로 짓는다.
📌 참고자료
https://phrygia.github.io/react/2022-04-05-react/
https://doodreamcode.tistory.com/176
JS 네이밍 규칙
https://recordboy.github.io/2020/02/05/javascript-naming-convension/
React 네이밍 규칙
https://phrygia.github.io/react/2022-04-05-react/
https://3-stack.tistory.com/53
비동기 함수
https://gyyeom.tistory.com/87
useRef, useState
https://nukw0n-dev.tistory.com/14
