본문 바로가기

CS/CS Book

[Clean Code] Day07 Practice

mission1.js

// BAD 더러운 코드 😣
// Hint❕ : 검색하기 쉬운 이름을 사용하세요.
// blastOFF는 로켓 발사를 의미. 86400000은 하루의 밀리초 (milliseconds) 의미. 

// What the heck is 86400000 for?
// setTimeout(blastOff, 86400000);

// GOOD 😎
// 위 코드를 깨끗하게 다시 작성해 주세요.
const dayTimeMilliseconds = 24 * 60 * 60 * 1000; milliseconds
setTimeout(blastOff, dayTimeMilliseconds);

// 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해주세요.
/**
* const dayTimeMilliseconds = 24 * 60 * 60 * 1000
  -> 하루를 밀리초로 표현하였습니다
     86400000라고 적을 수도 있겠지만 사람이 작업하다보니 
     0을 한두개 누락시킬수도 있기 쉬우므로 연산을 CPU에서 해야할테지만 
     사람이 보고 알아보기 쉽게 시, 분, 초, 밀리초의 곱셉으로 표현하였습니다
*/

 

mission2.js

// BAD 더러운 코드 😣
// Hint❕ : 의미있는 이름을 사용해주세요.

// const yyyymmdstr = moment().format("YYYY/MM/DD");

// GOOD 😎
// 위 코드를 깨끗하게 다시 작성해 주세요.
const todayStr = moment().format("YYYY/MM/DD");

// 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해주세요.
/**
* yyyymmdstr에서 todayStr 변경하였습니다 today로 할까 했지만 Date()객체가 별도로 있으니까 str을 붙이는게 명시적일거 같아서 이렇게 정하였습니다.
*/

 

mission3.js

// BAD 더러운 코드 😣
// Hint❕ : 불필요하게 반복하지 마세요.

const Car = {
  carMake: "Honda",
  carModel: "Accord",
  carColor: "Blue"
};

function paintCar(car, color) {
  car.carColor = color;
}

// GOOD 😎
// 위 코드를 깨끗하게 다시 작성해 주세요.

// 첫번째 관점, 이미 Car변수를 만듦
const Car = {
  carMake: "Honda",
  carModel: "Accord",
  carColor: "Blue"
};

function paintCar(color) {
  Car.carColor = color;
}

// 두번째 관점
// 변수명과 파라미터명 변경, Bard가 제시한 추천
const car = {
  make: "Honda",
  model: "Accord",
  color: "Blue"
};

function paintCar(car, newColor) {
  car.color = newColor;
}

paintCar(car, "Red");

// 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해주세요.
/**
이번 코드는 의도가 무엇이었는지에 따라 다를거 같습니다

* 첫번째 관점
   함수에서 인자가 적어야한다 하였는데 그 결대로 가면 Car변수에서 이미 값을 가지고 있으니 paintCar(car, color)에서 car부분이 없어도 될거 같습니다

*/

/**
* 두번째 관점
  변수명과 파라미터명 변경
*/

/*
* 세번째 관점
  하지만 함수의 목적은 재사용성이므로 car, color 파라미터가 있는 편이 자연스럽다 생각듭니다.
  그러므로 두번째 관점에서는 수정할 부분이 없다 생각합니다.
*/
  • 역시 연습을 해보고 아닌 것의 차이를 다시한번 몸으로 느낄 수 있었다
  • 책에서 보았을 때 공감했던 클린코드 유형이 막상 예제로 주어졌을 때에는 이상함을 못느끼고 코드를 처음에 만들었을 때 관점에 따라 다를 수 있어서 어떤 관점에서는 바꿀게 없다 생각들기도 했다.
  • 더 궁금해져서 생성형 AI에게 물어보니 이름이 굳이 중복되는 케이스들을 보여주어서 납득되었다
     
const Car = {
  carMake: "Honda",
  carModel: "Accord",
  carColor: "Blue"
};
const car = {
  make: "Honda",
  model: "Accord",
  color: "Blue"
};