Programming

효과적인 코드리뷰 방법

jay-dev 2023. 6. 26. 19:19

리뷰 규칙

1. 왜 개선이 필요한지 충분한 이유 설명

주관적이거나 추상한 표현은 지양
리뷰이가 개선의 필요성을 느낄 수 있도록 구체적인 이유 작성

예)

const data = [
  ['데이터베이스', 'A', 3],
  ['교양영어', 'B+', 1],
  ['철학', 'A', 2]
];

“data라는 이름은 현재의 자료구조가 무엇인지 그 의도를 알기가 어렵네요.
학점 정보를 담고 있는 자료구조 같은데 이와 관련된 변수명을 짓는다면
현재 정의한 자료구조가 무엇인지 그 의도를 쉽게 파악할 수 있을 것 같아요.”

2. 답을 알려주기보다 개선 방법을 선택하고 고민하게끔

답을 알려주는 코드 지양
리뷰이 입장에서 학습할 기회를 갖고 스스로 코드를 리팩토링할 수 있게 함

예)

const result = [];
arr.forEach(item => {
  if(item % 2 === 0) {
    result.push(item);
  }
});

“자바스크립트에는 배열에는 다양한 내장 메서드들이 존재합니다.
그중 filter 메서드를 활용해 보세요.
이 메서드를 활용하면 코드량을 줄일 수 있습니다.”

3. 클린 코드, 일관된 코드 지향

코드의 품질과 가독성을 높이기 위해 클린 코드 지향
코드 컨벤션을 지키면서 코드를 작성
일관되지 않은 코드를 알려주고 수정 방법을 제안

예)

const checkNumber = (comNum, myNum) => {
  return myNum.reduce((prev, curr) => {
    if (comNum[curr]) return prev + 1;
    return prev;
  }, 0);
}
function calculateEarningRate(list, totalPrizeMoney, investMoney) {
  const result = [];
  for(let i=0; i < list.length; i += 1) {
    result.push((list[i] / investMoney) * 100);
  }
  return result;
}

"함수를 선언하는 두 가지 방식(함수 표현식, 함수 선언식)을 사용했는데
특별한 이유가 아니라면 함수를 선언하는 방식을 스스로 정하고 그 컨벤션 규칙을
따르도록 해보세요. 일관되게 동작하는 코드는 훨씬 보기 좋고 쉽게 수정할 수 있습니다.
그리고 reduce를 통해서 새로운 자료구조를 만든 건 잘했습니다.
하지만 같은 반복처리를 하는 과정에서 calculateEarningRate 에서
for문을 사용한 건 아쉽네요. reduce와 비슷한 방식의 다른 고차 함수를 찾아서
써보면 더 일관된 코드를 유지할 수 있을 거 같습니다."

4. 리뷰 과정이 숙제검사가 아닌 학습과정으로 느낄 수 있게끔

코드 리뷰를 하는 목적은 서로 생각을 공유하고 좀 더 깔끔한 코드를 작성하기 위함

예)

class Component {
    constructor(node) {
        this.node = node;
    }

    render(child) {
        this.node.appendChild(child);
    }
}

class Header extends Component {
    constructor(node) {
        super(node);
    }
}

class List extends Component {
    constructor(node) {
        super(node);
    }
}

"Component 클래스를 상속 받는 건 좋네요.
그러나 자식 클래스에서 부모 클래스를 호출만 하기 때문에 모든 클래스에서
상속받는 건 오히려 중복 코드 같아 보이기도 하는데 이렇게 작성해 주신 이유가 있을까요?"

5. 리뷰를 위한 리뷰를 지양 / 피드백 할 것이 없다면 칭찬

"코드량이 적당해서 읽기 편하네요"
"많은 고민이 코드에서 엿보이네요"
"성능에 아주 유리한 코드라고 생각되네요"
"전에 코드보다 훨씬 좋아진 거 같네요"
"예외 처리가 꽤 꼼꼼해서 좋네요"
"함수, 변수명이 직관적이어서 좋네요"

참고 - Kakao Tech 효과적인 코드리뷰를 위한 리뷰어의 자세

'Programming' 카테고리의 다른 글

[React] Virtual DOM  (0) 2023.06.26
[WIL] week2 회고  (0) 2023.06.26
[알고리즘] 양옆앞뒤 큰 수 찾기  (0) 2023.06.26
[알고리즘] 프로그래머스 체육복  (0) 2023.06.26
[알고리즘] 프로그래머스 폰켓몬  (0) 2023.06.26