깨끗한 코드를 위한 5가지 팁

Blackeichi·2023년 1월 5일

🤔 왜 클린코드가 필요할까?

좋은 코드란 그냥 작동만하기만 하는 코드가 아니다! 좋은 코드란 코드 그 자체로 설명이 다 되는 코드이다.

만약 팀으로 일한다면 팀원들이 읽기만 해도 무엇인지 이해를 할 수 있고 내가 나중에 몇 개월, 혹은 몇 년이 지났을 때 내가 작성했던 코드를 읽고 이해를 할 수 있어야 훌륭한 코드의 모습이라고 할 수 있다.

이를 위해서 클린코드가 필요한 것이다!

첫번째. 검색이 가능한 이름을 써라

코딩을 하다보면 랜덤하게 값을 추가해야할 때가 있다.
예를 들어 다음과 같은 코드가 있다고 칠 때,

setInterval(doSomeThing(), 86400);

위의 숫자를 모르는 사람이 보면 뭔지 모를 것이다.
이럴 때는 숫자를 검색이 가능한 변수로 해두는 것이 좋다.

const SECONDS_IN_A_DAY = 86400;
//보통 절대 안변하는 상수는 모두 대문자로 표기한다.
setInterval(doSomeThing(), SECONDS_IN_A_DAY);

두번째. 함수명은 반드시 동사를 써라

함수명을 만들 때 명사로 만들기 보다는 행위, 역활이 담겨있는 동사를 사용하는 것이 좋다.
만약 유저와 관련된 함수가 존재하면

function userData(){
}
const data = userData();

이렇게 막연하게 사용하는 것보다 각 기능에 따라 함수를 쪼개서 동사를 사용하여 나타내는 것이 좋다.(함수는 단 한가지 액션만 수행해야한다.)

function getUserId(){
	//유저 id를 가져오는 코드(input or 쿠키 등등)
}
function getUserData(){
	const user = getUserId()
	// 가져온 유저 id를 사용하여 userData를 가져오는 코드 작성
}
const userData = getUserData();

세번째. 인수

인수로 가장 좋은 수는 3개 이하이다. 인수가 너무 많아 지면 다른 사람이 봤을 때 이해하기 어려울 수 있다.

function test(age,id,profile,number,name){}

test(35,2,"hi",11,"name")

예를 들어 위와 같으면 어떤 인수가 무엇을 하는지 몹시 혼란스러울 것이다.

만약 함수에 인수를 많이 넣어야 한다면 다음처럼 한개의 configuration object를 보내는 것이 좋다.

function test({age,id,profile,number,name}){}

test({age : 35,
	id : 2,
    profile : "hi",
    number : 11,
    name : "name"})

이렇게!! 그럼 처음보는 사람도 인수의 역활을 파악하기 쉬울 것이다.

네번째. boolean 값을 인수로 함수에 보내는 것을 최대한 방지하기

boolean 값, 즉 true나 false를 함수에 보내는 것은 그 함수안에 if, else가 있다는 뜻인데 이것은 if와 else를 따로 함수로 분리해서 사용하는 것이 좋다.
그래서 boolean값을 인수를 주는 것이 아닌 한개의 액션만을 하는 함수를 만드는 것이 좋다.