코딩공부

[15m] 도전문제2 완료

milimiliemilie 2025. 2. 25. 22:40

# 오늘 한 것

 - 도전문제 2 완료

// 도전문제 2: 레시피 id를 입력하면, (1) 재료를 알려주고, (2) 만드는 법을 알려준다. ( Console.log로 찍기 )
// 필요한 함수: (1) 재료를 알려주는 함수 (2) 만드는 법을 알려주는 함수 (3) 1, 2를 console.log로 찍는 함수
// 필요한 객체: Recipe (ingredients, howto) ... 샘플 2개

// 1) Recipe (ingredients, howto) ... 샘플 2개 만들기
function Recipe (recName, ingr, howto) {
    this.recName = recName
    this.ingr = ingr
    this.howto = howto
}

rec1 = new Recipe ('팽이버섯 호박나물', '애호박, 팽이버섯, 다진마늘', '애호박과 팽이버섯을 다지고, 다진마늘 3g을 넣고 고압찜 25분을 돌려준다.')
rec2 = new Recipe ('청경채 돼지찜', '청경채, 돼지고기', '잘 씻은 청경채를 다져서 돼지고기와 섞은 다음, 고압찜 35분을 돌려준다.')

// 2) 재료를 알려주는 함수 만들기 (ingredients -> return에 담는다)
function Ingr (Recipe) {
    return Recipe.ingr
}

// 3) 만드는 법 알려주는 함수 만들기 (howto -> return에 담는다)
function HowTo (Recipe) {
    return Recipe.howto
}

// 4) 재료, 만드는 법을 console.log로 찍는 함수 만들기
//    (return1 = ingr, return2 = howto,
//    console.log('요리이름:', name), ('재료:', ingr), ('만드는 법:', howto)
function callRec (Recipe, func1, func2) {
    recName = Recipe.recName
    ingr = func1(Recipe)
    howto = func2(Recipe)
    console.log('요리이름:', recName)
    console.log('재료:', ingr)
    console.log('만드는 법:', howto)
}

callRec (rec1, Ingr, HowTo)
callRec (rec2, Ingr, HowTo)

 

[Running] node "c:\src\250212js\callback_test_2.js"
요리이름: 팽이버섯 호박나물
재료: 애호박, 팽이버섯, 다진마늘
만드는 법: 애호박과 팽이버섯을 다지고, 다진마늘 3g을 넣고 고압찜 25분을 돌려준다.
요리이름: 청경채 돼지찜
재료: 청경채, 돼지고기
만드는 법: 잘 씻은 청경채를 다져서 돼지고기와 섞은 다음, 고압찜 35분을 돌려준다.

 

 

# Notes

 - 오늘 만든 건 함수들이 쉬워서, 굳이 callback function으로 쓰지 않고 recName = Recipe.recName  하는 식으로 써도 되기는 했다. 하지만 조금이라도 복잡해진다면 아마 callback function을 써야 덜 헷갈리고, 나중에 유지보수나 개선도 가능할 것 같다. 

 

 - 예를 들자면, 이번에는 하나의 string으로만 된 요소들로 Recipe 객체들이 구성되어 있었다. 하지만 만약 ingredients가 여러개이고 그걸 list처럼 구성한다든지, 아니면 howto 부분을 1번, 2번, 3번, ... 하는 식으로 순서대로 구성한다든지 하면 조금 복잡해질 것이다. 실제로 앱을 만든다면 아마 그렇게 해야 각각의 재료들을 따로 관리하고 매칭한다거나 (예: 냉털 레시피 추천, 재료 가짓수 3가지 이하 레시피 모음), 순서대로 1번, 2번, 3번 하는 식으로 만드는 법을 넘버링하여 화면에 차례로 표시해준다거나 할 수 있을 것이다.

 

 

# 다음에 할 것

 - 도전문제 2번을 변형하기. (아마 for each i 를 써야 할 것)

1) ingredients는 각각을 하나의 요소로 취급해서, '재료: (총n개)'를 띄운다.

2) howto는 넘버링을 해준다. 

 

 - async-await 따라해보기. (하다 말았음): https://milimiliemilie.tistory.com/11 여기의 JS Crash course 참고.