[React] MAP함수2

지난 번 공부했던 map함수에 이어 하나만 더 연습을 해보기로 하였다.

저번에 하던 것에 이어, menus라는 배열을 하나 더 만들었는데,
오늘 메뉴는 치킨!, 사이드 메뉴는 맥주!
이런 식으로 출력결과가 나오도록 map함수를 사용하여 작성해보면..

      <h1>오늘의 메뉴👀</h1>
      <ul>
        {menus.map((food, idx) => (
          <li key={idx}>
            오늘의 메뉴는 {food.menu}, 사이드 메뉴는 {food.side}!
          </li>
        ))}
      </ul>

이렇게 작성해볼 수 있다.
이번에는 지난 번과 달리 key값을 menu배열의 값들 중에서 선택하기 애매한 상황이었기 때문에 index값을 사용하였는데(idx), 이 index 사용이 싫다면 배열에 id값을 넣는 것도 좋은 방안이 될 수 있다.