プログラミング基礎講習3

636 Views

April 19, 21

スライド概要

サークルでProcessingを使ったプログラミング基礎講習会を行った時の資料です。

profile-image

公立はこだて未来大学複雑系学部3年

シェア

またはPlayer版

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

プログラミング基礎講習 第三回 at FUN AI 2020/5/18

2.

本日の予定 18:15 〜 講習会開始 〜20:00 終わり 面倒なのでPDF作ってないです。テヘペロ。 各位休憩を適宜とって下さい。

3.

おしながき ・アバウトな目標を分解する ・リファクタリングとは ・実演 ・時間があればついでの話

4.

今回の目標その1 アバウトな目標を達成するための、 思考過程を知る

5.

第一回の振り返り プログラミングとは > 何かを実現させるために、様々な言語で命令を書くこと

6.

今回の”実現したいこと” > ゲーム(アバウト) > どう作っていこうか?

7.

今回の目標その2 良くないコードの例を知る

8.

第二回の振り返り > 可読性 > 命名規則 > コメントアウト

9.

上級生へのお話し オブジェクト指向みたいな何か 副作用みたいな何か

10.

2 アバウトな目標を分ける

11.

目標「ブロック崩し」 > ブロックを崩すゲームを作りたい

12.

最低限何が必要? > ゲーム画面だけあればそれはもうゲーム!!

13.

ブロック崩しとは? > ブロックを消すゲーム > どんな動きをさせるのかをまず想像していく

14.

どんな動き? ・ボールが飛んでる ・ボールが壁で跳ね返る ・ボールを板で跳ね返す ・ボールがブロックと当たると消える

15.

どういう動き? ・ボールが飛んでる > circleの座標がきっと変わってる

16.

どういう動き? ・ボールが壁で跳ね返る > ボールの座標を取得してif文で何かしてそう

17.

どういう動き? ・ボールを板で跳ね返す > 板の座標とボールの座標を取得してif文で何かし てそう

18.

どういう動き? ・ブロックと当たると消える > ブロックとボールの位置を取得して、ブロックの 色を何かしてそう

19.

機能ごとにコードを書いてみる ・機能ごとに書いたものを最後に合わせれば良い

20.

まとめ 1. 最低限必要なもの機能を考える 2. 各機能の動きを想像する

21.

あとから足せばいいもの > タイトル > リザルト > メニュー > ランキング

22.

フローチャート タイトル メニュー ゲーム リザルト ランキング ポーズ フローチャート参考:第一回スライド7ページ

23.

1 リファクタリング

24.

リファクタリングとは > プログラムの外部から見た動作を変えずにソースコード の内部構造を整理すること

25.

例えば > 名前変えたり > 変数減らしたり

26.

なんでするの?(個人レベル) > 過去の自分のコードを見直すと、よくない書き方 良い書き方が体感できる

27.

なんでするの?(個人レベル) > 成長を実感できて嬉しい😊

28.

1 良くないコードを知る 〜実演タイム〜

29.

1 ここから難しいです

30.

ここからのはなし > 画面遷移に抽象クラスを使う > もう一度副作用を考える > オブジェクト指向

31.

伝えたいこと > 系統立ててコードを書く > 関数の責任やクラスの関心は小さくする っていう、アイデアはいかがでしょうというお話し。

32.

1 抽象クラス

33.

クラスとは > 関数や変数をまとめたおっきい塊 (クラス内にいる関数みたいなのをメソッドという)

34.

抽象クラスとは > 中身のないクラスのこと。

35.

普通のクラス > 動く中身がいらっしゃる。

36.

抽象クラス 中身がいないのでこのままで は動かない。必要に応じて中 身をつめて使う。

37.

何が嬉しいのか クラス単位で入れ替えが起き てくれる。 普通のクラスでは引数を変え るだけで自由度が低いが、抽 象クラスならもっといろいろ 変えられる。

38.

画面遷移への応用 > if文やswitch文使った書き方 > 抽象クラスを使った書き方

39.

switchを使った遷移 GameModeにいろんな数字が入 り、 条件分岐で実行画面を制御してい る。 出典 https://github.com/Atria64/DaggerBreak/tree/master/DaggerBreak

40.

抽象クラスでの遷移 参考記事 http://www2.kobe-u.ac.jp/~tnishida/misc/processing-state. html

41.

何が嬉しい? ・テンプレートっぽく、よい加減 の自由度でコードが書ける。 ・「役割を分ける」意識できる

42.

役割を分ける ・タイトル画面のことだけやる

43.

役割を分ける ・メインメニューのことだけやる

44.

まとめ > 抽象的なテンプレートを作り、それを使い回す の、どうですか?

45.

1 もう一度副作用を考える

46.

副作用のない関数とは > いついかなる時、場所でも同じ引数なら同じ振る舞いを する関数 →単体でテストができる

47.

おや? > 同じ”printfirstname”なの に出力が違う… →単体でテストができない💦

48.

副作用なくそう! > あれこれクラスにしてる意味 がないのでは…??

49.

“単体”でテスト? > クラス単位なら同じ引数で同 じ出力ですよ?🤔

50.

クラス単位で見る > 全体で見れば副作用なし! 🤗

51.

うーん。 > 関数の副作用すごい気にする とこんな書き方許せない。 が、これがセールスポイント なので。

52.

それでも気にして。 > グローバル変数は関数内で読 まない > 関数やメソッド内で標準入力 やファイル読み込みはしない

53.

一つの関数に一つの役割 > 複数の役割を持たせると、改修する際に複数の役割につ いて見直す事になる。 キーワード:SOLID原則1: S(単一責任の原則)

54.

関心の分離 > 関心事(=目的、役割、場合)ずつで分離する

55.

ブロック崩しなら > 画面ごとで役割を分離する。

56.

例えば > decideStateに画面遷移先の 初期設定が割り込んでる!!

57.

まとめると > (副作用が云々というか)役割分担を意識しよう。

58.

1 オブジェクト指向

59.

オブジェクト指向三大要素 ・継承 ・ポリモーフィズム ・カプセル化 もうすでにここまでのお話でだいぶ出ました。

60.

継承 > 他クラスのメソッドを引き継げる →抽象クラスを”継承して”使ったね

61.

継承のいいところ > テンプレートっぽくかける、つまり共通の部分を規格と してまとめあげられる

62.

ポリモーフィズム > 複数のクラスで似たメソッドの名前を一致させる →抽象クラスで全く同じ名前の使い回しまくったね

63.

ポリモーフィズムのいいところ > 同じ名前だからこそ抽象クラスで元気に動く

64.

カプセル化 > 外部からの操作を制御し、プログラムの独立性を保つ →クラス内のメソッドや変数に外から触らせない

65.

カプセル化のいいところ > 外から見たら複雑でない状態になっている > オブジェクト指向での対副作用へのアプローチ

66.

何事も程度がだいじ。 > 便利にしようとしすぎて逆にわからんなることもある。

67.

何事も程度がだいじ。 > 副作用も気にしすぎるとうえーんなる。プロセは特に。

68.

何事も程度がだいじ。 > がんばえ。

69.

1 次回以降の予告 たつお先生よしなにお願いします。

70.

おわり。 プログラミング基礎講習全3回はこれで終 わりです。お疲れ様でした。 各位、好きに解散してください。 70