[portfolio] pick lunch

🧑🏻‍💻 pick lunch

입력한 점심 메뉴 중 하나를 선택해주는 프로그램 제작

> Tech Stack

• HTML, CSS
• JavaScript, jQuery
• Git, GitHub
  
  
  

> What did I do

• 초기화 버튼을 누르면 전체 메뉴가 삭제되는 기능 구현
• 자체 데이터에서 랜덤으로 하나 선택되게 하는 기능 구현
• 배열에 데이터를 저장하여 기능 조작에 따른 데이터 처리(create, read, remove)
  
  

> 기억하고 싶은 code

async/await 구문을 활용한 비동기식 처리

async function pickMenu(...menu) {
  const p = new Promise((resolve, reject) => {
    if (menu.length === 0) {
      alert('메뉴판에 등록된 메뉴가 없습니다.');
    } else {
      setTimeout(() => {
        const randomIndex = Math.floor(Math.random() * menu.length);
        resolve(menu[randomIndex]);
      }, 2000);
    }
  });

  return p;
}

async function getMenu() {
  try {
    const menu = await pickMenu(...menus);
    const result = document.createElement('p');
    result.innerHTML = `오늘의 점심메뉴는 ${menu}!!`;
    const target = document.querySelector('.menu');
    target.append(result);
    $('.modal').slideDown();
  } catch (error) {
    console.log(error.message);
  }
}

$('.btn-pick').click(() => {
  getMenu();
});

> 깃헙주소

https://github.com/deepbm/deepbm/tree/main/portfolio/pick