【JS】重複しないランダムな三桁の数字を作る

コード

sample.js

// ランダムな三桁の数字
function three_random_number() {
  const three_digit_number = [];

  for (let i = 0; three_digit_number.length < 3; i++) {
    const number = Math.floor(Math.random() * 10)

    if(!three_digit_number.includes(number)){ 
      three_digit_number.push(number);
    }
  }

  console.log(three_digit_number);
}

three_random_number()

コードの説明

const three_digit_number = [];：カラの配列の作成

for (let i = 0; three_digit_number.length < 3; i++) {}：長さが3の配列が出来るまでループ

Math.floor(Math.random() * 10)：0~９までのランダムな整数値の作成

if(!three_digit_number.includes(number)){ }:three_digit_numberが、numberで作られたランダムな整数値を持っていなければ、true（!は否定の論理演算子）

・three_digit_number.push(number)
：配列three_digit_numberにnumberの数字を追加

補足

@cfm-artさんのコメントより

sample.js

[...Array(10).keys()].sort(() => Math.random() * 3 - 1).slice(0, 3).join('')

自分で作成したものと違ってスマートです。。。

僕には、一目見ただけでは理解できなかったので、簡単に分解して説明してみました！

コードの説明

まず、最初が難しい
①[...Array(10).keys()]：

[0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

この記事を参考になんとか意味はわかりました。

②sort(どのように並び替えるか？)：配列の（破壊的な）並び替えメソッド。

しかし、これだけではどのように並べ替えるかが指定されていないので、引数にランダムに並び替えると指定。

③Math.random() * 3 - 1：

この記事を参考にしましたが、* 3 - 1の部分が理解できませんでした。

sample.js

[...Array(10).keys()].sort(() => Math.random() * 3 - 1)

後、こころなしか、配列の最初が0になりやすいなど、ランダムな並び替えに偏りがある気がします。

この方法は比較関数を指定し「隣り合う値を入れ替えるかどうか」をランダムに決めているだけ

といった理由があるみたいです。

④slice(0, 3)：slice(開始インデックス, 終了インデックス)

これは、インデックス番号が0,1,2の三つの新しい文字列を返しています

⑤join('')：配列の全ての要素を連結した文字列を返します。

→('')でカラの文字列と連結した文字列を返しています。