seunghyun Note

클린코드 챌린지 DAY5 (2024.06.28) 본문

스터디/클린코드 챌린지

클린코드 챌린지 DAY5 (2024.06.28)

승숭슝현 2024. 6. 28. 18:01

TIL (Today I Learned)

2024.06.28

✔️ range

Mission: 더러운 코드를 고쳐라!

✔️ learn

🔍 Mission1

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

// What the heck is 86400000 for?
setTimeout(blastOff, 86400000);
  • 해결 😎

// 1일의 밀리초 = MILLISECONDS_DAY 로 설정

const MILLISECONDS_DAY = 86400000;
setTimeout(blastOFF,MILLISECONDS_DAY);
  • 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해 주세요.

변수에 의미를 두자. MILLISECONDS_DAY는 소문자로 사용할 수도 있지만 변하지 않는 값이기 때문에 대문자로 사용할 수 있다. 변환되는 값들이라면 const와 대문자 대신에 let과 소문자를 사용할 거 같다.

🔍 Mission2

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

const yyyymmdstr = moment().format("YYYY/MM/DD");
  • 해결 😎

const currentDate = moment().format("YYYY/MM/DD");
  • 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해 주세요.

현재날짜 -> currentDate...!

moment(). format("YYYY/MM/DD"); 대충 느낌은 현재 시간인 것은 알았지만 moment()라는 것을 처음 봤다.

Moment.js는 자바스크립트에서 dates를 다루기 깔끔하고 간결한 API이다. 이를 사용하여 날짜와 시간을 분석, 검증, 조작 표시할 수 있다.

🔍 Mission3

  • BAD 더러운 코드 😣

// Hint❕ : 불필요하게 반복하지 마세요.
const Car = {
  carMake: "Honda",
  carModel: "Accord",
  carColor: "Blue"
};

function paintCar(car, color) {
  car.carColor = color;
}
  • 해결 😎

const Car = {
  brand: "Honda",
  model: "Accord",
  color: "Blue"
};

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

  • 어떻게 고쳤는지, 사례에서 무엇을 배워야 하는지 설명해 주세요.

Car 오브젝트가 car이라는 공통이 있으니까 제외시켰고 make보다 brand가 잘 어울릴 거 같아서 마음대로 바꿨다.

 

✔️ impression

무의식적으로 변수 내 마음대로 설정하고, 중복이 많았던 변수들을 생각하니 지난 시간들이 괜히 민망했다. object 같은 공통된 것들을 묶어서 사용한다는 것이 표현하기 좋고 간결하다는 것을 배웠는데 응용할 수 있었다.

영어 공부를 더 해야겠다!

728x90