2.10　Tips: コードの可読性

      2.10　Tips: コードの可読性 はコメントを受け付けていません

プログラミングを学習する上で、コードを自分にも第三者にも分かるようにきれいに書くということは、実は非常に重要です。大抵、始めたばかりの人はコードの間違いを探すのに精一杯で、後で読んでも分かるように整頓しておくところまで気が回りません。
しかし、散らかしたままにしておくと、徐々にコードのどこの部分がどのような機能を実行しているかが分からなくなる→コーディングに時間がかかる→結局やる気がなくなる、という悪循環に陥ってしまいます。
そのため、プログラミングの際には、必ず頻繁に整理整頓しながら進めることが必要です。
整理する方法は幾つかあります。

2.10.1　コメントを書く

コメントを書くことは、自身が書いたコードを整理するためにも、複数人でコードを共有するためにも大変重要です。また、コメントアウトといって、一部のコードを実行しないこともできます。
プログラミング上級者でもコメントを書かない人は少なくありませんが、本書の読者には必ず書く癖をつけることをお勧めします。その方が、結局効率がいいのです。

Processingにおけるコメント記述のルールは次のとおりです。他言語（CやJavaなど）と同じです。
ここでは、点のパターンを表示するコードを例として挙げます。

int ellipseSize = 1;  //円のサイズを指定
int winSize = 400;    //ウィンドウのサイズを指定  
size(400, 400);       //画面サイズの決定
background(255);      //背景色の決定
 
fill(0);    //黒で描画
 
/*
for(int i = 0; i < = winSize; i = i + 7){
  for(int j = 0; j <= winSize; j = j + 7){
  ellipse(i, j, ellipseSize, ellipseSize);
  }
}
*/
 
for(int i = 0; i <= winSize; i = i + 7){
  for(int j = 0; j <= winSize; j = j + 7){
    if(i%2 == 0 || j%2 == 0 ) ellipse(i, j, ellipseSize, ellipseSize);
  }
}

//（スラッシュを2回）
// の後に書かれた文章はプログラムとして見なされません。コードの実行を部分的に停止する場合に使います。また、変数や機能がどのような種類のものかを補足的に書いておくと、次にコードを読んだときに思い出しやすくなります。

/* 文　*/（スラッシュとアスタリスクで閉じる）
このコメントアウトもよく使われます。機能は前述の//と一緒ですが、この場合は囲まれた部分は全て実行されません。
広い範囲をコメントアウトしたい場合に使われます。

2.10.2　インデントを入れる

インデントとは、行頭に空白を入れて先頭の文字を右にずらすことで、「字下げ」とも呼ばれます。Microsoft Wordなどのエディタソフトでレポートを書く際によく使いますが、インデントを適切に入れることによって、プログラムの可読性は飛躍的に高まります。
例えば次のコードをみてください。この2つの例は、プログラムとしては同じものです。

float y = 0.0;    //ボールのy座標
float speed = 0.4;    //ボールの初速
float gravity = 0.1;    //ボールにかかる重力
float reaction = 0.7;    //ボールの反発力
 
void setup(){
size(300, 300);
fill(0);
}
 
void draw(){
background(255);
speed = speed + gravity;    //スピードに重力が加算される
y = y + speed;    //ボールにスピードが設定される
 
if (y > height) {    //もしボールが画面の下まで落ちたら、
speed = speed * -reaction;    //反発力によって上に上がる
y = height;    //ボールは画面の外に外れない
}
ellipse(width/2, y, 10, 10);    //ボールを描く
}
float y = 0.0;    //ボールのy座標
float speed = 0.4;    //ボールの初速
float gravity = 0.1;    //ボールにかかる重力
float reaction = 0.7;    //ボールの反発力

void setup() {
  size(300, 300);
  fill(0);
}

void draw() {
  background(255);
  speed = speed + gravity;    //スピードに重力が加算される
  y = y + speed;    //ボールにスピードが設定される

  if (y > height) {    //もしボールが画面の下まで落ちたら、
    speed = speed * -reaction;    //反発力によって上に上がる
    y = height;    //ボールは画面の外に外れない
  }
  ellipse(width/2, y, 10, 10);    //ボールを描く
}

プログラミングを始めたばかりの人にとっては違いが分かりにくいかもしれませんが、同じコードでも下の例のほうがより構造的に可視化されています。コードはもともと構造的なものですが、見た目がさらに分かりやすくなるようにインデントを入れるのが基本です。
ありがたいことに、Processingには自動でインデントを入れてくれるオートフォーマットという機能があります。
Editメニュー > Auto Formatを選んでください。MacではCommand + T、Windowsではcontrol + Tのショートカットも使えます。
また、手動でインデントを入れる場合は、タブキーかスペースキーを使いましょう。

2.10.3　無駄な行は削除する

特に初心者は、無駄な行をそのままにしていることがよくあります。既存のコードを削除した場合など何行も空いている状態を放置していると、意味もなく縦に長いコードになります。必要ない空白行は削除するように心がけましょう。