ロット番号

ロット番号

ちくじず
数字

1~45を用意します.

の数字を混合します.
2-1ランダム値を作成します.(45桁の期間)
2-2. 値をランダムに抽出してSpliceArray配列に入れます.再び値をvalue値に保存し、変数shuffleを入れます.

球を7個抽出します.
3-1変数winBallsに変数shuffleの最初の数字から6番目の数字を入力し、低い数字で並べ替えます.
3-2. 最後のボールは加点球です.

秒ごとに画面にボールが表示されます.

終了

数字

1~45を用意します.
変数候補を作成し、45個の空の配列を作成し、mapで45個の数値を作成して挿入します.

const candidate = Array(45).fill().map((v,i)=>i+1);

の数字を混合します.
ランダムランダム値を作成します.

(45)

while( candidate.length > 0 ){
  const random = Math.floor(Math.random() * candidate.length);
}

ランダムに抽出された

の値を1つずつ接合アレイに入れます.再び値をvalue値に保存し、変数shuffleを入れます.

const spliceArray = candidate.splice(random, 1);
const value = spliceArray[0];
shuffle.push(value);

球を7個抽出します.
変数winBallsに変数shuffleの最初の数字から6番目の数字を入力し、低い数字でソートします.

const winBalls = shuffle.slice(0,6).sort((a,b)=>a-b);

の最後のボールは加点球です.

const bouns = shuffle[6];

秒ごとに画面にボールが表示されます.

const $result = document.querySelector('#result');
const $bouns = document.querySelector('#bonus');

const showBall = (number, $target) => {
  const $ball = document.createElement('div');
  $ball.className = 'ball';
  $ball.textContent = number;
  $target.appendChild($ball);
}

for( let i=0; i<6; i++ ){
  setTimeout(()=>{
    showBall(winBalls[i], $result);
  }, 1000*i)
}

//보너스볼
setTimeout(()=>{
  showBall(bouns, $bouns);
}, 7000)

が終了しました.ボーナス宝くじの番号が10未満の場合は赤、20未満の場合はオレンジ、30未満の場合は黄色、40未満の場合は青、40からは緑の球:

const showBall = (number, $target) => {
  const $ball = document.createElement('div');
  $ball.className = 'ball';
  $ball.textContent = number;
  if( number < 10 ){
    $ball.style.backgroundColor = 'red';
  } else if( number < 20 ){
    $ball.style.backgroundColor = 'orange';
  } else if( number < 30 ){
    $ball.style.backgroundColor = 'yellow';
  } else if( number < 40 ){
    $ball.style.backgroundColor = 'blue';
  } else if( number >= 40 ){
    $ball.style.backgroundColor = 'green';
  }
  $target.appendChild($ball);
}

ツールバーの
.slice()
slice()メソッドは、配列の開始から終了(終了を含まない)までの浅いコピーを新しい配列オブジェクトに返します.元の案は変わらない.(せん断()差

//문법
Array.prototype.slice()
arr.slice(start[, end])

start:開始点のインデックスを抽出します.

未定義:0からslice

の負数を指定した場合:配列の末尾の長さを表します.slice(-2)は、配列の最後の2つの要素を抽出します.

指定した長さが

アレイの長さ以上である場合、空のアレイが返されます.

end:抽出された条件インデックスを終了します.(endを除き、前の要素のみ抽出されます.)

が指定されていない場合:Slice

からアレイの末尾まで

の負数を指定した場合:配列の末尾の長さを表します.slice(2,-1)3番目の要素から2番目の要素まで

を抽出する
指定した配列の長さが

以上である場合、配列の末尾が抽出されます.

45個の数値抽出の最初の値は、ランダムランダムランダムランダムランダム値を生成する候補変数に格納される.

//사용코드
const candidate = Array(45).fill().map((v,i)=>{return i+1});
while( candidate.length > 0 ){
  const random = Math.floor(Math.random() * candidate.length); //무작위 인덱스 뽑기
  const spliceArray = candidate.splice(random, 1); // 뽑은 값은 배열에 들어 있음
}

sort()
sort()メソッドは、配列内の要素を適切な位置に並べ替え、配列を返します.

//구문
arr.sort([compareFunction])

比較機能-ソート順を定義する関数

//예제
var numbers = [4, 2, 5, 1, 3];
numbers.sort(function(a, b) {
  return a - b;
});
console.log(numbers); // [1, 2, 3, 4, 5]

変数winBallsでshuffle変数0から5(1番目から6番目)をクリップした後、数字は小さい順に並べられます.

//사용코드
const winBalls = shuffle.slice(0,6).sort((a,b)=>a-b);

//큰 순서로 정렬 할 경우 - b-a정렬
const winBalls = shuffle.slice(0,6).sort((a,b)=>b-a);

完全なコード
html

<div id="result">추첨 결과는? </div>
<div id="bonus">보너스: </div>

css

    .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;
    }

javascript

  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((a,b)=>a-b);
  const bouns = shuffle[6]

  console.log(winBalls, bouns);

  const $result = document.querySelector('#result');
  const $bonus = document.querySelector('#bonus');

  const showBall = (number, $target) => {

  }

  for( let i=0; i<winBalls.length; i++ ){
    setTimeout(()=>{
      const $ball = document.createElement('div');
      $ball.className = 'ball';
      $ball.textContent = winBalls[i];
      $result.appendChild($ball);
    }, 1000*i);     
  }

  setTimeout(()=>{
    const $ball = document.createElement('div');
    $ball.className = 'ball';
    $ball.textContent = bouns;
    $bonus.appendChild($ball);
  }, 7000)