실제코드 작성시엔 화면에 표시부분을 나눠야 할 가능성이 크다
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>로또추첨기</title>
<style>
.ball {
display: inline-block;
border: 1px solid black;
border-radius: 20px;
width: 40px;
height: 40px;
line-height: 40px;
font-size: 20px;
text-align: center;
margin-right: 20px;
}
</style>
</head>
<body>
<div id = "result">추첨 결과는?</div>
<div id = "bonus">보너스 : </div>
<script>
</script>
</body>
</html>
공뽑기 - 피셔 예이츠 셔플
script 태그 내에 작성
<script>
const candidate = Array(45).fill().map( (v , i)=> i + 1);
const shuffle = [];
while(candidate.length > 0){
const random = Math.floor(Math.random() * candidate.length);
const spliceArray = candidate.splice(random , 1);
const value = spliceArray[0];
shuffle.push(value);
}
console.log(shuffle);
</script>
뽑은 공을 정렬 - console.log(shuffle); 아래에 추가
console.log(shuffle);
const winBalls = shuffle.slice(0 , 6).sort( (a, b) => a - b);
const bonus = shuffle[6];
console.log(winBalls , bonus);