
超簡単にランダムで数桁の16進数
Web制作では10進数のランダムの数値を算出する機会が多い。
10進数のランダムの数字を表示したい場合は定石が存在しており、ほとんどが以下のようにMath.floorとMath.randomを組み合わせて以下のように作成する。(1から6の場合)
1 | Math.floor(Math.random() * 6) + 1 |
01から99の場合は以下のように書かれていることが多い。
1 | ( '0' + (Math.floor(Math.random() * 99) + 1)).slice(-2) |
しかし、ランダムの16進数の作成方法は人によって異なり私が知る限り数パターン存在する。
数行のコードで作成するものも多いが、toString()とslice()を使用する方法であれば1行だけで超簡単にランダムの16進数を生成することができる。(下記は6桁の例)
1 2 | Math.random().toString(16).slice(-6) // 例 => '1b854a' |
ランダムの6桁の16進数が生成できればランダムの色表示などに利用できる。
2進数・8進数・36進数も生成可能
前述のコードはtoString()の引数を2, 8, 36に変えればほかのランダムの進数も作成できる。
1 2 3 4 5 6 7 8 9 | Math.random().toString(2).slice(-6) // 例 => '101001' Math.random().toString(8).slice(-6) // 例 => '542631' Math.random().toString(36).slice(-6) // 例 => 'sva2gn' // 36進数は[0-9a-z]のランダム |
これらの方法は頭に0が付くので先頭に0が付くのを避けるにはreplaceで除去する。
1 2 | Math.random().toString(2).slice(-6).replace(/^0+/, '' ) // 例 => '101' |