피드로 돌아가기
Lunch Picker
Dev.toDev.to
Frontend

Lunch Picker

JavaScript 배열 메서드를 활용한 Lunch Picker 프로그램으로 add/remove/random select 기능 구현

O. Francesco2026년 3월 26일3beginner

Technical Solution

  • addLunchToEnd() 함수로 배열 끝에 아이템 추가: arr.push() 메서드 사용
  • addLunchToStart() 함수로 배열 앞에 아이템 추가: arr.unshift() 메서드 사용
  • removeLastLunch() 함수로 배열 마지막 요소 제거: arr.pop() 메서드 사용 후 길이 체크
  • removeFirstLunch() 함수로 배열 첫 번째 요소 제거: arr.shift() 메서드 사용 후 길이 체크
  • getRandomLunch() 함수로 배열에서 임의 요소 선택: Math.floor(Math.random() * arr.length) 조합으로 인덱스 계산
  • showLunchMenu() 함수로 메뉴 전체 표시: arr.join(", ") 메서드로 문자열 변환

Key Takeaway

배열의 기본 조작 메서드(push, pop, shift, unshift)와 Math 객체의 난수 생성을 결합하면 간단한 목록 관리 및 선택 기능을 구현할 수 있다.


JavaScript로 선택지 관리 기능이 필요한 클라이언트에서 배열 메서드와 Math.floor(Math.random()) 조합을 사용하면 별도 라이브러리 없이 기본 추가/제거/무작위 선택 기능을 3~5줄의 코드로 구현할 수 있다.

원문 읽기