Conditionals 2 / 条件分岐 2

「else」キーワードを追加して、前の例の条件分岐の言語を拡張します。これにより、条件分岐は2つ以上の連続した質問を行い、それぞれ異なるアクションを実行できます。

conditional if-else
Control Logic

View Source Code

/*
 * @name Conditionals 2
 * @arialabel The top half of the window has spaced out vertical lines. The bottom half of the window has more condensed vertical lines
 * @description We extend the language of conditionals from the previous
 * example by adding the keyword "else". This allows conditionals
 * to ask two or more sequential questions, each with a different
 * action.
 */
function setup() {
  // createCanvas(720, 360);
  createCanvas(windowWidth, windowHeight);
  background(0);

  for (let i = 2; i < width - 2; i += 4) {
    // If 'i' divides by 20 with no remainder
    if (i % 20 === 0) {
      stroke(255);
      line(i, 80, i, height / 2);
      // If 'i' divides by 10 with no remainder
    } else if (i % 10 === 0) {
      stroke(153);
      line(i, 20, i, 180);
      // If neither of the above two conditions are met
      // then draw this line
    } else {
      stroke(102);
      line(i, height / 2, i, height - 20);
    }
  }
}

License

Source code is available on GitHub p5.js website legacy.

All examples are licensed under CC BY-NC-SA 4.0.