Eslint로 배운 자바스크립트 코딩 컨벤션 (에어비엔비 베이스)

괄호 안에는 룰 이름을 적어두겠습니다.

 

변수 관련

 

- 변수 네이밍 => camelCase 예시 const someData = { id : 1 }

 

- var 는 사용하지 않을 것 ( no-var ),

    권고 방법 :

   선언한 변수에 값이 변경되는 일이 없다면  => const 사용,  변경 되는 일이 있다면 => let 사용

 

---

함수 관련

 

1.  (class-methods-use-this)  클래스 메소드에서 this 키워드를 사용하지 않을 경우

   => static 메소드로 변경해주거나 this 키워드를 사용

 

 

2. (arrow-parens) arrow function의 파라미터가 한개일 경우 괄호 제거 권고

const someFunction = (someVar) => { } => 파라미터가 한개일 경우 괄호 제거 권고

  권고 방법 : 

const someFunction = someVar => { }

 

//2022-09-26 추가

 

3. (no-param-reassign) 넘겨받은 파라미터를 재정의하지 말것

 

예시 :

const someFunction = param => {
	param++
	console.log(param)
}

someFunction(1)

권고 방법 :

const someFunction = param1 => {
	let param2 = param1
	param2++
	console.log(param2)
}

someFunction(1)

 

---

오브젝트 관련

 

1. (object-shorthand)

const someObject = {

      id : id,

      name : name,

      someFunction : function () {}

}

 

 오브젝트의 키 이름과 변수명이 같을 경우, 또 오브젝트 안에 함수가 들어갈 경우

권고 방법 :

const someObject = {

      id,

      name,

      someFunction () {}

}

 

키이름만 적어주고

 

함수의 경우에도 생략하고 바로 함수선언을 할 것을 권고함.

---

비동기 관련 

 

1. (no-await-loop) : 반복문 안에서 await 키워드 사용 중단 권고

 

for (const data of dataList) {

	await fetchData(data)

})

 

권고 방법 :

 

1-1.  for await 문 사용 // 차례차례 비동기 통신이 끝날때까지 대기함

for await (const data of dataList) {

    await fetchData(data)

})

 

1-2. Promise.all로 한번에 비동기 통신처리

const awaitList = dataList.map(data => fetchData(data)) // ( pending 상태의 promise들을 반환한다는 가정 )

await Promise.all(awaitList) // 한번에 비동기 처리

 

--2022-09-17 추가--

---

strict 관련

 

1. (strict): es5,6에선 use strict 사용 지양

 

es5,6에선 이미 기본적으로 엄격하게 검사가 되고 있기 때문에 명시하지 않아도 됩니다.

 

 

 

생각나는대로 업데이트 하겠습니다 혹시나 제가 틀린 부분이 있다면 지적 부탁드립니다.