javascript 예제2 lotto

홍요한·2020년 6월 17일
0

JavaScript

목록 보기
4/10
post-thumbnail

lotto 구현하기

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);
        }
const winBalls = shuffle.slice(0, 6).sort((p, c) =>{
            return p - c;
        });
const bonus = shuffle[6];
const resultTag = document.querySelector('#result');
        for(let i = 0; i < 6; i++){
            setTimeout(function(){
                const ball = document.createElement('div');
                ball.className = 'ball';    
                if(winBalls[i] <= 10){
                    ball.style.backgroundColor = 'red';
                } else if(winBalls[i] <= 20){
                    ball.style.backgroundColor = 'orange';
                } else if(winBalls[i] <= 30){
                    ball.style.backgroundColor = 'green';
                } else {
                    ball.style.backgroundColor = 'blue';
                }
                ball.textContent = winBalls[i];
                resultTag.appendChild(ball);
            }, 1000 * (i + 1)) //1초씩 뜨게함,
        }
setTimeout(()=>{
            const bonusTag = document.querySelector('#bonus')
            const bonusBall = document.createElement('div');
            bonusBall.className = 'ball';
            bonusBall.textContent = bonus;
            bonusTag.appendChild(bonusBall);
            bonusBall.style.backgroundColor = 'black';
        }, 7500)

sort 매서드

정렬하는 매서드 = sort() ※주의 : 사전순으로 정렬이 됨.
따라서 자릿수가 바뀌면 정렬이 제대로 되지 않는다.
result) [10, 20, 30, 40, 7]

일반함수 sort(function(p,c)){}
화살표 함수 sort((p, c) =>{}

본 코드에선 화살표함수를 사용해
p : 앞숫자, c : 뒤숫자 를 이용해 p - c 으로 계산한다.
return 값이 0보다 크면 앞으로 자리를 바꾸기 때문에 제대로
정렬이 된다.
ex) 40 - 10 = 30 이기 때문에 30은 앞자리로 간다.
결국 가장작은값이 앞으로 가고 가장큰값이 뒤로 옴(정렬)
result) [7, 10, 20, 30, 40]

0개의 댓글