클린코드

클린코드

클린코드라는 것은 읽기좋은 코드 즉 가독성 있는 코드를 말합니다. 클린코드를 위한 4가지 조건을 알아보겠습니다.

 

1. 이름 ( 코딩컨벤션 )

이름을 짓는 것은 읽기 좋은 코드를 만드는데 필수 요소이므로 다음과 같은 요소들을 고려한다면 가독성 높은 코드들을 구현할수있습니다.

1. 함수는 목적에 맞게 이름이 지어져 있는가?
2. 함수 안의 내용은 이름에 어울리게 하나의 로직을 담고 있는가?
3. 함수는 동사 + 명사이며 함수의 의도를 충분히 반영하고 있는가? 
4. 함수는 카멜표기법 또는 _를 중간에 사용했는가?
5. 변수는 명사이며 의미 있는 이름을 지었는가? 

add() 함수명은 포괄적이라 해당 함수가 어떤 로직을 담고있는지 유추하기 힘듭니다. 반면, addSemicolon()함수는 동사+명사의 형태를 가지며 함수 로직의 의도를 충분히 반영하고 있습니다.

function add(value) {
	return value + ";";
}

function addSemicolon(value){
	return value + ";";
}

 

---

2. 의도가 드러난 구현 패턴

아래와 같은 코드에서 180이라는 값이 무엇을 의마하는지 알수가 없습니다. 

var b = b * 180;

180이라는 숫자 대신 변수로 저장하고 변수에 적절한 이름을 써야 의도가 드러난 코드가 됩니다.

var height = 180;
var b = b * height;

 

---

3. 불필요한 전역변수 줄이기

다양한 함수에서 어떤 변수의 값을 공유해야한다면, 전역변수를 유용하게 사용할수 있습니다. 그러나 함수 내에서만 사용되는 변수를 전역변수로 둘 경우 추후 디버깅이 어려워 버그잡기가 어려워지거나 코드가 많아질 경우 수정이 어려울수 있습니다.

 

a 라는 변수는 전역으로 선언하지 않아도 사용가능하니 exec() 함수안에 지역변수로 선언해야합니다.

//수정전
var a = 'hello';

function print(value) {
   console.log(value);
}

function exec() {
   var data = "world";
   a = a + " ";
   print(a + data)
}

//수정 후
function print(value) {
   console.log(value);
}

function exec() {
   var a = 'hello';
   var data = "world";
   a = a + " ";
   print(a + data)
}

 

---

4. if 중첩문 없애기

return 문을 적절하게 사용해 if 문이 중첩되는것을 해결할수 있습니다.

//수정 전
function foo(pobi,crong) {
  if(pobi) { 
    if(crong) {
      return true;
    }
  }
}

//수정후
function foo(pobi,crong) {
  if(!pobi) return;
  if(crong) {
    return true;
  }
}

 

 

---

출처

1. https://www.edwith.org/boostcourse-web/lecture/16786/

[LECTURE] 3) 클린코드 : edwith