1
00:00:00,000 --> 00:00:09,870

2
00:00:09,870 --> 00:00:13,360
>> ZAMYLA CHAN：さて、ここで我々は、
最後のP-セットCS50に。

3
00:00:13,360 --> 00:00:17,040
持っていることから自分自身を祝福
ここまで来て最初こんにちは以来

4
00:00:17,040 --> 00:00:20,090
世界と印刷のアップ
マリオのためのピラミッド。

5
00:00:20,090 --> 00:00:21,930
あなたは先週、ウェブサイトを作りました。

6
00:00:21,930 --> 00:00:25,110
そして、我々は別のものを作ることになるだろう
今週、あなたがすることを可能にする1

7
00:00:25,110 --> 00:00:28,570
ピッキング、ハーバード大学のキャンパスをドライブ
CS50スタッフと最高

8
00:00:28,570 --> 00:00:31,910
戻って自分のためにそれらを持って来る
住宅。

9
00:00:31,910 --> 00:00:35,400
>> さて、先週我々は、PHPで働いていた
サーバー側の言語。

10
00:00:35,400 --> 00:00:38,250
このpのセットのために、我々は導入取得している
されるJavaScriptに

11
00:00:38,250 --> 00:00:40,610
クライアント側の言語。

12
00:00:40,610 --> 00:00:44,020
それでは、いくつか見てみましょう
に提供の流通コード

13
00:00:44,020 --> 00:00:46,210
このpセットのためのあなた。

14
00:00:46,210 --> 00:00:49,700
JavaScriptのフォルダに、そこに意志
JavaScriptファイルの束であること。

15
00:00:49,700 --> 00:00:53,600
>> 含まれていますbuildings.jsがあります
ハーバード大学の周りの建物の配列

16
00:00:53,600 --> 00:00:57,340
自分の情報を使用したキャンパス
と位置。

17
00:00:57,340 --> 00:01:01,630
Houses.jsはハーバードの配列です
彼らの持つ住宅

18
00:01:01,630 --> 00:01:04,030
緯度と経度。

19
00:01:04,030 --> 00:01:08,600
Passengers.jsはの配列が含まれています
乗客、CS50スタッフ

20
00:01:08,600 --> 00:01:11,640
あなたがに持ち帰ることだろうと
彼らの住宅。

21
00:01:11,640 --> 00:01:16,450
>> を多く含むMath3D.js、
運動とは何の機能。

22
00:01:16,450 --> 00:01:19,500
あなたは数学的に志向している場合は、
私はあなたが見てみるために歓迎する。

23
00:01:19,500 --> 00:01:23,530
しかし、あなたが理解する必要はありません
そこにすべてのもの。

24
00:01:23,530 --> 00:01:26,710
扱うShuttle.js、
シャトルの動き。

25
00:01:26,710 --> 00:01:31,450
とindex.htmlのホームページです
すべては、本当に、どうなる場所

26
00:01:31,450 --> 00:01:33,610
ユーザーがサイトと対話している。

27
00:01:33,610 --> 00:01:39,110
>> Service.cssは、CSSスタイルシートで、
Twitterのに加えている

28
00:01:39,110 --> 00:01:43,960
ブートストラップ·ライブラリ、コントロール
どのようにindex.htmlに見える。

29
00:01:43,960 --> 00:01:48,190
そして、我々はまた、service.jsを持っている
のためのサービス機能が含まれています

30
00:01:48,190 --> 00:01:49,010
シャトル。

31
00:01:49,010 --> 00:01:53,010
あなたがあることを行っている場所とここにある
のto-doのいくつかを記入。

32
00:01:53,010 --> 00:01:56,600
>> それでは、オブジェクトを見てみましょうと、
JavaScriptで連想配列、

33
00:01:56,600 --> 00:01:59,360
これは、すべての意図や目的のために、
交換可能です。

34
00:01:59,360 --> 00:02:03,030
私は、オブジェクト変数作りたい場合
私は、杖になると呼ばれる

35
00:02:03,030 --> 00:02:04,290
それを宣言します。

36
00:02:04,290 --> 00:02:09,350
そして、それらの中括弧内に、私はだろう
コアは、木材ユニコーンで、指定

37
00:02:09,350 --> 00:02:12,710
チェリーであり、長さは13である。

38
00:02:12,710 --> 00:02:16,370
>> 今、私はまた、値にアクセスすることができます
使用してオブジェクトの

39
00:02:16,370 --> 00:02:18,270
連想配列表記法。

40
00:02:18,270 --> 00:02:22,610
私が設定することもできますので、杖屈折率コア、
ユニコーンに等しいこと、または

41
00:02:22,610 --> 00:02:24,710
私は必要がある場合はそれを確認してください。

42
00:02:24,710 --> 00:02:28,890
または私はドット演算子を使用することができます
wand.wood桜に等しく、

43
00:02:28,890 --> 00:02:30,280
などなど。

44
00:02:30,280 --> 00:02:33,930
だから、連想配列が分かりや
JavaScriptでのオブジェクトがあることを行っている

45
00:02:33,930 --> 00:02:37,710
交換可能、とウィル
かなり便利になる。

46
00:02:37,710 --> 00:02:41,570
>> その後、我々は建物の配列を参照してください。
buildings.jsにおいて、

47
00:02:41,570 --> 00:02:43,870
再び、オブジェクトの配列。

48
00:02:43,870 --> 00:02:48,500
私は最高の配列を作りたい場合
その後、ハーバード大学キャンパスの建物、

49
00:02:48,500 --> 00:02:49,710
次のように私はそれを作るだろう。

50
00:02:49,710 --> 00:02:55,250
このオブジェクトの表記法を使用して、どこで
私は根、名前、住所を格納し、

51
00:02:55,250 --> 00:03:00,260
すべての緯度、および経度
つの建物オブジェクト。

52
00:03:00,260 --> 00:03:02,930
>> のはすぐに変数についてお話しましょう
JavaScriptで。

53
00:03:02,930 --> 00:03:07,760
PHP、JavaScriptの変数のように
弱いまたは緩く型付けされています。

54
00:03:07,760 --> 00:03:14,120
ローカル変数を作成するには、接頭辞
V-A-R、VAR変数名。

55
00:03:14,120 --> 00:03:17,010
今、JavaScriptでは、関数は、意志
変数の範囲を制限する。

56
00:03:17,010 --> 00:03:20,600
だから、内のローカル変数を持っている場合
機能は、他の機能

57
00:03:20,600 --> 00:03:22,060
それにアクセスすることはできません。

58
00:03:22,060 --> 00:03:26,090
>> しかし、Cとは異なり、ループや条件にはありません
変数の範囲を制限する。

59
00:03:26,090 --> 00:03:30,600
だから、Aの内部でそれを宣言する場合でも、
条件、関数全体の意志

60
00:03:30,600 --> 00:03:32,810
それにアクセスすることができます。

61
00:03:32,810 --> 00:03:35,820
今、VARなしで、変数
グローバルになります。

62
00:03:35,820 --> 00:03:39,170
あなただけの名前を宣言し、もしそうであれば
値を割り当て、その変数

63
00:03:39,170 --> 00:03:41,900
グローバル変数になります
JavaScriptで。

64
00:03:41,900 --> 00:03:48,480
>> 今、家で、我々は連想を持っている
ホストTypeオブジェクトの配列。ここで

65
00:03:48,480 --> 00:03:52,100
すべての家はちょうど緯度
と経度。

66
00:03:52,100 --> 00:03:55,140
その後、我々は乗客を持っている
配列になって、

67
00:03:55,140 --> 00:03:57,370
オブジェクト型の乗客の。

68
00:03:57,370 --> 00:04:01,620
したがって、すべての乗客には、ユーザーがある
名前、名前、および家。

69
00:04:01,620 --> 00:04:04,840
>> 私はタイプの言っていることに注意してください
実際には意味の乗客、

70
00:04:04,840 --> 00:04:08,150
すべてのオブジェクトが持っていることを
同じキーと値のペア。

71
00:04:08,150 --> 00:04:12,830
そうタイプの乗用車のすべてのオブジェクトがあります
ユーザー名、名前、および家。

72
00:04:12,830 --> 00:04:14,850
だから我々はには何が必要なのですか
P-セットのために何が？

73
00:04:14,850 --> 00:04:20,779
まあ、我々は、ユーザーが選択できるようにする必要があります
スタッフメンバーまで、すべてを表示するには

74
00:04:20,779 --> 00:04:25,080
に現在あるスタッフメンバー
私たちのシャトルバス、それらをオフにドロップします。

75
00:04:25,080 --> 00:04:29,395
そして、我々はまた、余分な話をします
のために実装できる機能

76
00:04:29,395 --> 00:04:30,980
シャトルP-セット。

77
00:04:30,980 --> 00:04:33,610
>> しかし、ここでは最初のピックアップについてお話ししましょう​​。

78
00:04:33,610 --> 00:04:37,480
CS50スタッフの顔があった
ここで、それぞれ、すべてのキャンパスの上に植え

79
00:04:37,480 --> 00:04:41,750
顔が場所マークとして実装されています
3D地球上などの

80
00:04:41,750 --> 00:04:44,020
2Dマップ上のマーカー。

81
00:04:44,020 --> 00:04:47,880
ユーザがピックアップをクリックしたときに
ボタン、我々は、近く追加する

82
00:04:47,880 --> 00:04:49,590
シャトルバスの乗客。

83
00:04:49,590 --> 00:04:53,650
そして、我々はまた、その場所を削除したい
世界からマークして削除し、その

84
00:04:53,650 --> 00:04:58,060
それを示すマップからのマーカー、
彼らは今、私たちのシャトルにいる。

85
00:04:58,060 --> 00:05:02,520
>> では、どのように検出しないかの乗客
私たちのシャトルの範囲内にある？

86
00:05:02,520 --> 00:05:06,670
さて、関数の距離なので、
渡しshuttle.distance、

87
00:05:06,670 --> 00:05:10,630
緯度と経度は、計算されます
現在位置からの距離

88
00:05:10,630 --> 00:05:14,220
その時点までのシャトルの
あなたはそれが与えられたとの指定

89
00:05:14,220 --> 00:05:15,860
緯度と経度。

90
00:05:15,860 --> 00:05:19,180
だから、計算するためにこれを使用することができます
へのシャトルからの距離

91
00:05:19,180 --> 00:05:20,310
乗客。

92
00:05:20,310 --> 00:05:24,040
>> しかし、どのようにどこで知っていますか
乗客は何ですか？

93
00:05:24,040 --> 00:05:27,510
我々はする必要がありますどこでまあ、それはだ
移入機能を編集します。

94
00:05:27,510 --> 00:05:32,500
場所のスタッフのすべてを取り込む
世界への乗客中

95
00:05:32,500 --> 00:05:36,300
そしてマップにしませんが、
その場所に保管します。

96
00:05:36,300 --> 00:05:39,850
だから、おそらくあなたは自分を保存することができます
マークやマーカーを配置

97
00:05:39,850 --> 00:05:41,570
いくつかのグローバル配列内の。

98
00:05:41,570 --> 00:05:45,780
>> 今、すでに世界的な配列があります
乗客からの情報を記憶する。

99
00:05:45,780 --> 00:05:49,960
乗客·アレイには、各
乗客の名前と彼らの家。

100
00:05:49,960 --> 00:05:54,985
だから、多分あなたは、いくつかのパラメータを追加することができます
そこに乗客のオブジェクトに。

101
00:05:54,985 --> 00:05:58,150
>> 私たちは、乗客のすべての検出に役立つ
私達の範囲内

102
00:05:58,150 --> 00:06:02,485
のすべてを、シャトル、レッツ·ループ
乗客·アレイ内の乗客。

103
00:06:02,485 --> 00:06:07,790
JavaScriptでループが見えるかもしれません
と非常に似て、このようなもの、

104
00:06:07,790 --> 00:06:13,200
Cのforループのものあるいは我々が使用することができます
例えば、ループ構造のための代替

105
00:06:13,200 --> 00:06:18,680
私はまだなり、アレイ内のVAR I
インデックスがありますが、する必要はありません

106
00:06:18,680 --> 00:06:23,310
Array.lengthとを指定する
条件およびI + +。

107
00:06:23,310 --> 00:06:26,130
>> すべての乗客の場所にあります。
その場所のマークが与えられ。

108
00:06:26,130 --> 00:06:29,800
しかし、場所のマークがありません
緯度と経度。

109
00:06:29,800 --> 00:06:34,170
我々は、で、これらのパラメータにアクセスする必要が
GETを使用して、ジオメトリを取得

110
00:06:34,170 --> 00:06:38,180
場所マークを幾何学、その後、
我々は、ジオメトリを取得したら、取得

111
00:06:38,180 --> 00:06:42,580
緯度や経度のいずれか
これらの機能を使用して。

112
00:06:42,580 --> 00:06:45,680
>> だから今我々は、かどうかを検出する方法を知っている
乗客は内にある

113
00:06:45,680 --> 00:06:47,920
私たちのシャトルの範囲。

114
00:06:47,920 --> 00:06:52,050
我々は、これらの乗客を取得したら、我々はよ
ているすべての乗客を追加する

115
00:06:52,050 --> 00:06:53,140
その範囲内。

116
00:06:53,140 --> 00:06:57,580
我々は彼らが上にホップして取ることができるようにしたい
私たちのシャトルバスで席だけ

117
00:06:57,580 --> 00:06:59,630
我々は彼らに十分なスペースがある場合。

118
00:06:59,630 --> 00:07:04,120
>> shuttle.seats配列が表示されます
席が空であるかどうか、または

119
00:07:04,120 --> 00:07:05,890
誰がその席にあります。

120
00:07:05,890 --> 00:07:11,160
そう座席が、その後、空の場合
その座席はnullになります。

121
00:07:11,160 --> 00:07:15,930
そのため、座席の配列を反復
収納、空席の確認

122
00:07:15,930 --> 00:07:20,020
するまで、それらの席に乗客
これ以上空席がありません。

123
00:07:20,020 --> 00:07:23,330
残念ながら、他の乗客
を待つ必要があります

124
00:07:23,330 --> 00:07:26,000
次回シャトルがダウンしています。

125
00:07:26,000 --> 00:07:30,280
>> 彼らは、シャトルに乗ると、私たちはお勧めします
その場所のマークを削除するには、どの

126
00:07:30,280 --> 00:07:32,580
3Dの世界での写真です。

127
00:07:32,580 --> 00:07:38,030
私はその場所のマークPを削除したい場合は、
私はすべての機能になるだろう

128
00:07:38,030 --> 00:07:42,820
私の地球から、グーグルアースから、
して、その特定の場所を削除

129
00:07:42,820 --> 00:07:45,910
removeChildの機能を使用してマークします。

130
00:07:45,910 --> 00:07:51,360
そして、最後に、のは、マーカーを削除しましょう​​、
任意のための2Dマップ上のアイコン、

131
00:07:51,360 --> 00:07:53,650
私たちが拾っている乗客。

132
00:07:53,650 --> 00:07:59,790
>> マーカーMを削除するには、私はよ
ただm.setMapヌルを実行します。

133
00:07:59,790 --> 00:08:03,670
範囲内の任意の乗客のためにこれを行う、
あなたはピックアップを終えた。

134
00:08:03,670 --> 00:08:07,890
チャート機能は、すべてを表示する必要があります
あなたの内にある乗客の

135
00:08:07,890 --> 00:08:11,000
シャトルバス、空席、空の場合。

136
00:08:11,000 --> 00:08:14,420
だから、チャートは反復処理する必要があり
表示shuttle.seats、

137
00:08:14,420 --> 00:08:21,350
すべてのインデックスの旅客情報、
そのインデックスがnullの場合、空の席。

138
00:08:21,350 --> 00:08:26,160
>> 今HTMLテキストは、Aの内側に置かれている場合
JavaScriptの変数は、使用して

139
00:08:26,160 --> 00:08:31,950
のdocument.getElementById、チャート缶
与えられたものの内部HTMLを編集

140
00:08:31,950 --> 00:08:36,140
割り当てることにより、要素
へのHTMLテキスト

141
00:08:36,140 --> 00:08:40,840
のdocument.getElementById内部HTML変数。

142
00:08:40,840 --> 00:08:46,180
ユーザーがドロップオフ]ボタンをクリックすると、
index.htmlには、電話するよ

143
00:08:46,180 --> 00:08:47,160
ドロップオフ機能。

144
00:08:47,160 --> 00:08:49,510
そして、それはそれを実装するために私たちの仕事です。

145
00:08:49,510 --> 00:08:54,150
>> ドロップオフでは、いずれかを削除したいと思う
シャトルからの乗客の場合にのみ

146
00:08:54,150 --> 00:08:58,740
我々は彼らの目的地の範囲にいる、
彼らの住宅。

147
00:08:58,740 --> 00:09:03,300
だから、ドロップオフがいるかどうかを確認する必要があります
シャトルは任意の範囲である

148
00:09:03,300 --> 00:09:08,200
住宅、および削除、必要な
シャトルからの乗客。

149
00:09:08,200 --> 00:09:11,020
我々はしているのであれば、どのようにチェックしますか
どんな家の範囲内？

150
00:09:11,020 --> 00:09:16,630
さて、再び、我々はを利用することができます
を渡し、機能をshuttle.distance

151
00:09:16,630 --> 00:09:20,990
点の緯度と経度
私たちはと照合していること。

152
00:09:20,990 --> 00:09:22,730
>> しかし、これらのポイントは何ですか？

153
00:09:22,730 --> 00:09:27,210
あなたが覚えていればよく、住宅·アレイ、
houses.jsに格納

154
00:09:27,210 --> 00:09:32,790
各家の緯度と経度
連想配列は、すべての

155
00:09:32,790 --> 00:09:35,980
インデックスは、その家の名前です。

156
00:09:35,980 --> 00:09:37,590
その後、乗客を削除するには - 

157
00:09:37,590 --> 00:09:41,820
まあ、我々は彼らの範囲にいる場合のみ、
彼らはに行きたい家。

158
00:09:41,820 --> 00:09:46,380
だからもう一度、覚えている乗客
店舗ごとの乗客の家

159
00:09:46,380 --> 00:09:48,850
に行きたい。

160
00:09:48,850 --> 00:09:51,670
彼らは彼らの範囲内にある場合
家、そして我々はそれを削除します

161
00:09:51,670 --> 00:09:57,200
shuttle.seatsとセットから乗客
nullに配列内の位置。

162
00:09:57,200 --> 00:10:00,220
>> それでは、いくつかの追加機能について話しましょう
すなわち、実施することが可能である

163
00:10:00,220 --> 00:10:02,690
CS50シャトルP-セット。

164
00:10:02,690 --> 00:10:05,850
ポイントシステムがあります、それによって
あなたは何を追跡

165
00:10:05,850 --> 00:10:07,520
ユーザーが持って指摘している。

166
00:10:07,520 --> 00:10:11,120
乗客を降ろしたため
成功し、彼らはポイントを得ることができます。

167
00:10:11,120 --> 00:10:15,100
しかし、乗客を降ろししようとしているため
どこでどんな家が近くに存在しない、

168
00:10:15,100 --> 00:10:16,980
まあ、それはそのために罰せ得ることができます。

169
00:10:16,980 --> 00:10:21,790
だから、おそらくあなたはを追跡したい
グローバル変数内のポイント。

170
00:10:21,790 --> 00:10:25,970
>> あなたはどこで、恐らくタイマーを実装することができます
ユーザは、一定量を有している

171
00:10:25,970 --> 00:10:29,800
ピックアップし、Aをドロップオフまでの時間
乗客の一定数。

172
00:10:29,800 --> 00:10:33,280
多分これを統合
ポイントシステムで。

173
00:10:33,280 --> 00:10:39,970
または、このようなことをグラフに編集することができます
乗客は家によって並べ替えられています。

174
00:10:39,970 --> 00:10:45,250
だから、おそらく一種だろう
shuttle.seatsする機能。

175
00:10:45,250 --> 00:10:49,240
>> あなたが飛んで機能を実装することができ、
ここでユーザーがコナミを入力すると

176
00:10:49,240 --> 00:10:53,460
コー​​ドは、その後、シャトルはリフトオフ
地面とシャトルが飛ぶことができる。

177
00:10:53,460 --> 00:10:58,890
しかし、オフの安全な降下を、最大限に活用するために
シャトルは上その車輪を着陸

178
00:10:58,890 --> 00:11:00,700
第一グランド。

179
00:11:00,700 --> 00:11:05,910
また、テレポーテーションを実装することができ、
あなたはのドロップダウンリストを作成する場合、

180
00:11:05,910 --> 00:11:08,380
index.htmlの建物。

181
00:11:08,380 --> 00:11:12,270
そのうちの1選択する
ユーザーは、に輸送されます

182
00:11:12,270 --> 00:11:14,220
キャンパス内に構築すること。

183
00:11:14,220 --> 00:11:16,760
[OK]を、しかし、通過するの
いくつかの壁

184
00:11:16,760 --> 00:11:19,290
そこにあなたの方法上の建物。

185
00:11:19,290 --> 00:11:22,960
>> また、速度を変更することができ
シャトルは、ユーザが増加することを可能に

186
00:11:22,960 --> 00:11:25,490
または速度を減少させる。

187
00:11:25,490 --> 00:11:28,840
おそらく、あなたはグローバル変数にしたい
どのくらいの燃料を追跡

188
00:11:28,840 --> 00:11:31,520
シャトルは減少し、持って
それあなたが一緒に行くように。

189
00:11:31,520 --> 00:11:35,860
あなたがゼロをヒットしたら、しかし、シャトル
あなたはしていない限り移動することはできません

190
00:11:35,860 --> 00:11:40,610
おそらくボタンを使って、又は、給油
でも、あなた自身のガソリンスタンドを作る。

191
00:11:40,610 --> 00:11:43,240
>> しかし、それは確かではありません
完全なリスト。

192
00:11:43,240 --> 00:11:46,340
フルのためのスペックをチェックしてください
おそらく、リスト、または提案

193
00:11:46,340 --> 00:11:47,840
あなたのTFに自分。

194
00:11:47,840 --> 00:11:48,950
空は限界です。

195
00:11:48,950 --> 00:11:53,110
これはあなたの最後のCS50パラセットです、
ので、それを楽しんでいる。

196
00:11:53,110 --> 00:11:56,360
これはCS50シャトルた。

197
00:11:56,360 --> 00:11:59,230
>> 私はそれが楽しかったですが、言ってんだ
であなたのためにこれらを作る

198
00:11:59,230 --> 00:12:00,400
制作チーム。

199
00:12:00,400 --> 00:12:04,330
と私はあなたがしたことを願っています
だけでなく、それらを楽しむ。

200
00:12:04,330 --> 00:12:06,040
私の名前はZamylaです。

201
00:12:06,040 --> 00:12:08,310
そして、これはCS50た。

202
00:12:08,310 --> 00:12:16,363