10.01 Clean Code JS - 바로 적용해볼 것

목차

 

 

1. Clean Code JS

- 너무너무너무 좋은 내용이다! 내가 항상 목말라하고 찾던 정보였다

- 하지만 전부 반영하긴 힘드니, 꼭 적용해볼 것 위주로 정리를 해보자

 

A. 변수에 대하여

상수 값은 이름 붙인 변수로 관리하기

iterate function의 인자로 자신만 알아볼 수 있는 작명 피하기

 

B. 함수에 대하여

함수 인자는 2개 이하가 이상적이다!

- 인자가 많을 수록 테스팅이 어렵기 때문!

- 만약 필요한 인자가 3개 이상이라면, 그 함수에 너무 많은 역할을 맡기려 하기 때문일 수 있음

- 단일 기능을 함에도 필요한 인자가 많다면, ES6의 비구조화(destructuring) 구문을 사용할 수 있고, 이때의 장점이 있음

  1. 타인이 그 함수의 signature(인자의 타입, return 값의 타입 등)을 볼 때 어떤 속성이 사용되는지 즉시 알 수 있음

  2. 비구조화는 함수에 전달된 인수 객체의 지정된 기본타입 값을 복제하여, 사이드 이펙트가 일어나는 것을 방지함

      단, 인수 객체로부터 비구조화된 객체와 배열은 복제되지 않아 사이드 이펙트에 유의해야 함

  3. Linter를 사용하면 사용하지 않는 인자에 대해 경고해주거나, 비구조화 없이 코드를 짤 수 없게할 수 있음

함수는 하나의 행동만 해야한다

- 소프트웨어 엔지니어링에서 가장 중요한 규칙

- 하나의 행동만 하도록 함수를 구현해야, 코드를 작성 / 테스트 / 이해하는 것도 쉬워짐

매개변수로 플래그를 사용하지 마세요

- 플래그를 사용하는 것 자체가 한가지 이상의 역할을 하고 있다는 것을 의미함

- boolean을 기반으로 실행되는 코드가 나뉜다면, 함수를 분리!

Side Effect를 피하세요(part 1)

Side Effect를 피하세요(part 2)

- JS에서 primitve type은 value를 전달하지만, object & array는 reference를 전달함

- 따라서, 인자로 object와 array를 받았다면, 인자로 받은 object & value가 직접 수정되는 일(side effect)이 없게 코드를 짜는 것이 필요함

- 큰 객체를 직접 복제하려면 ㅈㄴ 귀찮음... immutable.js 같은 lib를 사용해보자

명령형 프로그래밍보다, 함수형(선언적) 프로그래밍을 지향하세요

* 명령형 프로그래밍 vs 선언적 프로그래밍

조건문을 캡슐화 하세요

- 이유 → 선언적으로 프로그래밍을 하기 위해서인듯

부정조건문을 사용하지 마세요

 

C. 동시성(Concurrency)

Async/Await을 사용하자

- 이 때 try-catch 감싸주기 잊지말기!

D. Error Handling

단순히 에러를 확인만 하지 마세요

- 상용 서비스라면, 단순히 에러를 console에 찍고 끝내는게 아니라, 추가 행동이 필요하다

- 유저에게 에러를 알리고 / 에러를 logging하는 건 기본!

 

E. Formatting

왠만하면 함수 호출자를 함수피호출자 바로 위에 위치시키세요

- 코드를 읽는 것도 신문처럼 위에서 아래로 읽기 때문

 

 

 

 

기타

- Objects and Data Structure / Class에 대한 clean code 내용도 있지만, 지금 내 단계에서 당장 적용할 수 있는 건 없어보인다. 나중에 필요할 때 다시 들여다보자!

- 객체지향(OOP) 개발 5대 원리인 SOLID(github, solid 설명)에 대한 내용도 있으나, 이것도 나중에 필요하면 찾아보자! 하지만 이 내용 정도는 필수인듯!