SFC – デザインとプログラミング 2022
関数によるモジュール化とバリエーション
今回は、関数 (function) についてとりあげます。といっても、ここまでの講義で関数は頻繁に使用してきました。ここまでで使用してきた関数は主に2つの場合に分けられます。
1つ目は、プログラミングしているp5.jsのスケッチからp5.jsのライブラリー内で定義されているの関数を呼び出しです。例えば
//circle()関数の呼び出し circle(400, 300, 100);
といったp5.jsで実行していた命令は、p5.jsの関数を呼び出していたのです。
2つ目は、 p5.jsのライブラリーから呼び出されている関数を定義する記述です。これは、setup() や draw() 内で書いていたプログラムに相当します。
//setup関数の定義
function setup() {
createCanvas(windowWidth, windowHeight);
frameRate(60);
...
}
関数はプログラムを処理内容ごとにモジュール化して、プログラムの可読性を高めデバッグを容易にします。
また、関数は引数(arguments)を受け取り、内部の処理のパラメータとして使用することが可能です。このことにより1つの関数で様々なバリエーションを持つことが可能となります。
p5.jsで実際に描画しながら関数について学んでいきましょう。
スライド資料
投稿作品とランキング
- 第1位 : Dorayaki 24票
- 第2位 : Cats 13票
- 第3位 : guruguruguruguru… 11票
- 第4位 : 3D 10票
- 第4位 : 四角 10票
おめでとうございます!!
映像資料
サンプルコード
- forkするサンプル https://www.openprocessing.org/sketch/726079
- 増殖する花のサンプル https://www.openprocessing.org/sketch/726406
本日の課題
関数を用いて作品を制作してください!
課題: 関数 (function) をつかって大量に形を増殖させる
引数によってバリエーションをつけながら何か形を描く関数を作成してください。作成した関数をdraw()関数から呼び出して大量に形を描いてください。
- 投稿したURLをアンケートから提出
- 投稿の際に sfc221118 のタグをつけてください! ※タグは既に提出済みの人がいるので変更しません
- 締切: 2022年11月30日(水) ※三田祭休みの関係で1週間延長しましたまで!