読者です 読者をやめる 読者になる 読者になる

ともろーの日記

Initializing . . .

Processing ではじめるプログラミング 12日目(関数のお話)

プログラミング Processing

今日は関数のお話をします。

関数とは、処理をする箱のようなものです。

例えば、f(x)=x+1 という関数があったとします。

イメージとしては、箱に数字を入れると1が足されて出力されます。

xに3を入れてみると(箱に3を入れる)4が出てきます。

f:id:tomorrow63:20160531154650p:plain


プログラムでも、処理を行う箱(関数)を作ることができます。

一つ足すという関数をつくるためにはこのようなコードを書きます。

int f(int x){
  x = x+1 ;
  return x;
}

ここでの関数の名前はfです。入力は一行目のxという部分に入れられます。

出力はreturnのあとのxの値です。

それでは実行してみましょう!

何も起こりませんね

f:id:tomorrow63:20160531174527p:plain:w300

これは関数が呼び出されていないからです。

箱をつくっても箱の中に何も入れなければ何も起こりません。

箱に数を入れるプログラムを作ります。

void setup(){
  int a = 3;
  a =  f(a);
  print (a);
}

int f(int x){
  x = x+1 ;
  return x;
}

このプログラムを実行すると、以下の順番で処理が実行されます。

  1. int a = 3;
  2. f(a)で、今aに3が入っているので、f(3)となります。
  3. 関数部分int f() の部分へ行き、xに3が入れられます。
  4. f() の中の処理で、xに1が足されます。そのため、xが4となります。
  5. return x; でxに4が入っているので、4が返されます。4という結果がsetup()の中のf(a)の結果になります。
  6. setup()の中の処理に戻ります。 aに4が代入されます。
  7. print(a); でaの値(4)が出力されます。


f:id:tomorrow63:20160531175641p:plain:w300

このようにしてプログラムは実行されていきます。

Processing ではじめるプログラミング 11日目(型のお話)

プログラミング Processing

これまで、変数というものを宣言するとき、いつも int というものを用いてきました。

これは、整数の変数を宣言するときに使うもので、-2,147,483,648 ~ 2,147,483,647 までの整数値しか扱うことができません。

試しに小数点のある数字を入れてみてください。エラーが起こります。

int a = 123.456;
println(a);

f:id:tomorrow63:20160528105420p:plain:w300

小数点のある数字を扱うためには、floatという型を使います。

float a = 123.456;
println(a);

f:id:tomorrow63:20160528105920p:plain:w300

これで問題なく動作するようになりました。


その他の型

boolean型

これは、trueかfalseを入れるときに使います。

boolean flg = true;

if(flg){
  print("flg is true");
}else{
  print("flg is false");
}

上の例だとboolean型のflgの中にtrueを入れておきます。

そのあと、if 文でflgが確認されます。

少し違和感を感じた人がいるかもしれません。しかし、このコードでも問題なく動作します。

if 文のあとの()には、条件が入ります。今までだと、if(a%2==0)などといった文になっていました。

a%2==0は、aを2で割った時のあまりが0 というもので、条件に当てはまる場合 true となっています。

すなわち、if(条件)としたときの条件がtrue になると後のカッコが実行されるというわけです。

もちろん下のようにも書くことができます。

boolean flg = true;

if(flg == true){
  print("flg is true");
}else{
  print("flg is false");
}



練習問題

30までの素数を順番にコンソールに表示するコードをかいてください

数値の表示には println を用い、出力ごとに改行してください。

ヒント:素数というものがどんなものか考えてみよう。いろんな作り方があるよ。

その数より前の素数で割り切れない数だから....????








回答例

コードの書き方にはいろいろな方法があります。同じものが作れたら正解です!

f:id:tomorrow63:20160528112500p:plain:w300

int [] prime_number = new int[30];
boolean flg = true;

for(int i = 0; i< 30;i++){
  prime_number[i] = 0;
}

for (int num = 2 ;num < 30;num++){
  int i;
  for(i = 0 ; prime_number[i]!=0 ; i++){
    if (num%prime_number[i]==0){
      flg = false;
    }
    i++;
  }
  if(flg){
    prime_number[i]=num;
    println(prime_number[i]);
  }else{
    flg = true;
  }
}

Processing ではじめるプログラミング 10日目(配列を利用する)

プログラミング Processing

今日は配列を勉強します。

プログラミングをしていると多くの変数(同じ型)が必要になるときが出てきます。

そのようなときに配列を利用します。

実際にプログラムを書いてみましょう。

5つの変数をつくり、合計値を出したいとします。

int  a,b,c,d,e;

a = 0;
b = 1;
c = 2;
d = 3;
e = 4;

int ans = a+b+c+d+e;
print(ans);

変数が5つならまだできますが、これが10個, 100個となると非常に手間がかかります。

そのときに配列をつかうことができます。

int[] array = new int[5];
int ans = 0;

for (int i=0 ; i<=4 ; i++){
  array[i] = i;
}

for (int i=0 ; i<=4 ; i++){
  ans += array[i];
}

print(ans);

int[] array = new int[5]; の意味は、array[0], array[1], array[2], array[3], array[4] という(int型の)変数を作成します。

これらは、はじめのコードの a, b, c, d, e と同じ役割を果たすことができます。

配列を用いることによって指定した番号の数字を取り出すことができます。

int[] array = new int[100];

for (int i=0 ; i<100 ; i++){
  array[i] = i;
}

print(array[33]);

配列は様々な場所で用いるので、覚えておきましょう。

プログラミングをする上で気をつけること

プログラミング

長らく更新できず申し訳ございません。

今日は、プログラミングを勉強する上で気をつけなければならないことを書きたいと思います。


プログラムは言葉であることを理解する。

プログラムは言葉です。そのまま受け入れなければなりません。 例えば、「なぜコンソールに表示するとき "print" と書くのか?」 という疑問があったとします。しかし、それは「なぜ "こんにちは(音声)" を "こんにちは(ひらがな)"と書くのか」という疑問と似ていると思います。ただ、"そう書く"と決まっているだけです。

世界には、日本語、英語、中国語など様々な言葉があります。そして言語にはそれぞれ特徴があります。日本国では日本語が主に使われていて、中国では中国語が主に使われています。その国での会話は、その国で使われている言語でします。
プログラムの世界にも、c、c++、Javaなど様々な言語があります。そして、ディバイスごとに、使われている言語はまちまちです。


絶対この書き方しかダメと思い込まない

先ほども述べましたが、プログラムは言葉です。日本語における自分を指す単語は「俺」「私」「拙者」...などたくさんあります。プログラムにおいても、”意味は同じだけど書き方が違う”というものがあります。この場合、どのような書き方をしても問題ありません。自分の好みでかいてください。(他人が見てわかりやすい/わかりづらいという問題は残っていますが...(^_^;))


サンプルをコピー&ペーストだけで終わらない

プログラムを書いていると、必ずわからなくる時が出てきます。そんなとき、Googleなどで検索するとたいていは自分の必要としていたコードが出てきます。そのコードをコピー&ペーストすることについては、特に否定はしませんがもし、自分が必要としていた機能と完全に一致していたコードが出てこなかった時対処できますか?ではどうすればいいか。僕は、「そのコードを少し改良する練習」をするべきだと思います。はじめのうちは、変数名を変更するぐらいでもいいと思います。サンプルのコピペだけでは実力はつきません。自らのスキルアップのために、変更する練習をしてみましょう!

何も、サンプルと同じ動きをするように変更する必要はありません。プログラムを壊してみてください。「この行消すとどんな動きをするのだろう?」「宣言するときの型をかえてみよう」など壊し方はたくさんあります。壊す事によって、違う動きをしたりエラーが出たりします。なぜ違った動きになったのか?なぜこのエラーが出たのか?その原因は、自分が手を加えたところにあります。


それでは、楽しいプログラミングライフを!

Processing ではじめるプログラミング 9日目(色を変えてみる)

プログラミング Processing

今日は、processingで色の変え方を勉強しましょう。

前回の復習です。画面サイズ300,300の中心に直径が100の円を描いてみましょう。

size(300,300);
ellipse(150,150,100,100);

f:id:tomorrow63:20160429133231p:plain:w300

かけましたか? 外の線を消してみます。noStroke()と入れると線が無くなります。

size(300,300);
noStroke();
ellipse(150,150,100,100);

f:id:tomorrow63:20160429133256p:plain:w300

次に円の色を変えてみます。fill(R,G,B)で色を変えることができます。

size(300,300);
noStroke();
fill(255,0,0);
ellipse(150,150,100,100);

f:id:tomorrow63:20160429133320p:plain:w300

RGBとは?

RGB(またはRGBカラーモデル)とは、色の表現法の一種で、赤 (Red)、緑 (Green)、青 (Blue) の三つの原色を混ぜて幅広い色を再現する加法混合の一種である。RGBは三原色の頭文字である

つまり、真っ赤にしたければRの値を最高値である255してその他を0にします。


プログラムは上から順番に読み込まれますので、線や図形を描く前に色の指定をしなければなりません。

size(300,300);
noStroke();
ellipse(150,150,100,100);
fill(255,0,0);
ellipse(250,250,100,100);

f:id:tomorrow63:20160429133344p:plain:w300

中央にある円はfillで色を変える前に描かれているので、白色のままです。


背景を変えるには、background(R,G,B);を使います。

size(300,200);
noStroke();
background(255,255,255);
fill(255,0,0);
ellipse(150,100,100,100);

f:id:tomorrow63:20160429134020p:plain:w300

上のプログラムはすべての値を最大にして白色にしています。背景が白色になっていることを確認できると思います。


ここからはクイズ形式にします。

問題1 バングラディシュの国旗を作ってください。

f:id:tomorrow63:20160429134511p:plain:w300

ヒント:緑は R 0, G 111, B 80でつくることができます。


問題2 ペルーの国旗を作ってください

f:id:tomorrow63:20160429135141p:plain:w300

長方形はrect(左上のx座標,左上のy座標,幅,高さ);で作れます。白色は R 255, G 255, B 255 赤色は R 230, G 0, B 0 でできます。


問題3 イタリアの国旗を作ってください。

f:id:tomorrow63:20160429135613p:plain:w300

緑色はR 0, G 154, B 74 白色は R 255, G 255, B 255 赤色は R 218, G 0, B 38 でできます。


問題4 発展問題 アメリカ風の国旗を作ってください。ただし、前回学んだfor文を使うこと。

f:id:tomorrow63:20160429141232p:plain:w300



コードの書き方にはいろいろな方法があります。同じものが作れたら正解です!

問題1の答え (例)

size(300,200);
noStroke();
background(0,111,80);
fill(255,0,0);
ellipse(150,100,100,100);

問題2の答え(例)

size(300,200);
noStroke();
background(230,0,0);
fill(255,255,255);
rect(100,0,100,200);

問題3の答え(例)

size(300,200);
noStroke();
fill(0,154,74);
rect(0,0,100,200);
fill(255,255,255);
rect(100,0,100,200);
fill(218,0,38);
rect(200,0,100,200);

問題4の答え(例)

size(570,300);
noStroke();
background(255,255,255);
int i = 0;
for(i=0;i<7;i++){
  fill(189,0,39);
  rect(0,i*46,570,23);  
}
fill(64,53,111);
rect(0,0,230,161);