p5.jsドリル

00-00 プログラミングの基本

Posted on by yuichi

– コンピューターは計算機から発展したとおり、計算などの命令を実行できます。

– 計算をするには、計算自体もさることながら、計算に使う数字や結果の数字をいれる仕組みも必要です。それが変数と呼ばれるものです。

– 一時的に使うだけなら定数も便利です。変数にイチイチ格納する必要はありません。

– 変数には型があり、作成時に決め、それ以外の値はいれることができません。

– プログラムは基本的に、上から下に順次計算などの命令をこなしていきます。順次構造

– 順次処理が基本ですが、複雑なことや効率的に命令を実行するために、分岐（選択構造）や繰り返し（反復構造）が用意されています。

– 更に便利にするために、手続き≒関数という手段も用意されています。

例題0-00-1 算術演算子（定数を使う）

計算をするプログラムの例です。コードをコピペして１行ずつ何をしているのか読み解きましょう。そのあと後述の「解説」を読んで、理解を深めましょう。

コード

function setup() {
  console.log("■算術演算子（定数を使う）");
  
  console.log(2 + 3); // 加算
  console.log(2 - 3); // 減算
  console.log(2 * 3); // 乗算
  console.log(2 / 3); // 除算
  console.log(2 % 3); // 余り
}

解説

コンピューターは計算機から発展したとおり、計算などの命令を実行できます。
計算の命令は、数値と演算子を使って記述します。

演算子は数学の演算記号と似ていますが、乗算と除算は記号が違うので注意が必要です。
また、余りを計算する専用の演算記号があります。

コード例の2や3など数値や文字列のことを定数と呼びます。覚えておきましょう。
数値はそのまま記述し、文字列は"■算術演算子（定数を使う）"のように（ダブルクォーテーション）で囲みます。

例題0-00-1 算術演算子（変数を使う）

算術演算子（変数を使う）

function setup() {
  console.log("■算術演算子（変数を使う）");

  let a = -2;
  let b = 3;
  console.log(a + b);
  console.log(a - b);
  console.log(a * b);
  console.log(a / b);
  console.log(a % b);
}

例題0-00-1 選択構造

選択構造

コード

function setup() {
  console.log("■選択構造");

  // 好感度を仮に設定
  let affinity = 75;
  console.log("勇者「神様、姫に告白したいのですが…」");
  if(affinity > 80) {
    console.log("神「バッチリ」");
  } else if (affinity > 60) {
    console.log("神「そこそこ」");
  } else {
    console.log("神「やめたら？」");
  }
}

例題0-00-1 所定回数反復

所定回数反復

コード

function setup() {
  console.log("■所定回数反復");

  // ７連撃
  for(let i = 1; i <= 7; i++) {
    
    // 攻撃の処理
    console.log("勇者は敵に " + getRandomInt(100) + " のダメージを与えた！（" + i + "連目）");
  }
}

function getRandomInt(n) {
  return Math.floor(Math.random() * n)
}

例題0-00-1 条件付き反復「前判定」

条件付き反復「前判定」

コード

function setup() {
  console.log("■条件付き反復「前判定」");
  
  // 変数を作る
  let hp = 100;
  let maxHp = 1000;
  
  // リジェネ（最大HPまで自動で徐々に回復する。）
  while(hp < maxHp) {
    
    // 回復の処理
    hp = hp + getRandomInt(500);
    console.log("勇者のHPは" + hp + "になった！");
  }
}

function getRandomInt(n) {
  return Math.floor(Math.random() * n)
}

例題0-00-1 条件付き反復「後判定」

条件付き反復「後判定」

コード

function setup() {
  console.log("■条件付き反復「後判定」");
  
  // 質問に正解しないと永遠に続く会話
  let answer;
  do {
    
    // 質問
    answer = prompt("王様「勇者よ姫を助けに行ってはくれぬか？」");
  } while(answer != "はい！");
  console.log("勇者は無事旅立つことができた！");
}

例題0-00-1 型の種類と使い分け

型の種類と使い分け

コード

function setup() {
  console.log("■型の種類と使い分け");
  let lv       = 7;         // 数値型（整数）
  let mp       = 10;        // 
  let skillLv  = 3;         // 
  let eyesight = 0.5;       // 数値型（実数）
  let name     = "河西";    // 文字列型
  let isInvincible = true;  // 論理型
  let isPoisoned   = false; // 
  let isConfused   = 0;     // 0:正常、1:混乱。←良くない例（数値型より論理型の方が良い）
}

例題0-00-1 比較演算子と論理演算子と（関連はないけどついでに）手続き≒関数

比較演算子と論理演算子と（関連はないけどついでに）手続き≒関数

コード

function setup() {
  console.log("■比較演算子と論理演算子と（関連はないけどついでに）手続き≒関数");
  
  // 魔法を放てるか？
  if(mp > 10 && eyesight > 0.3 && isConfused == 0 || isInvincible == true) {
    
    console.log("勇者はファイアアローの魔法を放った！");
    console.log("勇者は敵に " + getFireArrowDamage(lv, skillLv, eyesight) + " のダメージを与えた！");
  } 
  else{
    
    console.log("魔法は失敗した…");
  }

  /*
  // C#は変数を作るとき（宣言）型を指定する
  int    mp         = 50;     // 数値型（整数）
  double eyesight   = 0.5;    // 数値型（実数）
  string name       = "河西"; // 文字列型
  bool   isPoisoned = false;  // 論理型
  */
}

// ファイアアローのダメージ計算
function getFireArrowDamage(lv, skillLv, eyesight) {
  return Math.floor(((lv + 10) * 3 + skillLv * 10) * eyesight);
}

例題0-00-1 配列と添字

配列と添字

コード

function setup() {
  console.log("■配列と添字");
  let items      = ["薬草", "たいまつ", "聖水"];
  let itemCounts = [10, 5, 2];

  // たいまつを使った（添字は0からなので、0:薬草、1:たいまつ、2:聖水）
  itemCounts[1] -= 1;

  // 所持品一覧を表示
  for (let i = 0; i < items.length; i++) {
    console.log(items[i] + " x " + itemCounts[i]);
  }
}