1
00:00:00,020 --> 00:00:03,345
この動画では「forループ」についてお話しします

2
00:00:05,494 --> 00:00:07,134
「whileループ」については勉強しましたね

3
00:00:07,200 --> 00:00:09,113
なんならこの動画を飛ばしてもらってもいいんです

4
00:00:09,214 --> 00:00:10,824
forループなんて必要ないんですよ

5
00:00:10,856 --> 00:00:13,766
単にwhileループを短く書くだけなんですから

6
00:00:13,920 --> 00:00:18,670
何度も何度も書きたくなるようなwhileループもあるわけです

7
00:00:19,218 --> 00:00:23,218
でもProcessingの作例を見たり、いろいろやっていくうえで

8
00:00:23,509 --> 00:00:25,298
forループを使った方が便利な場面も出てくるでしょう

9
00:00:25,449 --> 00:00:28,149
ですからforループに触れてみて、使ってみたほうが良いと思います

10
00:00:28,283 --> 00:00:31,963
ただし言っておきたいのは、新しい機能など何も付け加えず

11
00:00:32,140 --> 00:00:36,270
ただwhileループを短く書くための方法を学ぶだけということです

12
00:00:36,351 --> 00:00:40,721
forループの方がやや難しく感じるかもしれませんが

13
00:00:40,885 --> 00:00:42,123
まあそれはこれから見ていきましょう

14
00:00:42,290 --> 00:00:45,930
この動画ではまずwhileループをみて

15
00:00:46,162 --> 00:00:47,220
次にforループをみて

16
00:00:47,385 --> 00:00:49,565
whileループをforループに書き換える方法を学んで

17
00:00:49,714 --> 00:00:51,214
そして実際にProcessingコードとして実行してみます

18
00:00:51,329 --> 00:00:54,129
さて、これはこの間の練習問題の答えです

19
00:00:54,320 --> 00:00:57,590
動きのないプログラムに書き換えておきました

20
00:00:57,707 --> 00:01:00,167
steup()もdraw()もなく、実行されるのは

21
00:01:00,292 --> 00:01:04,292
「x=0から始めて画面の端までリピートしましょう」

22
00:01:04,427 --> 00:01:08,427
「y=0から始めて画面の下までリピートしましょう」

23
00:01:08,569 --> 00:01:09,439
こういう内容です

24
00:01:09,599 --> 00:01:12,159
この動画では水平の線と垂直の線を使って

25
00:01:12,212 --> 00:01:13,952
こういったグリッドパターンを描いていきます

26
00:01:14,118 --> 00:01:19,498
そのためにはまず「x=0」から始めて

27
00:01:22,492 --> 00:01:27,702
xの値がウィンドウの幅より小さい間は

28
00:01:28,320 --> 00:01:30,680
描画して、値を増やして...

29
00:01:30,821 --> 00:01:33,185
つまり線になるものを描いていきます

30
00:01:33,355 --> 00:01:34,976
あ〜 「線」ね

31
00:01:35,314 --> 00:01:40,304
線は(x, 0, x, 高さ)の点からスタートして

32
00:01:41,861 --> 00:01:44,141
ある値でxを増加させていきます

33
00:01:44,265 --> 00:01:46,968
任意の値ですから20ピクセルとしておきます

34
00:01:47,210 --> 00:01:52,140
今書いているwhileループはひたすら端まで線を描いていくものです

35
00:01:52,379 --> 00:01:55,609
さてこのループの構成要素はなんでしょう？

36
00:01:55,879 --> 00:02:01,479
3つありますが一つは初期条件です

37
00:02:03,590 --> 00:02:09,350
ループが開始した直後に初期値となるものをここで設定します

38
00:02:09,565 --> 00:02:11,750
ここではx=0となりますね

39
00:02:11,416 --> 00:02:13,396
他の要素はなんでしょう？

40
00:02:13,901 --> 00:02:16,271
ブール式です

41
00:02:18,287 --> 00:02:23,270
この式をチェックして結果がtrueであれば、ループが続いていきます

42
00:02:23,228 --> 00:02:24,878
falseであればループは終了します

43
00:02:25,200 --> 00:02:26,530
もう一つの要素は？

44
00:02:26,948 --> 00:02:29,868
増加の設定です

45
00:02:33,600 --> 00:02:37,600
ループが終わるまで毎回変数を増加させていくんです

46
00:02:37,259 --> 00:02:40,564
最終的には終了条件を満たすことになります

47
00:02:41,207 --> 00:02:44,327
さて、forループには基本的に3つの要素が必要となります

48
00:02:44,587 --> 00:02:47,611
初期設定、テストされるブール式、

49
00:02:47,707 --> 00:02:49,617
そしてループの最後に行われる内容です

50
00:02:49,888 --> 00:02:52,438
forループではこれらを1つの文で書くことができます

51
00:02:52,784 --> 00:02:53,644
こんな感じ

52
00:02:54,279 --> 00:02:55,358
「for」

53
00:02:56,494 --> 00:02:59,984
int x = 0; (セミコロン)

54
00:03:00,353 --> 00:03:03,813
x < 0; (セミコロン)

55
00:03:03,832 --> 00:03:07,572
x = x + 20、カッコ閉じる

56
00:03:07,887 --> 00:03:10,337
波カッコ、波カッコ閉じる

57
00:03:10,840 --> 00:03:12,790
ちょっとカメラを確認しなきゃ

58
00:03:12,832 --> 00:03:14,682
よし、ちゃんと波カッコが映ってる

59
00:03:14,871 --> 00:03:16,181
見えますね、素晴らしい

60
00:03:16,382 --> 00:03:18,602
近づいて「ハロー」なんて言ってみたりして

61
00:03:19,460 --> 00:03:23,000
やれって言われたんだよ、バカらしくて恥ずかしいね

62
00:03:23,280 --> 00:03:25,130
まあここはカットすればいいや

63
00:03:25,192 --> 00:03:29,520
ここに要素その1

64
00:03:29,119 --> 00:03:31,489
ここに要素その2

65
00:03:31,611 --> 00:03:33,651
そして要素その3

66
00:03:33,766 --> 00:03:38,686
要素その4はループの中で実行する内容です

67
00:03:38,873 --> 00:03:41,343
ここでは「線を描く」こと

68
00:03:44,867 --> 00:03:49,847
2つのループは100%一致していることがわかります

69
00:03:50,179 --> 00:03:51,569
違いといえば...

70
00:03:52,195 --> 00:03:56,195
forループは3行あったコードを並べて1行にできること

71
00:03:56,431 --> 00:03:58,810
コードを短くすることができますね

72
00:03:58,347 --> 00:04:00,267
言いたいことは「ループはx = 0から始まって

73
00:04:00,307 --> 00:04:01,618
x < 幅を毎回確認して

74
00:04:01,701 --> 00:04:03,831
ループの終わりで値を20増やす」

75
00:04:04,300 --> 00:04:08,300
これを最初に学ぶあなたのような人にとっては

76
00:04:08,565 --> 00:04:10,775
こっちの方が複雑にみえますよね

77
00:04:11,350 --> 00:04:14,137
whileループでは上から順番に実行されるわけですから

78
00:04:14,153 --> 00:04:15,543
まずこれを実行して、式をチェックして

79
00:04:15,682 --> 00:04:17,417
線を描いて、それから値を増加する

80
00:04:17,597 --> 00:04:20,137
式をチェック、描画、増加

81
00:04:20,447 --> 00:04:22,987
式をチェック、falseならループを終了

82
00:04:23,306 --> 00:04:26,786
でもforループでは順番通りじゃありません

83
00:04:26,846 --> 00:04:29,636
1番を実行、2番を実行、描画を実行、

84
00:04:29,931 --> 00:04:34,931
3番がtrueならまた2番を実行... ちょっと不規則なのです

85
00:04:35,154 --> 00:04:37,614
だんだん理解できるようになるのですが

86
00:04:37,761 --> 00:04:40,791
練習問題として

87
00:04:40,880 --> 00:04:43,457
今まで書いたコードの中でwhileループを含むものを探して

88
00:04:43,529 --> 00:04:46,449
forループに書き直して同じ結果が得られるかみてみると良いでしょう

89
00:04:46,572 --> 00:04:49,412
いったん動画を止めて、やってみてもよいです

90
00:04:49,540 --> 00:04:53,540
先程のグリッドの例を使って、これをコードに入れて、実行する

91
00:04:53,768 --> 00:04:56,378
待った、もう僕がやってたじゃないか

92
00:04:56,439 --> 00:04:58,349
まあでも何か違うものでやってみればいい

93
00:04:58,550 --> 00:04:59,800
考えておきます

94
00:05:00,720 --> 00:05:00,957
えっと何分経ったかな...

95
00:05:01,147 --> 00:05:02,847
5分しか経ってない！素晴らしい動画だね

96
00:05:03,730 --> 00:05:06,793
とりあえずこれをコードに入れて、ちゃんと動くことを確かめましょう

97
00:05:06,959 --> 00:05:10,349
ここではxとyそれぞれにループがあって

98
00:05:10,639 --> 00:05:13,389
どちらもwhileループなのでわかりやすくなっています

99
00:05:13,421 --> 00:05:18,207
これはデモンストレーションなので実際には使わないような書き方をしますが

100
00:05:18,321 --> 00:05:20,741
xの方はwhileループのままにしておいて

101
00:05:20,863 --> 00:05:23,320
yの方をforループにしてみます

102
00:05:24,719 --> 00:05:33,590
forループでまず必要なのは、初期条件でした

103
00:05:33,592 --> 00:05:36,242
次にブール式、y < 高さ

104
00:05:36,637 --> 00:05:38,307
増加の式

105
00:05:40,400 --> 00:05:44,380
それからループの中で行う内容です

106
00:05:44,591 --> 00:05:45,981
線を描くこと

107
00:05:46,362 --> 00:05:54,542
2つのループは考え方としては同じなわけです

108
00:05:54,603 --> 00:05:58,830
一つは水平方向の値、もう一つは垂直方向の値に関わっています

109
00:05:58,393 --> 00:06:00,623
でもforループではギュッと縮まったのがわかりますね

110
00:06:00,749 --> 00:06:02,519
whileループでは5行あるわけですが

111
00:06:02,717 --> 00:06:06,477
こういうループを何度も実行するなら短い書き方があった方が良いでしょう

112
00:06:06,759 --> 00:06:09,900
さあ実行してみましょう、結果が同じになることを確認してください

113
00:06:09,207 --> 00:06:10,267
同じになりました

114
00:06:10,449 --> 00:06:13,319
シンプルで簡単な練習問題としては

115
00:06:14,230 --> 00:06:16,830
このxの方をforループに書き換えてみるのが良いでしょう

116
00:06:17,211 --> 00:06:18,341
実際そんなに簡単な話でもないですけどね

117
00:06:18,558 --> 00:06:19,738
妙な書き方ですよね

118
00:06:19,859 --> 00:06:22,490
セミコロンだのいろんなカッコだの、順番がどうだとか

119
00:06:22,179 --> 00:06:23,879
慣れるにはちょっと時間がかかリますけど

120
00:06:24,300 --> 00:06:27,130
これでwhileループとforループの役割がどんなふうに理解されているか

121
00:06:27,257 --> 00:06:28,987
つかんでもらえたらと思っています

122
00:06:29,324 --> 00:06:33,324
要するにforループはwhileループの短い書き方

123
00:06:33,538 --> 00:06:36,368
とはいえwhileループの方がフレキシブルです

124
00:06:36,688 --> 00:06:40,349
変なコードを何行も並べて

125
00:06:40,449 --> 00:06:43,309
一方forループはとても限定的で選択肢は3つです

126
00:06:43,792 --> 00:06:46,482
かなり短い動画になったんじゃないかな

127
00:06:46,781 --> 00:06:47,891
廊下で誰か笑ってるよ

128
00:06:48,206 --> 00:06:50,786
きっと僕が一人で喋ってるのを聞いて笑ってるんだろう

129
00:06:51,800 --> 00:06:54,310
たしかに笑えるよね

130
00:06:54,727 --> 00:06:57,237
OK、今回はここまで

131
00:06:57,270 --> 00:06:59,690
次の動画でお会いしましょう