1
00:00:00,000 --> 00:00:00,988

2
00:00:00,988 --> 00:00:09,880
>> [Speel van musiek]

3
00:00:09,880 --> 00:00:13,360
>> Spreker 1: Wel, hier is ons,
die laaste P stel in CS50.

4
00:00:13,360 --> 00:00:17,040
Geluk julle uit met
kom so ver sedert jou eerste hallo

5
00:00:17,040 --> 00:00:20,090
wêrelde en uit te druk
piramides vir Mario.

6
00:00:20,090 --> 00:00:21,930
Jy het 'n webwerf het verlede week.

7
00:00:21,930 --> 00:00:25,110
En ons gaan te wees om 'n ander een
hierdie week, een wat jy kan

8
00:00:25,110 --> 00:00:28,570
ry om die Harvard-kampus, pluk
up CS50 personeellede en

9
00:00:28,570 --> 00:00:31,910
bring hulle terug na hul
residensiële huise.

10
00:00:31,910 --> 00:00:35,400
>> Nou verlede week het ons gewerk het in PHP,
'n bediener kant taal.

11
00:00:35,400 --> 00:00:38,250
Vir hierdie P stel, is ons om ingestel
om JavaScript, wat 'n

12
00:00:38,250 --> 00:00:40,600
kliënt kant taal.

13
00:00:40,600 --> 00:00:44,010
So laat ons 'n blik op sommige van die
verspreiding kode wat voorsien is te

14
00:00:44,010 --> 00:00:46,210
jy vir hierdie P stel.

15
00:00:46,210 --> 00:00:49,700
>> In die JavaScript gids, sal daar
'n klomp van die JavaScript-lêers.

16
00:00:49,700 --> 00:00:53,600
Daar is buildings.js, wat bevat 'n
verskeidenheid van geboue rondom die Harvard

17
00:00:53,600 --> 00:00:57,340
kampus, met hul inligting
en posisie.

18
00:00:57,340 --> 00:01:01,630
Houses.js is 'n verskeidenheid van Harvard
residensiële huise, met hul

19
00:01:01,630 --> 00:01:04,030
breedte-en lengte.

20
00:01:04,030 --> 00:01:07,020
Passengers.js bevat 'n
verskeidenheid van passasiers -

21
00:01:07,020 --> 00:01:08,600
die CS50 personeel -

22
00:01:08,600 --> 00:01:11,640
dat jy sal terug te bring na
hul woonhuise.

23
00:01:11,640 --> 00:01:16,450
>> Math3D.js, wat 'n baie bevat
funksies te doen het met die beweging.

24
00:01:16,450 --> 00:01:19,500
As jy wiskundig aangelê,
dan het ek is bly jy neem 'n blik.

25
00:01:19,500 --> 00:01:23,530
Maar jy hoef nie te verstaan
alles daar in.

26
00:01:23,530 --> 00:01:26,710
Shuttle.js, wat handel oor
die bus se beweging.

27
00:01:26,710 --> 00:01:31,450
En index.html is die tuisblad waar
alles gebeur, regtig, waar die

28
00:01:31,450 --> 00:01:33,610
gebruiker interaksie met die site.

29
00:01:33,610 --> 00:01:39,110
>> Service.css is die CSS style sheet,
wat, benewens die Twitter

30
00:01:39,110 --> 00:01:43,960
Skoenlus biblioteek, kontrole
hoe index.html lyk.

31
00:01:43,960 --> 00:01:48,190
En dan het ons ook service.js, wat
bevat diens funksies vir

32
00:01:48,190 --> 00:01:49,010
die bus.

33
00:01:49,010 --> 00:01:53,010
En hier is waar jy gaan wees
vul in sommige van die dos.

34
00:01:53,010 --> 00:01:56,600
>> Nou kom ons neem 'n blik op voorwerpe en
assosiatiewe skikkings in JavaScript,

35
00:01:56,600 --> 00:01:59,360
wat vir alle praktiese doeleindes
is verwissel.

36
00:01:59,360 --> 00:02:03,030
As ek wou 'n voorwerp te maak 'n veranderlike
genoem 'n muur, sou ek

37
00:02:03,030 --> 00:02:04,290
verklaar.

38
00:02:04,290 --> 00:02:08,789
En binne-in die krulhakies ek sou
spesifiseer die kern is buffel.

39
00:02:08,789 --> 00:02:10,220
Die hout is kersie.

40
00:02:10,220 --> 00:02:12,710
En die lengte is 13.

41
00:02:12,710 --> 00:02:16,370
>> Nou kan ek ook toegang tot waardes
voorwerpe deur

42
00:02:16,370 --> 00:02:18,270
assosiatiewe skikking notasie.

43
00:02:18,270 --> 00:02:22,610
So muur indeks kern, kan ek
wat gelykstaande aan buffel, of

44
00:02:22,610 --> 00:02:24,710
seker te maak dat, indien ek nodig het.

45
00:02:24,710 --> 00:02:26,510
Of ek kan die dot operateur gebruik.

46
00:02:26,510 --> 00:02:30,280
Muur dot hout gelyk kers,
en so aan, en so meer.

47
00:02:30,280 --> 00:02:33,930
So jy sien dat assosiatiewe skikkings en
voorwerpe in JavaScript gaan wees

48
00:02:33,930 --> 00:02:37,720
verwissel, en wil
kom in baie handig.

49
00:02:37,720 --> 00:02:41,570
>> Toe sien ons 'n verskeidenheid van geboue
in buildings.js.

50
00:02:41,570 --> 00:02:43,870
Weereens, 'n verskeidenheid van voorwerpe.

51
00:02:43,870 --> 00:02:48,500
As ek wou 'n skikking van die beste te maak
geboue op Harvard-kampus, dan

52
00:02:48,500 --> 00:02:49,710
Ek sou dit as volg maak.

53
00:02:49,710 --> 00:02:55,250
Die gebruik van hierdie voorwerp notasie, waar
Ek slaan die wortel, naam, adres,

54
00:02:55,250 --> 00:03:00,260
breedte en lengte-vir elke
enkele gebou voorwerp.

55
00:03:00,260 --> 00:03:02,930
>> Kom ons vinnig praat oor veranderlikes
in JavaScript.

56
00:03:02,930 --> 00:03:07,760
Soos PHP, JavaScript veranderlikes
is swak of losweg getik.

57
00:03:07,760 --> 00:03:14,120
'N plaaslike veranderlike te bou, is prefix
die veranderlike naam met die V-A-R, var.

58
00:03:14,120 --> 00:03:17,010
>> Nou in JavaScript, funksies
die beperking van die omvang van veranderlikes.

59
00:03:17,010 --> 00:03:20,600
So as jy 'n plaaslike veranderlike binne
'n funksie, dan ander funksies

60
00:03:20,600 --> 00:03:22,060
kan nie toegang tot dit.

61
00:03:22,060 --> 00:03:26,090
Maar in teenstelling met C, loops en voorwaardes nie
beperking van die omvang van 'n veranderlike.

62
00:03:26,090 --> 00:03:30,600
>> So selfs as jy dit verkondig binnekant van 'n
toestand is, die hele funksie

63
00:03:30,600 --> 00:03:32,810
het toegang tot dit.

64
00:03:32,810 --> 00:03:35,820
Nou sonder var, die veranderlike
globale wees.

65
00:03:35,820 --> 00:03:39,170
So as jy net verklaar dat die naam en
Gee 'n waarde het, dan die veranderlike

66
00:03:39,170 --> 00:03:41,900
sal 'n globale veranderlike
in JavaScript.

67
00:03:41,900 --> 00:03:48,480
>> Nou in huise, ons het 'n assosiatiewe
verskeidenheid van die huis van die tipe voorwerpe, waar

68
00:03:48,480 --> 00:03:52,100
elke huis is net 'n breedte
en 'n lengte aan.

69
00:03:52,100 --> 00:03:55,140
Dan het ons die passasiers
skikking, wat 'n verskeidenheid

70
00:03:55,140 --> 00:03:57,370
voorwerp tipe passasier.

71
00:03:57,370 --> 00:04:01,620
So elke passasier het 'n rekening het nie,
'n naam en 'n huis.

72
00:04:01,620 --> 00:04:04,840
Let daarop dat ek sien van die tipe
passasier, wat eintlik maar net beteken

73
00:04:04,840 --> 00:04:08,150
dat elke voorwerp het die
dieselfde sleutel waarde paar.

74
00:04:08,150 --> 00:04:12,830
So elke voorwerp van die tipe passasier het
'n gebruiker se naam, 'n naam en 'n huis.

75
00:04:12,830 --> 00:04:14,850
>> So wat doen ons nodig het om te
doen vir die P stel?

76
00:04:14,850 --> 00:04:20,779
Wel, moet ons toelaat dat gebruikers te kies
up personeellede, al te vertoon

77
00:04:20,779 --> 00:04:25,090
die personeel wat tans in
ons shuttle, en hulle af te laai.

78
00:04:25,090 --> 00:04:29,280
En dan sal ons ook praat oor ekstra
eienskappe wat vir geïmplementeer kan word

79
00:04:29,280 --> 00:04:30,980
die bus P stel.

80
00:04:30,980 --> 00:04:33,610
>> Maar laat ons praat oor die bakkie eerste.

81
00:04:33,610 --> 00:04:37,480
Die gesigte van CS50 personeel is
geplant regoor kampus, waar elke

82
00:04:37,480 --> 00:04:41,750
gesig is geïmplementeer as 'n plek merk
op die 3D aarde, en as 'n

83
00:04:41,750 --> 00:04:44,030
merker op die kaart 2D.

84
00:04:44,030 --> 00:04:47,880
So wanneer die gebruiker die bakkie druk
knoppie, wil ons na die nabygeleë voeg

85
00:04:47,880 --> 00:04:49,590
passasiers op die bus.

86
00:04:49,590 --> 00:04:53,650
En ons wil ook hul plek te verwyder
merk van die wêreld, en verwyder hulle

87
00:04:53,650 --> 00:04:58,060
merker op die kaart, wat aandui dat
Hulle is in ons pendel nou.

88
00:04:58,060 --> 00:05:02,520
>> So hoe kan ons spoor indien passasiers
binne die omvang van ons shuttle?

89
00:05:02,520 --> 00:05:04,610
Wel, die funksie afstand -

90
00:05:04,610 --> 00:05:08,770
so shuttle dot afstand, verby in
die lengte-en breedtegraad, sal

91
00:05:08,770 --> 00:05:12,030
bereken die afstand vanaf die huidige
posisie van die bus na die

92
00:05:12,030 --> 00:05:15,850
wys dat jy spesifiseer met daardie
gegee-en breedtelyne.

93
00:05:15,850 --> 00:05:19,180
So jy kan dit gebruik om te bereken die
afstand van die bus na die

94
00:05:19,180 --> 00:05:20,310
passasiers.

95
00:05:20,310 --> 00:05:24,040
>> Maar hoe weet jy waar
die passasiers is?

96
00:05:24,040 --> 00:05:27,510
Wel, dit is waar ons sal moet
wysig die ingestuur funksie.

97
00:05:27,510 --> 00:05:32,500
Vul plekke van al die personeel
en passasiers in die wêreld,

98
00:05:32,500 --> 00:05:36,300
en in die kaart, maar nie
slaan hul plek.

99
00:05:36,300 --> 00:05:39,850
So miskien kan jy slaan hulle
plaas punte en merkers

100
00:05:39,850 --> 00:05:41,570
in 'n globale skikking.

101
00:05:41,570 --> 00:05:45,780
>> Nou is daar reeds 'n globale skikking
stoor van inligting passasiers.

102
00:05:45,780 --> 00:05:49,960
Die passasiers verskeidenheid winkels elke
passasier se naam en hul huis.

103
00:05:49,960 --> 00:05:54,985
So miskien kan jy 'n paar parameters voeg
daar aan die passasier voorwerpe.

104
00:05:54,985 --> 00:05:59,290
>> Om ons te help spoor al die passasiers
binne die omvang van ons shuttle, laat

105
00:05:59,290 --> 00:06:02,500
loop deur al die passasiers
in die passasiers skikking.

106
00:06:02,500 --> 00:06:07,790
'N lus vir in JavaScript kan kyk
iets soos hierdie, baie soortgelyk aan

107
00:06:07,790 --> 00:06:12,910
dié vir lus in C. Of ons kan gebruik om 'n
alternatiewe vir lusstruktuur.

108
00:06:12,910 --> 00:06:17,130
>> Vir var i in skikking, waar ek
sal steeds die indeks.

109
00:06:17,130 --> 00:06:20,740
Maar jy hoef nie te spesifiseer
die skikking dot lengte

110
00:06:20,740 --> 00:06:23,310
toestand, en ek plus plus.

111
00:06:23,310 --> 00:06:26,140
Elke passasier se plek is
gegee deur hul plek merk.

112
00:06:26,140 --> 00:06:29,800
>> Maar die plek merk is nie die
breedte en die lengte aan.

113
00:06:29,800 --> 00:06:34,575
Ons het daardie parameters om toegang te verkry deur
om die meetkunde, met behulp van get

114
00:06:34,575 --> 00:06:35,900
meetkunde op die plek merk.

115
00:06:35,900 --> 00:06:39,630
En dan as ons die meetkunde,
om óf die lengte of die

116
00:06:39,630 --> 00:06:42,600
die lengte, met behulp van die funksies.

117
00:06:42,600 --> 00:06:45,680
>> So nou weet ons hoe om op te spoor of
passasiers is binne

118
00:06:45,680 --> 00:06:47,920
omvang van ons pendel.

119
00:06:47,920 --> 00:06:52,050
Sodra ons daardie passasiers, sal ons
wil enige passasiers wat by te voeg

120
00:06:52,050 --> 00:06:53,140
binne daardie reeks.

121
00:06:53,140 --> 00:06:57,580
Ons wil hulle toelaat om te hop, en
neem 'n sitplek op ons shuttle, maar slegs

122
00:06:57,580 --> 00:06:59,640
As ons genoeg ruimte vir hulle.

123
00:06:59,640 --> 00:07:04,120
>> Die pendeltuig dot sitplekke skikking
aandui of sitplekke is leeg, of

124
00:07:04,120 --> 00:07:05,890
wat is in daardie stoel.

125
00:07:05,890 --> 00:07:11,170
So as 'n stoel is leeg, dan
daardie setel sal nul wees.

126
00:07:11,170 --> 00:07:15,930
So Itereer oor die sitplekke skikking,
nagaan vir leë sitplekke, stoor

127
00:07:15,930 --> 00:07:20,020
passasiers in die sitplekke totdat jy
het geen meer leë sitplekke.

128
00:07:20,020 --> 00:07:23,330
En ongelukkig, enige ander passasiers
sal moet wag vir die

129
00:07:23,330 --> 00:07:26,000
volgende keer op die bus kom rond.

130
00:07:26,000 --> 00:07:30,280
>> Sodra hulle kry op die bus, sal ons wil
hul plek punt te verwyder, wat

131
00:07:30,280 --> 00:07:32,540
is hul foto in die 3D-wêreld.

132
00:07:32,540 --> 00:07:38,030
As ek wou 'n plek merk p te verwyder,
dan sou ek al die eienskappe kry

133
00:07:38,030 --> 00:07:42,790
van my aarde, van die Google Earth,
en dan verwyder daardie spesifieke plek

134
00:07:42,790 --> 00:07:45,910
merk met behulp van die removeChild funksie.

135
00:07:45,910 --> 00:07:51,360
Dan laastens, laat ons verwyder die merker,
die ikoon op die 2D kaart vir enige

136
00:07:51,360 --> 00:07:53,650
passasier wat ons optel.

137
00:07:53,650 --> 00:07:59,790
'N merker, m te verwyder, dan sal ek
net voer m dot setMap null.

138
00:07:59,790 --> 00:08:02,920
Doen dit vir enige passasiers wat binne die omvang,
en jy het die bakkie klaar.

139
00:08:02,920 --> 00:08:05,056