この記事は Qiita p5js アドベントカレンダー7日目の記事です。

これはなに

p5.jsが用意している関数について理解を深める記事です。
今回はMath、Random系に位置するrandomSeed()とrandom()について。

random()

乱数を返す関数です。
今後幾度となく使用していくであろう関数だと思います。
ランダム大好き。

リファレンスより

ランダムな浮動小数点数を返します。
0、1、2のいずれかの引数を取ります。
引数が与えられていない場合は、0から1まで（ただし1を含まない）の乱数を返します。
1つの引数が与えられ、それが数値である場合、0からその数値まで（ただし含まない）の乱数を返します。
1つの引数が与えられ、それが配列の場合、その配列からランダムな要素を返します。
2つの引数が与えられた場合、第1引数から第2引数まで（ただし含まない）の乱数を返します。
（DeepL翻訳）

いろいろとルールがありますね。
まず返るのは浮動小数点なので、ランダムな整数を扱いたい場合はint()を併用します。

また注意すべき点としては数値を指定した場合、その数値は含まれないこと。
昨日書いた記事、p5.jsの関数まとめ part.5 constrain()で

const count = random(0, constrain(frameCount, 0, 500))

というコードを書きました。
差し込んだ画像をみてもらうと分かるのですが、最大が499です。
私はこれをみて「500おしい〜」とか思っていたのですがそうではありませんでした。
random()が返す数値に500は含まれていなかったのです。

Type

数値を渡す場合のTypeはこちら

random(min?: number, max?: number): number;

引数

min はじまりの数値
max 返る乱数の最大範囲（maxの数値は返らない）
0から始める場合、引数は一つで良い

そして引数に配列を渡す場合がこちら

random(choices: any[]): any;

any[]なのか。
例えば[1, 'hoge', 2, 'huga']みたいなのはどうなるんでしょうか。

function draw() {
  const ary = [1, 'hoge', 2, 'huga']
  console.log(random(ary))
}

=>
1
2
huga 
2
hoge 
1
2
2

うん、ちゃんと全部返してくれる。

どんな時に使えそうか

もはやどんな時にだって使えるのがこの関数！だと思っています。
ちゃちゃっとこんな感じのコードを書いてみました。

function setup() {
  createCanvas(600, 600);
  frameRate(10)
  noStroke()
}

function draw() {
  background(0)
  const x = random(-200, 200)
  const y = random(-200, 200)
  
  let fillColor = x > 150 ? 'red' : 'blue'
  fill(fillColor)
  for(let val=0; val < 100; val++) {
    rect(300, 300, x, y)
  }
}

幅が(300, 300)の位置から200以上伸びた時だけ赤、それ以外は青色の矩形を1秒間に10種類、次々と表示します。

randomを使うことによって簡単に表現の幅を持たせることができるし、使っていれば予期しない描写に出会えること間違いなしです。

randomSeed()

上記、random()のシード値を設定するものです。

リファレンスより

random()のシード値を設定します。
デフォルトでは、random()はプログラムを実行するたびに異なる結果を返します。ソフトウェアを実行するたびに同じ擬似乱数を返すには、seedパラメータを定数に設定します。（DeepL翻訳）

よくシード値ってきくけど説明できないなと思ったので調べました。
こちらの記事より

コンピュータで乱数を生成する場合、ある数値をシード値（seed：種）として用い、その値を基にして特定の演算により乱数を生成していく。このため同じシード値を使用した場合、発生する乱数はまったく同じものとなる。

理解しました。
ちなみに私にとって一番身近なシード値はrspecでテストを回すときのシード値です。

Type

randomSeed(seed: number): void;

引数

seed シード値となる整数

どんな時に使えそうか

背景などの固定したいものを描画したい時に使えそう。
random()はシード値を指定しないと毎回バラバラな乱数を生成するため、randomかつ固定したい時はシード値を設定する。
またrandom()を使用する場合は動作の検証にも使えそうです。

参考

p5.js reference | constrain()
『Generative Design with p5.js』P_1_2_3_01