はじめてのコードプログラミング

02-04 定数

Posted on by yuichi / 0件のコメント

定数とは？

変数と似ていますが、一度値を設定したら変更できないものを「定数（ていすう）」といいます。
p5.jsでは、constというキーワードを使って定数を宣言します。

const PI = 3.14159;

定数は、プログラムの中で変更してはいけない値を扱うときに使います。例えば：

  • 円周率（π）
  • 重力加速度
  • 画面の幅や高さ
  • ゲームの初期設定値
    などです。

定数と変数の違い

変数（let）と定数（const）の主な違いは：

  1. 定数は宣言時に必ず値を設定する必要があります
  2. 定数は一度設定した値を変更できないという点です
// 変数の場合
let score = 0;
score = 100;  // OK：値の変更が可能
// 定数の場合
const MAX_SCORE = 100;
MAX_SCORE = 200;  // エラー：値の変更はできない

定数を使うメリット

定数を使うと以下のようなメリットがあります：

  1. バグの防止：重要な値を誤って変更してしまうことを防げます
  2. コードの意図が明確：この値は変更しないという意図が明確になります
  3. 保守性の向上：値を変更する必要がある場合、宣言箇所だけを修正すれば良いです

命名規則

定数は通常、大文字のスネークケースで書きます：

const MAX_PLAYERS = 4;
const SCREEN_WIDTH = 800;
const GRAVITY = 9.8;

これは、変数と区別しやすくするための慣習です。

練習問題2-4-1

以下のプログラムを完成させなさい。画面の幅と高さを定数で定義し、その値を使って画面に円を描くプログラムを作りなさい。

// 画面の幅と高さを定数で定義
const SCREEN_WIDTH = 400;
const SCREEN_HEIGHT = 400;
function setup() {
  // 画面サイズを設定
  createCanvas(SCREEN_WIDTH, SCREEN_HEIGHT);
}
function draw() {
  background(220);

  // 画面の中心に円を描く
  circle(SCREEN_WIDTH/2, SCREEN_HEIGHT/2, 100);
}

constとユーザー定義の定数

constを使って自分で定義する定数を「ユーザー定義の定数」といいます。これは、プログラムの中で変更したくない値を自分で決めて使うときに便利です。

// ゲームの設定値を定数で定義
const GAME_SPEED = 60;        // ゲームの速度
const PLAYER_SIZE = 50;       // プレイヤーの大きさ
const ENEMY_COUNT = 5;        // 敵の数
const GAME_TITLE = "My Game"; // ゲームのタイトル

このように、プログラムの中で何度も使う値や、変更してはいけない値を定数として定義しておくと、コードが読みやすくなり、メンテナンスも簡単になります。

組み込み定数（Math.PIなど）

JavaScriptには、最初から用意されている定数もあります。これを「組み込み定数」といいます。
よく使う組み込み定数の例：

Math.PI      // 円周率（約3.14159）
Math.E       // 自然対数の底（約2.71828）
Number.MAX_VALUE  // 数値として表現できる最大値
Number.MIN_VALUE  // 数値として表現できる最小値

これらの定数は、数学的な計算や数値の制限を扱うときに便利です。

p5.jsの定数（width, height, RIGHTなど）

p5.jsにも、便利な定数がいくつか用意されています：

width   // キャンバスの幅
height  // キャンバスの高さ
PI      // 円周率（Math.PIと同じ）
TWO_PI  // 2π（約6.28318）
HALF_PI // π/2（約1.57079）
// キーコードの定数
LEFT    // 左矢印キー
RIGHT   // 右矢印キー
UP      // 上矢印キー
DOWN    // 下矢印キー
ENTER   // エンターキー
// マウス関連の定数
mouseX         // マウスのX座標
mouseY         // マウスのY座標
mouseIsPressed // マウスボタンが押されているかどうか（true/false）

これらの定数を使うと、プログラムがより読みやすくなります。例えば：

function draw() {
  // キャンバスの中心に円を描く
  circle(width/2, height/2, 100);

  // キー入力の処理
  if (keyIsDown(LEFT)) {
    // 左に移動
  }

  // マウスの位置に円を描く
  circle(mouseX, mouseY, 30);

  // マウスが押されているときだけ色を変える
  if (mouseIsPressed) {
    fill(255, 0, 0);  // 赤色
  } else {
    fill(0, 0, 255);  // 青色
  }
}

📌 こんな事、ありませんか？: マウスの位置を取得するために、毎回mouseXとmouseYを使っていますが、これらはp5.jsが自動的に更新してくれる定数なんです！

練習問題2-4-2

Math.PIとPIの違いについて考察して先生に説明しなさい。またTWO_PIやHALF_PIが何故用意されているのか考察して先生に説明しなさい。

練習問題2-4-3

以下のプログラムを完成させなさい。半径を定数で定義して、その値を使って、画面の中心に円を描き、円周の長さを計算して表示するプログラムを作りなさい。

// 円の半径を定数で定義
const RADIUS = 50;
function setup() {
  createCanvas(400, 400);
  background(220);

  // 円を描く
  circle(100, 100, 30);

  // 円周の長さを計算
  let circumFrence = 10 + 20; // ←適当に入っている式だよ

  // 円周の長さを表示
  textSize(16);
  text("円周の長さ: " + circumFrence, 10, 30);
}

コメントする