1
00:00:00,000 --> 00:00:11,330

2
00:00:11,330 --> 00:00:12,360
>> DAVID MALAN: Okej.

3
00:00:12,360 --> 00:00:15,970
Detta är CS50, och detta är
I slutet av vecka nio.

4
00:00:15,970 --> 00:00:18,560
Det har varit en virvelvind över
de senaste dagarna.

5
00:00:18,560 --> 00:00:21,580
Och problemet satt sju, om du är knä
djupt in i det, inser att det är ganska

6
00:00:21,580 --> 00:00:23,340
lite nytt som finns där.

7
00:00:23,340 --> 00:00:26,660
Men låt oss se om vi inte kan pussla
allt tillsammans här i korthet

8
00:00:26,660 --> 00:00:29,230
innan dess vridande sig i ännu
en annan riktning och ser

9
00:00:29,230 --> 00:00:30,510
var annars kan vi gå.

10
00:00:30,510 --> 00:00:32,630
>> Så hittills har vi pratat om HTML.

11
00:00:32,630 --> 00:00:33,740
Vi har pratat om CSS.

12
00:00:33,740 --> 00:00:34,705
Vi har pratat om PHP.

13
00:00:34,705 --> 00:00:36,520
Du har börjat uppleva SQL.

14
00:00:36,520 --> 00:00:38,360
Idag ska vi prata lite
om JavaScript.

15
00:00:38,360 --> 00:00:41,230
Men hur gör alla dessa disparata
språk passar ihop?

16
00:00:41,230 --> 00:00:44,970
>> Så vi pratade förra veckan om
Begreppet att ha en server.

17
00:00:44,970 --> 00:00:48,470
Så låt oss bara dra denna rektangel
som en webbserver här.

18
00:00:48,470 --> 00:00:52,200
Och en webbserver fungerar säkert filer.

19
00:00:52,200 --> 00:00:54,640
Och en del av dessa filer
kan vara HTML-filer.

20
00:00:54,640 --> 00:00:58,270
Så en av de saker som en webbserver
kan spotta ut kan vara en fil som

21
00:00:58,270 --> 00:01:01,290
Vi ska bara dra ut så här
innehåller vissa HTML.

22
00:01:01,290 --> 00:01:04,786
Så i lekmannatermer, vad
gör HTML kan du göra?

23
00:01:04,786 --> 00:01:06,036
>> PUBLIK: Sidan ser trevligt.

24
00:01:06,036 --> 00:01:09,670

25
00:01:09,670 --> 00:01:12,310
>> DAVID MALAN: OK, gör en sida ser trevligt,
även om jag tror att jag har bevisat

26
00:01:12,310 --> 00:01:13,370
som annars.

27
00:01:13,370 --> 00:01:18,250
Så HTML låter dig lägga ut sidor
strukturellt, och det gör att du kan

28
00:01:18,250 --> 00:01:22,410
slags estetiskt märka upp en sida,
markera statiskt innehåll, så att du

29
00:01:22,410 --> 00:01:23,640
kan sedan visa den med en webbläsare.

30
00:01:23,640 --> 00:01:24,690
>> Men det är nyckeln.

31
00:01:24,690 --> 00:01:26,130
Det är statiskt innehåll.

32
00:01:26,130 --> 00:01:28,590
Du skriver det, spara det,
och sedan skickas du det.

33
00:01:28,590 --> 00:01:31,130
Och webbservern fungerar sedan
det upp till besökarna.

34
00:01:31,130 --> 00:01:35,700
>> Men vi stilisera saker med hjälp av en annan
språk helt och hållet.

35
00:01:35,700 --> 00:01:40,150
Vi började använda en stil attribut
på vissa taggar.

36
00:01:40,150 --> 00:01:43,400
Och stilen attributet låt oss ställa
saker som teckenstorlek och färg.

37
00:01:43,400 --> 00:01:46,460
Och du har förmodligen börjat upptäcka,
eller du kommer snart att för final

38
00:01:46,460 --> 00:01:50,160
projekt potentiellt, men ändå andra
egenskaper som du kan använda i CSS.

39
00:01:50,160 --> 00:01:54,710
Och så i lekmannatermer, vad
egentligen då gör CSS göra?

40
00:01:54,710 --> 00:01:57,810
De är bara exempel därav.

41
00:01:57,810 --> 00:02:00,730
Vad innebär det att låta dig göra det HTML
verkar inte från vad

42
00:02:00,730 --> 00:02:02,606
vi har sett så här långt?

43
00:02:02,606 --> 00:02:04,850
>> PUBLIK: Definiera stilar själv.

44
00:02:04,850 --> 00:02:06,700
>> DAVID MALAN: Definiera stilar
själv.

45
00:02:06,700 --> 00:02:10,280
Så definiera saker som klasser som du
kan ha stött på, eller unikt

46
00:02:10,280 --> 00:02:13,800
identifiera noder i ett dokument så
att du kan stilisera dem.

47
00:02:13,800 --> 00:02:16,890
Men mer specifikt, skulle jag säga att CSS
verkligen gör att du kan ta saker i

48
00:02:16,890 --> 00:02:20,790
sista kilometern och låter dig ange mycket
mer exakt estetik,

49
00:02:20,790 --> 00:02:24,340
medan HTML för det mesta låter
du strukturera dina sidor.

50
00:02:24,340 --> 00:02:27,310
>> Och även om det finns vissa standardvärden,
som vi såg taggen för

51
00:02:27,310 --> 00:02:30,690
en rubrik tagg, vilket grovt sett
gjorde saker stora och djärva.

52
00:02:30,690 --> 00:02:34,250
Det är en ganska allmän definition
av taggen - stora och djärva.

53
00:02:34,250 --> 00:02:35,260
Vilken textstorlek är det?

54
00:02:35,260 --> 00:02:36,080
Vilken färg är det?

55
00:02:36,080 --> 00:02:36,890
Hur fet är det?

56
00:02:36,890 --> 00:02:39,830
Och CSS kan du mer fint
tune sånt.

57
00:02:39,830 --> 00:02:42,150
Förutom layout, som en del
av er har sett.

58
00:02:42,150 --> 00:02:45,180
>> Och ärligt talat, är CSS lite
av en rörig språk.

59
00:02:45,180 --> 00:02:48,370
Det är mycket kraftfull i att du kan göra
bokstavligen alla webbplatser som du har

60
00:02:48,370 --> 00:02:51,880
ses på webben i dag med det, men
det är typ av en smärta i nacken.

61
00:02:51,880 --> 00:02:54,440
Och en del av er har slagit i huvudet
mot väggarna redan bara för att göra

62
00:02:54,440 --> 00:02:58,560
något dumt som centrum en meny på
Problemet set sju om du har fått till

63
00:02:58,560 --> 00:02:59,470
den punkten redan.

64
00:02:59,470 --> 00:03:01,530
>> Men inse, dessa saker
bli lättare med tiden.

65
00:03:01,530 --> 00:03:02,820
Du börjar märka mönster.

66
00:03:02,820 --> 00:03:06,020
Och återigen, kommer Google att bli din vän
för de olika sätt på vilka du kan

67
00:03:06,020 --> 00:03:07,220
lösa dessa typer av problem.

68
00:03:07,220 --> 00:03:11,520
>> Och jag vågar säga med CSS och HTML mer
allmänhet, kan man lösa problem i

69
00:03:11,520 --> 00:03:15,910
många fler sätt, som alla kanske mycket
väl vara korrekt, än du kan

70
00:03:15,910 --> 00:03:18,900
i något som C, även
nu PHP eller Javascript.

71
00:03:18,900 --> 00:03:21,080
Det finns bara många olika
sätt att lägga ut saker.

72
00:03:21,080 --> 00:03:22,570
>> Men det började få
rörigt, sade vi.

73
00:03:22,570 --> 00:03:26,480
Bara slags sammanblandning din HTML och
din CSS med stil attribut var

74
00:03:26,480 --> 00:03:27,590
lite slarvig.

75
00:03:27,590 --> 00:03:31,460
Och så vi istället sagt, typ av
abstrakt sett, att du borde

76
00:03:31,460 --> 00:03:34,050
åtminstone börja faktor
ut din CSS förmodligen.

77
00:03:34,050 --> 00:03:37,430
Inte din stil attribut, men åtminstone
använder stil-taggen inuti vad

78
00:03:37,430 --> 00:03:38,840
del av webbsidan?

79
00:03:38,840 --> 00:03:39,560
>> PUBLIK: Head.

80
00:03:39,560 --> 00:03:40,120
>> DAVID MALAN: I huvudet.

81
00:03:40,120 --> 00:03:43,270
Fram till nu hade vi bara titeln upp
där, men du kan också lägga till en stil

82
00:03:43,270 --> 00:03:47,230
tagga, och du kan lägga din CSS grovt
talar mot toppen på sidan.

83
00:03:47,230 --> 00:03:52,550
Men sedan tog vi ett steg längre
och vi räknade ut det mer

84
00:03:52,550 --> 00:03:54,130
i en separat fil.

85
00:03:54,130 --> 00:03:57,240
>> Och så dessa två filer var
på något sätt nu länkade.

86
00:03:57,240 --> 00:03:59,550
Och faktiskt var det
tagg som gjorde det.

87
00:03:59,550 --> 00:04:02,920
Och vad som var ett av de övergripande
motiv för facto titt CSS

88
00:04:02,920 --> 00:04:04,057
desto mer?

89
00:04:04,057 --> 00:04:05,280
>> PUBLIK: Återanvändning.

90
00:04:05,280 --> 00:04:05,785
>> DAVID MALAN: Återanvändning.

91
00:04:05,785 --> 00:04:06,150
Rätt?

92
00:04:06,150 --> 00:04:09,470
Du kanske har sett i p-set redan sju
att en hel del av sidorna, de

93
00:04:09,470 --> 00:04:12,260
inköpssidan, säljsidan, den
portföljsida, troligen

94
00:04:12,260 --> 00:04:13,550
strukturerade något liknande sätt.

95
00:04:13,550 --> 00:04:17,579
Det finns en CS50 finans logotypen högst upp
om du inte har bestämt dig för att ändra det.

96
00:04:17,579 --> 00:04:19,839
Det finns en sidfot på
ner på sidorna.

97
00:04:19,839 --> 00:04:24,315
Och CSS kan du sedan faktor ut
den till en separat fil så att om

98
00:04:24,315 --> 00:04:27,780
du vill ändra något globalt
över hela din webbplats, kan du verkligen

99
00:04:27,780 --> 00:04:29,390
bara ändra på ett ställe.

100
00:04:29,390 --> 00:04:32,750
>> Men det finns ett pris som du betalar potentiellt
genom att ha vägts in

101
00:04:32,750 --> 00:04:38,380
CSS från min HTML-fil i en separat
fil referera den med den

102
00:04:38,380 --> 00:04:40,650
tag, som vi såg i måndags.

103
00:04:40,650 --> 00:04:43,850
Vad kan nackdelen vara på detta?

104
00:04:43,850 --> 00:04:48,830
När jag tänker tillbaka en vecka sedan att när vi är
talar om HTTP och TCP / IP och hur

105
00:04:48,830 --> 00:04:52,070
Internet fungerar.

106
00:04:52,070 --> 00:04:53,530
Något över här?

107
00:04:53,530 --> 00:04:54,730
>> PUBLIK: Det tar längre tid.

108
00:04:54,730 --> 00:04:55,470
>> DAVID MALAN: Det tar längre tid.

109
00:04:55,470 --> 00:04:56,750
Varför?

110
00:04:56,750 --> 00:04:59,450
>> PUBLIK: [OHÖRBAR].

111
00:04:59,450 --> 00:04:59,750
>> DAVID MALAN: Ja.

112
00:04:59,750 --> 00:05:01,240
Så det utan tvekan tar lite mer tid.

113
00:05:01,240 --> 00:05:04,290
Eftersom man är CSS uppenbart
inte i samma fil.

114
00:05:04,290 --> 00:05:06,920
Så nu har du att göra inte
en, men två ansökningar.

115
00:05:06,920 --> 00:05:11,230
Och var och en av dessa ansökningar som vi såg i
Chrome i den så kallade inspektör,

116
00:05:11,230 --> 00:05:15,740
och vi tittade på fliken nätverk, var och
av dessa filer kräver en HTTP

117
00:05:15,740 --> 00:05:18,360
begäran, som vi såg tar
viss tid.

118
00:05:18,360 --> 00:05:19,290
Nu, kanske är det inte mycket.

119
00:05:19,290 --> 00:05:20,670
Kanske är det bara 20 millisekunder.

120
00:05:20,670 --> 00:05:22,260
Det kanske är 200 millisekunder.

121
00:05:22,260 --> 00:05:25,530
>> Men tänk på en sida som Facebook,
eller CNN eller Google, som är mycket

122
00:05:25,530 --> 00:05:28,060
större än de exempel vi har
tittat på hittills.

123
00:05:28,060 --> 00:05:32,070
Dessa sidor kan ha massor av filer,
vilka var och en kan kräva en

124
00:05:32,070 --> 00:05:33,550
hämtning av en fil.

125
00:05:33,550 --> 00:05:35,800
Så saker kan potentiellt
börjar sakta ner.

126
00:05:35,800 --> 00:05:39,280
>> Och speciellt i dessa dagar när vi alla
har mobiltelefoner i våra fickor och

127
00:05:39,280 --> 00:05:43,010
långsammare internetuppkoppling, behöva
vänta ytterligare några millisekunder, några

128
00:05:43,010 --> 00:05:46,110
mer millisekunder för ytterligare
filer kan faktiskt vara långsam.

129
00:05:46,110 --> 00:05:50,430
Latens är det ord som beskriver
typ för att vänta på att du har att du

130
00:05:50,430 --> 00:05:53,110
upplever när väntar
någon upplysning.

131
00:05:53,110 --> 00:05:54,430
>> Men det finns en uppsida.

132
00:05:54,430 --> 00:05:56,600
Så det är inte all slags -

133
00:05:56,600 --> 00:05:58,170
det faktiskt är lite av en gungbräda här.

134
00:05:58,170 --> 00:06:02,970
Nackdelen nu, men vilka webbläsare kan göra
om de är smarta för att undvika

135
00:06:02,970 --> 00:06:08,870
behöva begära samma styles.css
filen igen kan vara att göra vad?

136
00:06:08,870 --> 00:06:09,390
>> Cache den.

137
00:06:09,390 --> 00:06:10,370
Så caching -

138
00:06:10,370 --> 00:06:11,690
C-A-C-H-E -

139
00:06:11,690 --> 00:06:15,810
innebär i allmänhet här bara för att spara
filen du begärde första gången, och

140
00:06:15,810 --> 00:06:17,440
sedan kontrollera din cache för det.

141
00:06:17,440 --> 00:06:20,400
Kontrollera att du är typ av lagringsbehållare,
och om du redan har en

142
00:06:20,400 --> 00:06:24,520
kopia av styles.css, även om någon annan
sida i p-set, eller någon hemsida,

143
00:06:24,520 --> 00:06:28,560
begär det igen, bara för att ge den
användare samma cachad kopia.

144
00:06:28,560 --> 00:06:30,140
Bry dig inte om att begära det.

145
00:06:30,140 --> 00:06:32,560
>> Nackdelen där, men som en del av er
har snubblade över i p-set.

146
00:06:32,560 --> 00:06:35,870
Om du gör en ändring på servern och
du går tillbaka till webbläsaren och du

147
00:06:35,870 --> 00:06:39,250
ladda om, ibland webbläsaren gör
dig en tjänst och inte bry

148
00:06:39,250 --> 00:06:43,660
åter hämtar din styles.css fil
eftersom, kom igen, vad är oddsen

149
00:06:43,660 --> 00:06:47,620
att dessa stilar som Facebook använder
kommer att förändras timme för timme eller

150
00:06:47,620 --> 00:06:48,140
dag till dag?

151
00:06:48,140 --> 00:06:48,800
Det är ganska lågt.

152
00:06:48,800 --> 00:06:52,260
De kan förändras över tiden, men inte
per minut eller per timme.

153
00:06:52,260 --> 00:06:55,810
>> Så ett trick, bara FYI när man gör webb
utveckling, ofta hålla ner

154
00:06:55,810 --> 00:06:59,500
skiftnyckel till exempel och sedan på
ladda i din webbläsare, och att viljan

155
00:06:59,500 --> 00:07:03,280
vanligtvis tala om för webbläsaren reload
allt, även om du redan har

156
00:07:03,280 --> 00:07:04,180
det i cachen.

157
00:07:04,180 --> 00:07:06,630
Så återigen, upsides och nackdelar,
men alla av dem

158
00:07:06,630 --> 00:07:08,260
slutligen utforma beslut.

159
00:07:08,260 --> 00:07:11,520
>> Så nu, gjorde vi inte bara
avslutar berättelsen här.

160
00:07:11,520 --> 00:07:15,790
Om jag nu går tillbaka och tillbaka och tillbaka och
tillbaka, började vi att presentera inte bara

161
00:07:15,790 --> 00:07:18,060
HTML, men PHP.

162
00:07:18,060 --> 00:07:20,786
Så i lekmannatermer, vad
gör PHP låt oss göra?

163
00:07:20,786 --> 00:07:22,770
>> PUBLIK: [OHÖRBAR].

164
00:07:22,770 --> 00:07:24,258
>> DAVID MALAN: Vad är det?

165
00:07:24,258 --> 00:07:25,250
>> PUBLIK: Införa logik
i koden.

166
00:07:25,250 --> 00:07:26,620
>> DAVID MALAN: Ja, införa
logik i koden.

167
00:07:26,620 --> 00:07:29,570
Så det är ett riktigt programmeringsspråk
med loopar och variabler och

168
00:07:29,570 --> 00:07:32,620
funktioner och villkor, samt alla
de saker som vi har använt vägen tillbaka

169
00:07:32,620 --> 00:07:33,780
när sedan scratch.

170
00:07:33,780 --> 00:07:36,780
Och PHP, vi har sett, kan användas
antingen på kommandoraden - det

171
00:07:36,780 --> 00:07:39,190
behöver inte ha något att göra
med webben, även om det är

172
00:07:39,190 --> 00:07:43,150
egentligen dess ursprung och vad det tenderar
vara bra på och bidrar till -

173
00:07:43,150 --> 00:07:47,130
men du kan använda PHP enbart av naturen
av det faktum att den har en print ()

174
00:07:47,130 --> 00:07:49,660
funktion, och en printf ()-funktionen,
eller ett eko ()-funktion.

175
00:07:49,660 --> 00:07:52,440
Det finns klasar sätt du
kan skriva ut text med PHP.

176
00:07:52,440 --> 00:07:56,540
>> Därför kan du använda denna programmering
språk till utgång exakt

177
00:07:56,540 --> 00:07:58,460
vad vi pratade om tidigare.

178
00:07:58,460 --> 00:08:01,360
Du kan dynamiskt generera
din HTML.

179
00:08:01,360 --> 00:08:02,300
Kanske inte alla av det.

180
00:08:02,300 --> 00:08:06,460
Kanske hårda kod saker, som den
sidhuvud och sidfot, och logotypen,

181
00:08:06,460 --> 00:08:07,950
och dina stilmallar,
och allt detta.

182
00:08:07,950 --> 00:08:11,190
Men för något som p-set sju,
där du manipulera lager och

183
00:08:11,190 --> 00:08:14,690
visar användarens portfölj, vilket är
kommer att dynamiskt förändra, du kan

184
00:08:14,690 --> 00:08:18,960
säkert använda PHP och logiken ger
du som programmeringsspråk för att

185
00:08:18,960 --> 00:08:22,320
utmatning dynamiskt delmängder
på sidan.

186
00:08:22,320 --> 00:08:25,900
>> Så när du talar om dynamiska webbplatser,
eller webbprogrammering, det är

187
00:08:25,900 --> 00:08:27,200
vad du egentligen pratar om.

188
00:08:27,200 --> 00:08:31,450
Med hjälp av ett språk som PHP, eller saker
heter Python eller Ruby, eller Java, eller

189
00:08:31,450 --> 00:08:35,900
ytterligare andra språk, för att fråga en databas
ofta, eller en annan server, och

190
00:08:35,900 --> 00:08:38,580
sedan dynamiskt spotta ut HTML.

191
00:08:38,580 --> 00:08:42,470
>> Nu slutresultatet, som en sidoreplik, är
som HTML på de flesta webbplatser,

192
00:08:42,470 --> 00:08:45,970
inklusive din p-set sju, är förmodligen
kommer att bli en stor oreda om

193
00:08:45,970 --> 00:08:48,060
man tittar på käll
kod i en webbläsare.

194
00:08:48,060 --> 00:08:49,010
Det är inte en stor sak.

195
00:08:49,010 --> 00:08:51,550
Vid denna punkt, när vi bryr oss om
stil, bryr vi oss om det

196
00:08:51,550 --> 00:08:52,740
saker som du skriver.

197
00:08:52,740 --> 00:08:56,240
Vi kommer inte att bry sig om saker
att det som din kod utgångar.

198
00:08:56,240 --> 00:08:59,520
Så oroa dig inte om indrag
här om det är PHP som är

199
00:08:59,520 --> 00:09:01,190
faktiskt mata grejer.

200
00:09:01,190 --> 00:09:04,430
När allt kommer webbläsaren inte vård,
och en human inte kommer att leta

201
00:09:04,430 --> 00:09:05,400
vid källan ändå.

202
00:09:05,400 --> 00:09:09,000
Vi personalen, till exempel, skulle
att titta på din PHP.

203
00:09:09,000 --> 00:09:13,440
>> Så låt mig ge ett snabbt exempel nu
varför annars detta kan vara användbart.

204
00:09:13,440 --> 00:09:18,620
Så ärligt talat, jag kan inte minnas den senaste
gången jag använde C för att lösa ett problem i

205
00:09:18,620 --> 00:09:19,620
den verkliga världen.

206
00:09:19,620 --> 00:09:22,330
Det var nog i forskarskolan vid
Jag behövde för att använda ett språk som

207
00:09:22,330 --> 00:09:26,710
var ganska låg nivå och gav mig
möjlighet att göra något mycket hög

208
00:09:26,710 --> 00:09:30,720
utföra för att verkligen rädda så många CPU
cykler som jag kunde, till stor del

209
00:09:30,720 --> 00:09:33,990
eftersom jag använde enorma datamängder,
och varje CPU-cykel räknades.

210
00:09:33,990 --> 00:09:37,750
Och ärligt talat, även i saker som telefoner
dessa dagar och andra enheter

211
00:09:37,750 --> 00:09:39,910
där du inte riktigt har så mycket
minne och du inte riktigt har så

212
00:09:39,910 --> 00:09:44,160
mycket CPU, med hjälp av snabbare språk
fortfarande är tilltalande.

213
00:09:44,160 --> 00:09:47,290
>> Men i den verkliga världen, när du bara
vill kasta något program tillsammans med

214
00:09:47,290 --> 00:09:50,340
analysera några data eller du har samlat
en hel massa registreringar för

215
00:09:50,340 --> 00:09:53,330
några studentgruppen och vill mycket
snabbt automatisera skicka e-post

216
00:09:53,330 --> 00:09:56,240
en efter en till var och en av dem
registranter, du kommer att nå för

217
00:09:56,240 --> 00:09:59,240
en högre nivå språk
än C så att säga.

218
00:09:59,240 --> 00:10:04,060
Något som PHP eller Python eller Ruby,
eller ett halvt dussin andra som finns

219
00:10:04,060 --> 00:10:04,550
dessa dagar.

220
00:10:04,550 --> 00:10:07,200
Men de tre är nog
den mest trendiga just nu.

221
00:10:07,200 --> 00:10:10,840
>> Och vad detta innebär är att du kan öppna
upp en textredigerare som gedit eller

222
00:10:10,840 --> 00:10:14,030
mest något annat och sedan bara börja
skriva kod utan att behöva oroa

223
00:10:14,030 --> 00:10:17,800
om att sammanställa, utan att behöva
verkligen oroa minneshantering,

224
00:10:17,800 --> 00:10:20,820
tanke om att lite
slarv kommer så småningom komma tillbaka

225
00:10:20,820 --> 00:10:24,790
bita dig om datamängden blir
större eller problemet blir stora.

226
00:10:24,790 --> 00:10:27,230
Men vad detta innebär för
oss är följande.

227
00:10:27,230 --> 00:10:29,860
>> Låt mig gå vidare och köra stavnings
från problem set sex.

228
00:10:29,860 --> 00:10:33,480
Så det här är min trie-baserad implementering
som jag använde på den stora

229
00:10:33,480 --> 00:10:35,500
styrelse där jag utförde inte så bra.

230
00:10:35,500 --> 00:10:38,720
Vi kommer tillbaka i en veckas tid och
se över de som fick sluta på toppen av

231
00:10:38,720 --> 00:10:40,430
stor ombord på vår sista föreläsning.

232
00:10:40,430 --> 00:10:44,520
Men för nu, låt mig gå vidare och bara
kör min lösning i text, så gör vi

233
00:10:44,520 --> 00:10:48,460
King James Bible, och nu kör vi.

234
00:10:48,460 --> 00:10:51,080
>> Så de är alla de förment
felstavade ord av

235
00:10:51,080 --> 00:10:52,240
King James Bible.

236
00:10:52,240 --> 00:10:55,560
Och min genomförandet tog
halv sekund totalt.

237
00:10:55,560 --> 00:10:58,270
Så inte alltför illa om detta
dator.

238
00:10:58,270 --> 00:11:01,540
Men tänk på hur mycket
kod jag var tvungen att skriva.

239
00:11:01,540 --> 00:11:02,880
Tänk hur mycket kod som du var tvungen att skriva.

240
00:11:02,880 --> 00:11:06,170
Tänk hur många timmar du spenderat i
D-hallen eller din studentrummet eller var

241
00:11:06,170 --> 00:11:07,890
faktiskt koda upp den lösningen.

242
00:11:07,890 --> 00:11:11,850
>> Tja, om jag faktiskt har en högre nivå
språk som PHP, ta del av

243
00:11:11,850 --> 00:11:13,350
vad jag kan göra här.

244
00:11:13,350 --> 00:11:16,410
Först antar att detta är i stället
din distribution kod.

245
00:11:16,410 --> 00:11:17,790
Det här är en fil som heter stava.

246
00:11:17,790 --> 00:11:20,220
Det är tillgängligt som en del av dagens
fördelning kod.

247
00:11:20,220 --> 00:11:22,670
Och jag ska vinka min hand på de flesta
av detaljerna, men det är faktiskt

248
00:11:22,670 --> 00:11:25,500
ett intressant exempel på hur
du kanske port ett språk

249
00:11:25,500 --> 00:11:28,870
som C över till PHP.

250
00:11:28,870 --> 00:11:33,420
Jag bokstavligen öppnat två textfönster,
en med min C-versionen av speller.c,

251
00:11:33,420 --> 00:11:36,960
och jag har precis börjat att översätta den i min
bege dig till PHP och skriva ut det med hjälp av

252
00:11:36,960 --> 00:11:38,840
de närmaste likvärdiga funktioner.

253
00:11:38,840 --> 00:11:40,100
>> Så en del av dessa saker är annorlunda.

254
00:11:40,100 --> 00:11:43,730
Vi såg förra gången att PHP inte använder
inkludera på riktigt samma sätt.

255
00:11:43,730 --> 00:11:47,050
Den använder kräver normalt, även om
inkluderar existerar.

256
00:11:47,050 --> 00:11:50,330
Define är lite annorlunda från
# Define i C, men det är

257
00:11:50,330 --> 00:11:51,890
hur vi gör en konstant.

258
00:11:51,890 --> 00:11:55,860
$ Argc det visar sig förekommer i PHP,
så vi har sett det förut.

259
00:11:55,860 --> 00:11:58,650
Dessa är bara variabler, allt från
som börjar med dollartecken.

260
00:11:58,650 --> 00:12:00,590
Minns dessa är bara ett gäng
flytande punkter.

261
00:12:00,590 --> 00:12:03,970
>> Så lång historia kort, är du välkommen att
bläddra igenom detta om nyfiken, är detta

262
00:12:03,970 --> 00:12:10,010
nästan en omvandling av linjen-för-line
C-versionen av speller.c i PHP.

263
00:12:10,010 --> 00:12:12,630
Och du kan göra det här igen för
ett halvt dussin andra språk.

264
00:12:12,630 --> 00:12:14,910
>> Men det som är intressant är det här.

265
00:12:14,910 --> 00:12:16,910
Eller vad är uppriktigt sagt nedslående
är detta.

266
00:12:16,910 --> 00:12:20,790
Låt mig gå vidare och skriva om
dictionary.php, och hävdar att jag är

267
00:12:20,790 --> 00:12:23,670
kommer att gå vidare och åter genomföra
Problemet set sex här.

268
00:12:23,670 --> 00:12:27,530
>> Så låt oss föreslå först att i detta
fil, som kommer att genomföras i

269
00:12:27,530 --> 00:12:30,550
PHP, så låt mig öppna mina tags som.

270
00:12:30,550 --> 00:12:34,780
Låt mig ge mig själv en global
variabel, $ storleken blir noll.

271
00:12:34,780 --> 00:12:36,710
Och jag ska ge
själv en hash-tabell.

272
00:12:36,710 --> 00:12:38,110
Jag använder en hashtabell för denna sak.

273
00:12:38,110 --> 00:12:42,070
Hur förklarar jag en hashtabell i PHP?

274
00:12:42,070 --> 00:12:42,990
Klar.

275
00:12:42,990 --> 00:12:43,980
OK.

276
00:12:43,980 --> 00:12:48,870
>> Så öppna fäste nära fästet representerar
vad i PHP, som vi har sett?

277
00:12:48,870 --> 00:12:51,850
En matris, men en array som skulle kunna
vara en associativ array.

278
00:12:51,850 --> 00:12:54,320
En associativ array är
en datastruktur som

279
00:12:54,320 --> 00:12:55,860
associerar nycklar med värden.

280
00:12:55,860 --> 00:12:59,430
>> Nu på enklast numeriskt indexerad
samling, dessa nycklar är vad?

281
00:12:59,430 --> 00:13:02,250

282
00:13:02,250 --> 00:13:03,960
Noll, ett, två, tre, eller hur?

283
00:13:03,960 --> 00:13:08,780
Old school grejer tillbaka från C. Men det kan
också vara strängar som foo, och bar,

284
00:13:08,780 --> 00:13:12,210
eller Maxwell, eller någon sådan sträng.

285
00:13:12,210 --> 00:13:14,240
Så jag kan utnyttja det
på bara ett ögonblick.

286
00:13:14,240 --> 00:13:17,550
>> Låt mig gå vidare och förklara
en funktion som -

287
00:13:17,550 --> 00:13:19,020
låt oss göra load () först.

288
00:13:19,020 --> 00:13:20,690
Så fungerar load ().

289
00:13:20,690 --> 00:13:23,440
Och PHP är lite annorlunda i det
du bokstavligen skriver funktion, men du

290
00:13:23,440 --> 00:13:24,930
skriv inte en returtyp.

291
00:13:24,930 --> 00:13:28,760
Jag kommer att gå vidare och säga att
lastfunktion () bör ta i

292
00:13:28,760 --> 00:13:31,000
Argumentet $ ordbok, precis
som C-versionen gjorde.

293
00:13:31,000 --> 00:13:32,510
Jag gör det från minnet.

294
00:13:32,510 --> 00:13:34,910
>> Och jag föreslår att jag är
kommer att göra detta.

295
00:13:34,910 --> 00:13:37,080
Jag är helt enkelt ska göra foreach.

296
00:13:37,080 --> 00:13:40,710
Jag ska ringa en funktion som kallas
fil (), som går i namn av att

297
00:13:40,710 --> 00:13:44,990
fil, vilket är den rörliga
$ Ordlistan som $ ord.

298
00:13:44,990 --> 00:13:49,410
Och sedan insidan av min för loop här, jag är
kommer att gå vidare och lagra i min

299
00:13:49,410 --> 00:13:57,440
$ Tabell som $ ord blir sann.

300
00:13:57,440 --> 00:13:57,918
Klar.

301
00:13:57,918 --> 00:14:01,264
Vänta.

302
00:14:01,264 --> 00:14:02,422
Klar.

303
00:14:02,422 --> 00:14:02,760
OK.

304
00:14:02,760 --> 00:14:04,970
>> Det är lasten ()-funktionen
säger i PHP.

305
00:14:04,970 --> 00:14:05,865
Nu, varför det fungerar?

306
00:14:05,865 --> 00:14:07,010
Och jag typ av fusk här.

307
00:14:07,010 --> 00:14:09,980
>> Så, en, foreach vi såg
kort förra gången.

308
00:14:09,980 --> 00:14:13,680
Det betyder bara att du kan iterera över
en array utan att bry sig med i

309
00:14:13,680 --> 00:14:16,150
och n och plus plus, och allt detta.

310
00:14:16,150 --> 00:14:21,350
Dictionary är naturligtvis filnamnet,
ungefär så stora som små, det två

311
00:14:21,350 --> 00:14:22,830
ordböcker som vi använde förra gången.

312
00:14:22,830 --> 00:14:26,715
Filen är en funktion som öppnar upp text
fil, läser den i rad för rad, och

313
00:14:26,715 --> 00:14:29,840
händer dig tillbaka ett stort utbud,
var och en av vars element är en

314
00:14:29,840 --> 00:14:31,340
linje från den filen.

315
00:14:31,340 --> 00:14:36,040
Så det är en kombination av fopen, och
fread och while-slinga, och fclose,

316
00:14:36,040 --> 00:14:37,080
och allt detta.

317
00:14:37,080 --> 00:14:40,150
Slutligen, som ordet betyder bara att det är den
variabel jag ska ha tillgång till

318
00:14:40,150 --> 00:14:41,890
på varje iteration i denna slinga.

319
00:14:41,890 --> 00:14:46,910
>> Så kort sagt, denna liner här betyder
öppna filen vars namn är i

320
00:14:46,910 --> 00:14:50,750
ordbok, variabeln, iterera över
den rad för rad, och varje gång du får

321
00:14:50,750 --> 00:14:54,290
en linje, lagra i en variabel som kallas ord,
och sedan göra något med ord.

322
00:14:54,290 --> 00:14:55,280
Vad vill jag göra?

323
00:14:55,280 --> 00:14:58,110
Jag vill sätta ord i min hash-tabell.

324
00:14:58,110 --> 00:15:00,860
>> Tja, kan jag sätta något i min
hash tabellen precis som i C

325
00:15:00,860 --> 00:15:02,140
med hjälp av hakparenteser.

326
00:15:02,140 --> 00:15:03,660
Detta är namnet på min hash-tabell.

327
00:15:03,660 --> 00:15:07,180
Jag ska till index in i den hash
bord på den här platsen.

328
00:15:07,180 --> 00:15:08,920
Så inte bracket noll, inte fästet ett.

329
00:15:08,920 --> 00:15:11,990
Konsol quote unquote något,
oavsett vad det ordet är.

330
00:15:11,990 --> 00:15:15,200
Och precis som du kan ha i din
hashtabell arbete trie, du bara lagra

331
00:15:15,200 --> 00:15:17,650
effektivt en Boolean, implicit
eller explicit.

332
00:15:17,650 --> 00:15:18,260
Klar.

333
00:15:18,260 --> 00:15:20,000
Jag lagrar värdet true.

334
00:15:20,000 --> 00:15:23,150
>> Nu finns det ett par saker
Jag slarva på här.

335
00:15:23,150 --> 00:15:27,720
Tekniskt sett är det att bli en
irriterande ny linje, / n, vid slutet av

336
00:15:27,720 --> 00:15:28,820
vart och ett av dessa ord.

337
00:15:28,820 --> 00:15:31,770
Så jag ska nog ringa en PHP funktion
kallas chop (), vilket kommer att

338
00:15:31,770 --> 00:15:33,460
bokstavligen hugga av det där.

339
00:15:33,460 --> 00:15:35,020
Och jag faktiskt behöver
göra en annan sak.

340
00:15:35,020 --> 00:15:38,380
Jag borde nog öka storleken på varje
iteration, så jag håller koll

341
00:15:38,380 --> 00:15:39,560
globalt för vad det är.

342
00:15:39,560 --> 00:15:43,180
Och ärligt talat, och detta är en av de
stupider aspekter av PHP, om du är

343
00:15:43,180 --> 00:15:46,950
med hjälp av en global variabel, måste du
uttryckligen säger att du är.

344
00:15:46,950 --> 00:15:51,670
Så jag ska faktiskt skriva i den globala
$ Storlek, global $ bord, och nu

345
00:15:51,670 --> 00:15:52,690
min funktion är klar.

346
00:15:52,690 --> 00:15:57,475
>> Så inte riktigt så enkelt som tidigare, men
antagligen tog mindre tid än C

347
00:15:57,475 --> 00:15:58,220
version, kanske?

348
00:15:58,220 --> 00:15:58,730
OK.

349
00:15:58,730 --> 00:16:00,390
>> Så nu ska vi göra funktionskontrollen ().

350
00:16:00,390 --> 00:16:04,300
Låt oss se om det åtminstone tog
timmar i sträck som det tog oss i C. So

351
00:16:04,300 --> 00:16:06,500
Låt mig gå vidare och förklara
kontrollera som en funktion.

352
00:16:06,500 --> 00:16:09,070
Tar i argumentet ord, vilket är
kommer att komma från stavningskontroll.

353
00:16:09,070 --> 00:16:13,410
Och jag ska bara kolla om det
följande variabel isset, bord

354
00:16:13,410 --> 00:16:18,400
fäste strtolower av ord -

355
00:16:18,400 --> 00:16:20,590
låt oss balansera alla mina parenteser -

356
00:16:20,590 --> 00:16:24,275
sedan återvända sant.

357
00:16:24,275 --> 00:16:27,020

358
00:16:27,020 --> 00:16:28,460
Else -

359
00:16:28,460 --> 00:16:30,330
det var verkligen det hårda
del av detta program.

360
00:16:30,330 --> 00:16:31,940
Else, returnera false.

361
00:16:31,940 --> 00:16:32,630
Klar.

362
00:16:32,630 --> 00:16:33,460
Det är check ().

363
00:16:33,460 --> 00:16:34,520
>> Nu, varför detta arbete?

364
00:16:34,520 --> 00:16:37,040
Tja, som jag passerade i ett ord,
vilket är en sträng.

365
00:16:37,040 --> 00:16:41,400
Två, Jag kollar insidan av hash
bord, som kallas $ bord.

366
00:16:41,400 --> 00:16:45,470
Jag tvingar den till gemener genom att ringa
en funktion ganska lika tolower () i

367
00:16:45,470 --> 00:16:48,580
C, men det gör hela ordet,
inte ett enda tecken.

368
00:16:48,580 --> 00:16:52,680
Och om det är inställt, med andra ord finns det
är ett värde som är inställt, med andra ord,

369
00:16:52,680 --> 00:16:54,880
om det är sant, så ja,
detta är ett ord.

370
00:16:54,880 --> 00:16:56,530
Eftersom jag lagt det där med last ().

371
00:16:56,530 --> 00:16:59,100
Och om inte, kommer jag att returnera false.

372
00:16:59,100 --> 00:17:00,090
>> Nu de andra är lätt.

373
00:17:00,090 --> 00:17:03,570
Funktion storlek (), hur gör jag detta?

374
00:17:03,570 --> 00:17:05,230
Jag gör allt väsentligt åter $ storlek.

375
00:17:05,230 --> 00:17:07,770
Men jag behöver tekniskt att
göra detta irriterande sak.

376
00:17:07,770 --> 00:17:10,640
Och faktiskt upp höra, jag skär
ett hörn för många.

377
00:17:10,640 --> 00:17:12,920
Jag måste verkligen göra global $ bord.

378
00:17:12,920 --> 00:17:16,260
>> Men som sagt, lossa).

379
00:17:16,260 --> 00:17:17,380
Lasta () är häpnadsväckande.

380
00:17:17,380 --> 00:17:20,500
Funktion unload ().

381
00:17:20,500 --> 00:17:23,990
Hur jag vill genomföra unload ()?

382
00:17:23,990 --> 00:17:25,079
Klar.

383
00:17:25,079 --> 00:17:25,450
OK.

384
00:17:25,450 --> 00:17:28,900
>> Så lossa (), är minneshantering
helt tagit hand om för dig i

385
00:17:28,900 --> 00:17:31,800
något som PHP och en hel del
högre nivå språk.

386
00:17:31,800 --> 00:17:32,600
Så det här är fantastiskt.

387
00:17:32,600 --> 00:17:36,080
Liksom varför i helvete har vi spenderat det förflutna
åtta plus veckor på C skrift

388
00:17:36,080 --> 00:17:41,030
tydligen riktigt långsam, riktigt tid
konsumerar problem med tiotals timmar

389
00:17:41,030 --> 00:17:42,530
av arbeta under våra bälten?

390
00:17:42,530 --> 00:17:46,110
>> Tja, för en sak, detta kan fungera
bra för små program.

391
00:17:46,110 --> 00:17:47,840
Den rusade verkligen upp min
utvecklingstid.

392
00:17:47,840 --> 00:17:49,790
Men låt oss se vad som händer
i den verkliga världen.

393
00:17:49,790 --> 00:17:52,370
>> Låt mig gå in i den här katalogen
i ett terminalfönster.

394
00:17:52,370 --> 00:17:53,370
Det finns stavningskontroll.

395
00:17:53,370 --> 00:17:56,570
Och märker som en åt sidan, och du kanske
har stött på detta i problembild

396
00:17:56,570 --> 00:17:58,190
sex eller problem set sju.

397
00:17:58,190 --> 00:18:01,610
Du behöver inte strikt behöver
avslutar PHP-filer med. php.

398
00:18:01,610 --> 00:18:05,250
Om du lägger en rad som den första på
högst upp, det är en speciell linje

399
00:18:05,250 --> 00:18:10,980
av syntax som i huvudsak innebär att hitta
det program som kallas PHP och använda den för att

400
00:18:10,980 --> 00:18:12,270
tolka denna fil.

401
00:18:12,270 --> 00:18:15,410
Så nu ingen vet riktigt att
Jag kör ett PHP-program.

402
00:18:15,410 --> 00:18:19,860
Jag kan köra det precis som om det
var något som sammanställts i C.

403
00:18:19,860 --> 00:18:20,650
>> Men här är det.

404
00:18:20,650 --> 00:18:21,600
Faktiskt, låt oss göra det här igen.

405
00:18:21,600 --> 00:18:23,530
Dropbox/pset6 /.

406
00:18:23,530 --> 00:18:25,390
Det finns stavningskontroll.

407
00:18:25,390 --> 00:18:26,720
OK, 0,44 sekunder.

408
00:18:26,720 --> 00:18:28,080
Det fick fortare denna gång.

409
00:18:28,080 --> 00:18:29,745
>> Nu går vi in ​​i PHP-version.

410
00:18:29,745 --> 00:18:43,070

411
00:18:43,070 --> 00:18:44,320
Fin touch.

412
00:18:44,320 --> 00:18:50,830

413
00:18:50,830 --> 00:18:53,285
Men tänk hur mycket tid
Jag sparade på kontorstid.

414
00:18:53,285 --> 00:18:56,990

415
00:18:56,990 --> 00:18:57,790
OK.

416
00:18:57,790 --> 00:19:01,020
>> Så 3,59 sekunder, som faktiskt
låter inte korrekt heller.

417
00:19:01,020 --> 00:19:03,710
Men det beror på lång historia kort,
när du skriver ut en stor mängd

418
00:19:03,710 --> 00:19:06,840
saker till skärmen, som
själv saktar ner saker.

419
00:19:06,840 --> 00:19:11,260
Vad det verkligen tog processorn i
apparaten var 3,59 sekunder, i

420
00:19:11,260 --> 00:19:15,260
kontrast till C, som tog 0,44
sekunder senast.

421
00:19:15,260 --> 00:19:17,620
Det är verkligen en order av
magnitud annorlunda.

422
00:19:17,620 --> 00:19:20,280
>> Så var är det pris som kommer från?

423
00:19:20,280 --> 00:19:21,790
Varför är det så mycket långsammare?

424
00:19:21,790 --> 00:19:24,220
Varför PHP gå så dåligt?

425
00:19:24,220 --> 00:19:25,242
Danielle?

426
00:19:25,242 --> 00:19:26,550
>> PUBLIK: Du gjorde inte riktigt
använda en hash-tabell.

427
00:19:26,550 --> 00:19:27,710
>> DAVID MALAN: Jag gjorde inte riktigt
använda en hash-tabell.

428
00:19:27,710 --> 00:19:28,760
Så jag gjorde typ av.

429
00:19:28,760 --> 00:19:29,870
Så det är en associativ array.

430
00:19:29,870 --> 00:19:33,650
Troligtvis, om folket på PHP är
riktigt smart, använde de under

431
00:19:33,650 --> 00:19:39,520
huv en faktisk hashtabell implementeras
i något som C eller C + +.

432
00:19:39,520 --> 00:19:41,290
Men.

433
00:19:41,290 --> 00:19:42,760
Yeah.

434
00:19:42,760 --> 00:19:44,010
>> PUBLIK: [OHÖRBAR].

435
00:19:44,010 --> 00:19:46,690

436
00:19:46,690 --> 00:19:47,080
>> DAVID MALAN: Ja.

437
00:19:47,080 --> 00:19:50,780
Så var och en av de funktioner som jag skrev nu -
faktiskt, kan du säga det en gång till en

438
00:19:50,780 --> 00:19:51,480
lite högre?

439
00:19:51,480 --> 00:19:54,509
>> Publik: Var och en av de funktioner som
Du ingår har mycket mer fullständig

440
00:19:54,509 --> 00:19:56,610
kapacitet än -

441
00:19:56,610 --> 00:19:57,550
>> DAVID MALAN: Så det är väldigt sant.

442
00:19:57,550 --> 00:20:01,490
Det finns mycket mer overhead att vi är
inte riktigt ser genom att fokusera endast på

443
00:20:01,490 --> 00:20:03,730
dictionary.php, som jag skrev bara.

444
00:20:03,730 --> 00:20:08,020
Däremot finns det en hel tolk
gå i bakgrunden.

445
00:20:08,020 --> 00:20:12,040
Det är när jag körde det här programmet, det
inte köra kompilerade nollor och ettor

446
00:20:12,040 --> 00:20:14,290
konstruerad för min Intel CPU.

447
00:20:14,290 --> 00:20:19,270
Snarare var det igång rad för rad
PHP-kod som ser ut exakt

448
00:20:19,270 --> 00:20:20,350
som vi skrev det.

449
00:20:20,350 --> 00:20:22,475
Och så när du använder en
tolkat språk, du

450
00:20:22,475 --> 00:20:23,850
faktiskt betalar detta pris.

451
00:20:23,850 --> 00:20:27,010
Det kommer att ta lite tid att läsa
filen uppifrån och ner, vänster till

452
00:20:27,010 --> 00:20:30,740
höger, och sedan köra varje
linje om och om igen.

453
00:20:30,740 --> 00:20:34,250
>> Nu i verkligheten, särskilt på nätet,
du kan faktiskt påskynda denna process

454
00:20:34,250 --> 00:20:38,660
genom caching resultaten av
PHP-kod tolkas.

455
00:20:38,660 --> 00:20:41,640
Och det är vettigt på webben, eftersom
om du inte har en användare som

456
00:20:41,640 --> 00:20:46,300
mig här, men 1.000 eller 10.000 användare, då
kanske första gången filen är

457
00:20:46,300 --> 00:20:49,050
nås den är långsam, men därefter
det är mycket snabbare.

458
00:20:49,050 --> 00:20:51,000
>> Men detta också, återigen, är en avvägning.

459
00:20:51,000 --> 00:20:53,870
Och för något som liknar en forskningsuppgifter
in, eller ens något stort som

460
00:20:53,870 --> 00:20:58,330
detta, användarna kommer så småningom
börjar känna att avmattningen.

461
00:20:58,330 --> 00:21:02,670
>> Så kort sagt, tolkade språk
mycket i ropet, mycket populär, och

462
00:21:02,670 --> 00:21:06,710
ärligt talat är nog de språk du
bör nå för vid problemlösning

463
00:21:06,710 --> 00:21:08,200
efter CS50.

464
00:21:08,200 --> 00:21:12,720
Men inse hur mycket du verkligen
tar för givet under huven

465
00:21:12,720 --> 00:21:15,910
egentligen de senaste veckorna i hash
tabeller och träd och försöker,

466
00:21:15,910 --> 00:21:20,770
vilka används i sista hand för att verkligen
genomföra saker som öppet fäste,

467
00:21:20,770 --> 00:21:24,200
hakparentes, som vi nu kan
tacksamt tar för givet.

468
00:21:24,200 --> 00:21:26,360
>> Så låt oss ta en titt nu
i denna webb-sammanhang.

469
00:21:26,360 --> 00:21:29,890
Och jag nämnde förra gången att det finns
ett gäng superglobals i PHP som

470
00:21:29,890 --> 00:21:32,490
är inte riktigt relevant
på kommandoraden.

471
00:21:32,490 --> 00:21:36,210
De är mer relevant i sammanhanget
med att använda PHP i webbsammanhang.

472
00:21:36,210 --> 00:21:41,220
Så kör PHP på en webbserver för
att skapa saker som HTML.

473
00:21:41,220 --> 00:21:44,540
>> Och vi tittade på $ _GET och $ _POST, och
det är där automatiskt användarnas

474
00:21:44,540 --> 00:21:49,100
input hamnar helt enkelt om du skickar in en
forma till en fil som slutar på. php på en webbsida

475
00:21:49,100 --> 00:21:50,460
server som apparaten.

476
00:21:50,460 --> 00:21:53,310
Men låt oss titta kort på
$ _COOKIE Och $ _SESSION.

477
00:21:53,310 --> 00:21:56,670
>> I lekmannaspråk, vad är en cookie som
du förstår det i samband med

478
00:21:56,670 --> 00:21:58,220
använda webben?

479
00:21:58,220 --> 00:21:59,450
>> PUBLIK: Fil på datorn.

480
00:21:59,450 --> 00:21:59,920
>> DAVID MALAN: Ja.

481
00:21:59,920 --> 00:22:03,500
Det är en fil på användarens dator
planterades av vad webbplatsen

482
00:22:03,500 --> 00:22:04,410
du råkar besöka.

483
00:22:04,410 --> 00:22:07,334
Så när du går till Facebook, när du går
till bankofamerica.com, när du går

484
00:22:07,334 --> 00:22:10,330
till google.com, när du går till nästan alla
webbplats i världen dessa dagar,

485
00:22:10,330 --> 00:22:14,850
inklusive cs50.net, är en cookie planterad
på din dator, vilket är

486
00:22:14,850 --> 00:22:19,800
antingen ett värde som lagras i RAM i
dator i webbläsarens minne, eller

487
00:22:19,800 --> 00:22:22,800
ibland verkligen en fil som lagras
på din hårddisk.

488
00:22:22,800 --> 00:22:26,960
>> Och vad är normalt lagrad i den filen
är inte ditt användarnamn, inte din

489
00:22:26,960 --> 00:22:31,060
lösenord, vanligtvis inte något
känsligt om webbplatsen är inte så

490
00:22:31,060 --> 00:22:35,040
bra med deras säkerhet, utan snarare
det är en stor unik identifierare bland

491
00:22:35,040 --> 00:22:35,680
andra saker.

492
00:22:35,680 --> 00:22:38,920
Det är ett stort slumptal planterade på din
dator men du kan tänka på som

493
00:22:38,920 --> 00:22:42,740
typ av en virtuell handstämpel liknande från
en klubb eller någon nöjespark som

494
00:22:42,740 --> 00:22:47,160
gör det möjligt för personalen, ägarna av det
tjänsten, för att komma ihåg vem du är.

495
00:22:47,160 --> 00:22:51,030
Så om det stora slumptalet är som
12345678, även om det är uppenbart

496
00:22:51,030 --> 00:22:54,180
inte alltför slumpmässigt, tänker på det som
handen stämpel som när du besöker

497
00:22:54,180 --> 00:22:57,930
facebook.com för första gången, de
stämpla det numret på din hand.

498
00:22:57,930 --> 00:23:01,510
Och sedan att du talar HTTP, du
vara en webbläsare, och eftersom Facebook

499
00:23:01,510 --> 00:23:06,440
uppenbarligen talar samma som en webbsida
server, säger protokollet HTTP att

500
00:23:06,440 --> 00:23:09,930
när du sedan besöka
facebook.com, oavsett om det är en sekund

501
00:23:09,930 --> 00:23:13,560
senare, en timme senare, även nästa dag,
så länge du har inte uttryckligen

502
00:23:13,560 --> 00:23:17,050
loggat ut, som effektivt
är som att tvätta händerna.

503
00:23:17,050 --> 00:23:20,280
HTTP säger att du ska presentera din
handen stämpel varje gång du

504
00:23:20,280 --> 00:23:22,020
återgå till den webbplatsen.

505
00:23:22,020 --> 00:23:24,390
>> Vad Facebook då gör är att de
titta på den handen stämpel och

506
00:23:24,390 --> 00:23:26,850
de säger, åh, 123456789.

507
00:23:26,850 --> 00:23:30,260
Jag vet inte vid första anblicken att detta
är David Malan i Cambridge,

508
00:23:30,260 --> 00:23:34,690
Massachusetts, men de kan kontrollera sina
databas och säger, åh, den person

509
00:23:34,690 --> 00:23:39,930
på vars dator vi planterade 123456789
är David Malan från Cambridge,

510
00:23:39,930 --> 00:23:40,440
Massachusetts.

511
00:23:40,440 --> 00:23:46,000
Låt oss visa att användaren sedan hans profil
sida eller hans News Feed.

512
00:23:46,000 --> 00:23:49,660
>> Men det finns ett problem här om detta
är hur webben verkligen fungerar.

513
00:23:49,660 --> 00:23:51,390
Låt oss ta en titt på ett snabbt exempel.

514
00:23:51,390 --> 00:23:55,190
Låt oss faktiskt gå att säga facebook.com.

515
00:23:55,190 --> 00:23:58,130
Men innan vi kunde åka dit, låt
mig gå vidare och öppna upp Chrome

516
00:23:58,130 --> 00:23:59,790
Inspector här nere.

517
00:23:59,790 --> 00:24:01,140
Låt mig titta på fliken Nätverk.

518
00:24:01,140 --> 00:24:06,020
Och nu ska vi gå vidare och skriva
i https://facebook.com.

519
00:24:06,020 --> 00:24:09,410
Och jag gör det så att vi inte ser
alla dessa omdirigeringar och avfall

520
00:24:09,410 --> 00:24:10,660
tid att titta igenom dem.

521
00:24:10,660 --> 00:24:12,690
Låt mig slå in.

522
00:24:12,690 --> 00:24:13,130
>> Okej.

523
00:24:13,130 --> 00:24:14,580
Vi ser en massa förfrågningar.

524
00:24:14,580 --> 00:24:15,640
Det kommer Facebook.

525
00:24:15,640 --> 00:24:16,930
Det finns en hel massa filer.

526
00:24:16,930 --> 00:24:19,290
Och här, per min omnämnande av
latens förra gången, det är

527
00:24:19,290 --> 00:24:21,240
många HTTP-förfrågningar.

528
00:24:21,240 --> 00:24:23,700
Men den första är förmodligen
de mest intressanta.

529
00:24:23,700 --> 00:24:26,420
>> Så låt oss rulla ner hit, och
Jag ska zooma in på en sekund.

530
00:24:26,420 --> 00:24:29,090
Detta kommer att vara typ av
en enda röra, men låt oss se.

531
00:24:29,090 --> 00:24:31,660
Facebook skickar oss en
massa grejer.

532
00:24:31,660 --> 00:24:33,490
>> Men whoa, intressant.

533
00:24:33,490 --> 00:24:37,880
De planterar inte en, utan fyra
begagnade frimärken på min hand här.

534
00:24:37,880 --> 00:24:40,400
Set-Cookie, Set-Cookie, set-kaka,
set-cookie.

535
00:24:40,400 --> 00:24:44,030
Och det finns några funktioner här.

536
00:24:44,030 --> 00:24:46,170
Alla av dem nämna några
typ av utgångsdatum.

537
00:24:46,170 --> 00:24:50,090
Och det ser ut som Facebook är att hoppas
att minnas mig fram till 2015.

538
00:24:50,090 --> 00:24:53,670
Så det är förmodligen den tidpunkt då
Jag måste logga ut eller de ska bara

539
00:24:53,670 --> 00:24:55,710
automatiskt antar jag
inte kommer tillbaka.

540
00:24:55,710 --> 00:24:57,840
Så det är faktiskt en anständig
tid.

541
00:24:57,840 --> 00:24:59,170
>> Och det finns några andra
saker som händer här.

542
00:24:59,170 --> 00:25:03,036
Denna cookie verkar vara våld
raderas genom att säga att det löpte ut 1970

543
00:25:03,036 --> 00:25:04,460
före cookies existerade.

544
00:25:04,460 --> 00:25:06,510
Så webbläsaren är bara att gå
att anta OK, det är som

545
00:25:06,510 --> 00:25:07,910
tvätta händerna stämpeln.

546
00:25:07,910 --> 00:25:11,240
>> Men nu när min webbläsare gör
en senare begäran -

547
00:25:11,240 --> 00:25:14,340
Låt mig gå vidare och göra detta
igen och ladda om.

548
00:25:14,340 --> 00:25:18,170
Låt mig rulla tillbaka till
top begäran och gå ner

549
00:25:18,170 --> 00:25:20,760
här, begäransrubriker.

550
00:25:20,760 --> 00:25:21,390
Lägg märke till detta.

551
00:25:21,390 --> 00:25:25,280
Så nu är jag i inte svarshuvuden,
men märker det säger begäransrubriker.

552
00:25:25,280 --> 00:25:29,220
Och märker att min webbläsare som en del av
sin begäran efter att ha visat reload har

553
00:25:29,220 --> 00:25:32,780
skickas minst följande
information.

554
00:25:32,780 --> 00:25:34,670
Inte set-kaka, men kakan.

555
00:25:34,670 --> 00:25:38,750
Så detta är den linje, HTTP-rubriken så
att tala, där min webbläsare är sort

556
00:25:38,750 --> 00:25:43,340
av utan att jag vet att det fram
min hand för Facebooks inspektion.

557
00:25:43,340 --> 00:25:46,020
>> Så dessa cookies kan vara
används sedan för vad?

558
00:25:46,020 --> 00:25:49,420
För att komma ihåg vem du är, eller minns hur
många gånger du har varit där, eller

559
00:25:49,420 --> 00:25:50,280
verkligen någonting.

560
00:25:50,280 --> 00:25:52,742
>> Så här är counter.php.

561
00:25:52,742 --> 00:25:53,780
Och låt mig zooma in på teckensnittet.

562
00:25:53,780 --> 00:25:58,380
Och varje gång jag ladda om denna sida, märker
det är att komma ihåg hur många gånger

563
00:25:58,380 --> 00:25:59,250
Jag har varit där.

564
00:25:59,250 --> 00:26:00,570
Tja, det är inte så imponerande.

565
00:26:00,570 --> 00:26:03,140
Låt oss avsluta just den fliken,
och nu ska vi gå tillbaka till

566
00:26:03,140 --> 00:26:07,860
http://localhost/counter.php.

567
00:26:07,860 --> 00:26:08,970
>> Åh, det är intressant.

568
00:26:08,970 --> 00:26:10,960
Det mindes fortfarande, även
även om jag stängde fliken.

569
00:26:10,960 --> 00:26:14,010
Och ärligt talat, om jag stänger webbläsaren,
om de genomförs på rätt sätt, jag

570
00:26:14,010 --> 00:26:18,950
kan fortfarande komma ihåg att denna användare är
vem han eller hon var den första gången, och

571
00:26:18,950 --> 00:26:22,840
bara när jag går in i Chromes meny, som
hit är här, och gå till

572
00:26:22,840 --> 00:26:25,990
Historia och klicka på Rensa webbinformation,
som vissa av er kanske har i

573
00:26:25,990 --> 00:26:33,050
förbi, först då kommer dina cookies
faktiskt utgå under web

574
00:26:33,050 --> 00:26:33,970
utveckling.

575
00:26:33,970 --> 00:26:35,340
>> Så, om vi går -

576
00:26:35,340 --> 00:26:37,080
låt oss stänga gedit här.

577
00:26:37,080 --> 00:26:38,910
Och om vi går nu till den här filen.

578
00:26:38,910 --> 00:26:44,210
Låt mig gå in på vår
vhosts / localhost / allmänheten, och låt mig göra

579
00:26:44,210 --> 00:26:46,340
counter.php.

580
00:26:46,340 --> 00:26:48,350
Observera att detta är en ganska
enkelt program.

581
00:26:48,350 --> 00:26:50,250
Det är en ganska enkel hemsida.

582
00:26:50,250 --> 00:26:51,770
>> Så upp i filen
är bara kommentarer.

583
00:26:51,770 --> 00:26:54,930
Men här är en ny linje som du kan
redan sett i p-set sju,

584
00:26:54,930 --> 00:26:56,000
session_start ().

585
00:26:56,000 --> 00:27:00,380
Detta är en linje av PHP-kod som
huvudsak berättar webbservern, gör

586
00:27:00,380 --> 00:27:03,400
Se till att stämpla händer och göra
Glöm inte att kolla handen frimärken.

587
00:27:03,400 --> 00:27:06,810
Det är allt som linjen gör, och det
gör allt för att processen för oss.

588
00:27:06,810 --> 00:27:09,510
Sedan märker jag precis har fått
två grenar här.

589
00:27:09,510 --> 00:27:14,150
Om räknaren nyckeln insidan av detta
särskild global variabel som heter

590
00:27:14,150 --> 00:27:18,010
$ _SESSION Är satt - med andra ord,
om det finns något värde där -

591
00:27:18,010 --> 00:27:22,440
Låt oss få det och förvara det på en lokal
variabel som heter $ disk.

592
00:27:22,440 --> 00:27:27,000
Else, låt oss tilldela $ räknare
standardvärdet 0.

593
00:27:27,000 --> 00:27:30,320
>> Nu här är en aspekt av PHP som är
både en välsignelse och en förbannelse.

594
00:27:30,320 --> 00:27:32,080
PHP är lite slarvig.

595
00:27:32,080 --> 00:27:35,160
Så medan i C, vad skulle det
omfattningen av räknare har varit

596
00:27:35,160 --> 00:27:36,725
antingen här eller här?

597
00:27:36,725 --> 00:27:39,270

598
00:27:39,270 --> 00:27:41,690
>> Det skulle ha varit begränsat
dessa klammerparenteser.

599
00:27:41,690 --> 00:27:42,090
Gissa vad?

600
00:27:42,090 --> 00:27:46,920
I PHP, finns det även utanför de
Klammerparenteserna, här och här,

601
00:27:46,920 --> 00:27:49,120
och här, och här, och
även ner nedan.

602
00:27:49,120 --> 00:27:52,400
Så jag säger att detta är en välsignelse i den meningen
att du inte behöver tänka så

603
00:27:52,400 --> 00:27:54,070
hårt som vi gjorde veckor sedan.

604
00:27:54,070 --> 00:27:56,880
Men det är också lite av en förbannelse i detta
oavsett var du använder en variabel i

605
00:27:56,880 --> 00:28:00,020
PHP, åtminstone i ett program som detta,
Det är globalt tillgängliga för

606
00:28:00,020 --> 00:28:01,170
bättre eller sämre.

607
00:28:01,170 --> 00:28:06,130
Så du måste hålla i minnet nu när
dina variabler kan inte vara odefinierat.

608
00:28:06,130 --> 00:28:07,640
Du kanske har definierat dem någon annanstans.

609
00:28:07,640 --> 00:28:09,460
>> Men vad ska jag göra i slutändan?

610
00:28:09,460 --> 00:28:13,160
Jag kommer att spara in på den globala
variabel som ett värde av

611
00:28:13,160 --> 00:28:17,060
räknare nyckel resultatet av
gör räknare plus ett.

612
00:28:17,060 --> 00:28:18,910
Så det här är bara det aritmetiska
som gör

613
00:28:18,910 --> 00:28:20,590
uppräkning av den räknaren.

614
00:28:20,590 --> 00:28:24,850
Och det faktum att jag lagrar det
värde tillbaka här är medel till

615
00:28:24,850 --> 00:28:29,970
huvudsak uppdatera databasen till
kom ihåg att användaren 123456789 har varit

616
00:28:29,970 --> 00:28:31,010
här två gånger.

617
00:28:31,010 --> 00:28:33,780
Och när jag gör det igen nästa gång jag
ladda om sidan, det kommer att ta

618
00:28:33,780 --> 00:28:36,710
min hand stämpla och säger, åh,
Användaren 123456789 har nu

619
00:28:36,710 --> 00:28:38,410
varit här tre gånger.

620
00:28:38,410 --> 00:28:43,390
>> Och så vad PHP och liknande språk
gör för oss är att de är att räkna

621
00:28:43,390 --> 00:28:47,720
ut hur och var och hur länge
att lagra värdena i denna speciella

622
00:28:47,720 --> 00:28:48,830
superglobal.

623
00:28:48,830 --> 00:28:52,750
Och detta superglobal nästa gång jag
besöker sidan är slags magiskt

624
00:28:52,750 --> 00:28:57,440
förifylld, fylld med värden som
var där förra gången du besökte,

625
00:28:57,440 --> 00:29:02,310
oavsett om det var en sekund sedan, en vecka
sedan, eller 2013 och vi nu talar

626
00:29:02,310 --> 00:29:03,790
ca 2015.

627
00:29:03,790 --> 00:29:07,600
PHP och ta hand webbserver
av allt detta för dig.

628
00:29:07,600 --> 00:29:08,850
>> PUBLIK: [OHÖRBAR].

629
00:29:08,850 --> 00:29:11,900

630
00:29:11,900 --> 00:29:15,760
>> DAVID MALAN: Variabler i PHP är
väsentligen alltid globala såvida du

631
00:29:15,760 --> 00:29:18,400
förklara dem inne i en funktion,
och då är de lokala till

632
00:29:18,400 --> 00:29:19,420
endast funktionen.

633
00:29:19,420 --> 00:29:22,300
Men eftersom jag har inte skrivit något
funktioner, är de nu på ett effektivt sätt

634
00:29:22,300 --> 00:29:25,090
globalt under hela min fil här.

635
00:29:25,090 --> 00:29:26,040
>> PUBLIK: Finns det något sätt
för att göra dem lokalt?

636
00:29:26,040 --> 00:29:28,470
>> DAVID MALAN: Finns det någon
sätt att göra dem lokalt?

637
00:29:28,470 --> 00:29:30,680
Endast genom att linda in dem i funktioner.

638
00:29:30,680 --> 00:29:32,790
Som i den senaste versionen av
PHP, kan du göra det med

639
00:29:32,790 --> 00:29:34,130
en anonym funktion.

640
00:29:34,130 --> 00:29:35,930
Men mer om det i
ramen för JavaScript.

641
00:29:35,930 --> 00:29:37,260
Men det korta svaret är nej.

642
00:29:37,260 --> 00:29:40,888
Ett längre svar är ja.

643
00:29:40,888 --> 00:29:42,380
Nice.

644
00:29:42,380 --> 00:29:43,380
Bra frågesport fråga.

645
00:29:43,380 --> 00:29:43,930
Okej.

646
00:29:43,930 --> 00:29:47,760
>> Så slutligen, är själva sidan
faktiskt ganska enkelt.

647
00:29:47,760 --> 00:29:51,470
Lägg märke till att när jag avslutar PHP-läge, minns
att allt det här ner

648
00:29:51,470 --> 00:29:53,700
Nedan är bara att få spotta
ut obehandlad till webbläsaren.

649
00:29:53,700 --> 00:29:57,050
Vilket är bra, eftersom jag vill skicka
användaren någon HTML, men jag vill

650
00:29:57,050 --> 00:29:59,140
att dynamiskt uppdatera HTML.

651
00:29:59,140 --> 00:30:03,930
Och ett sätt jag kan göra detta är att sortera
av mycket snabbt falla tillbaka i PHP

652
00:30:03,930 --> 00:30:07,730
läge, användning öppen fäste frågetecken
likhetstecknet, och matas sedan ut värdet

653
00:30:07,730 --> 00:30:08,650
av disk.

654
00:30:08,650 --> 00:30:12,360
>> Eller om det ser lite kryptiskt, detta
likhetstecknet är egentligen bara en del

655
00:30:12,360 --> 00:30:16,190
syntaktiskt socker för detta
printf ($ räknare).

656
00:30:16,190 --> 00:30:19,160
Men ärligt talat, det är bara lite ful
och lite irriterande att skriva.

657
00:30:19,160 --> 00:30:23,660
Så PHP erbjuder mycket fint denna funktion
där du kan bara säga det mer

658
00:30:23,660 --> 00:30:25,450
fattat på samma sätt.

659
00:30:25,450 --> 00:30:26,940
>> Så vad som händer under
huven?

660
00:30:26,940 --> 00:30:31,210
Låt oss snabbt titta på nätet
fliken för counter.php här.

661
00:30:31,210 --> 00:30:35,090
Och låt mig gå vidare och först
låt oss rensa dina cookies.

662
00:30:35,090 --> 00:30:38,670
Låt oss klara sökdata sedan
tidernas begynnelse.

663
00:30:38,670 --> 00:30:39,680
Låt oss nu gå tillbaka hit.

664
00:30:39,680 --> 00:30:41,340
Nu ska vi ladda om sidan.

665
00:30:41,340 --> 00:30:42,170
Och jag är tillbaka på noll.

666
00:30:42,170 --> 00:30:44,810
Eftersom min hand stämpeln har tvättats,
Jag får nu en ny cookie.

667
00:30:44,810 --> 00:30:48,780
>> I själva verket, om jag tittar på fliken nätverk och
titta på svarshuvuden, meddelande

668
00:30:48,780 --> 00:30:51,960
att apparaten sänder mig
en cookie vars namn är något

669
00:30:51,960 --> 00:30:55,820
godtyckligt, men typ av
rimligt, PHPSESSID.

670
00:30:55,820 --> 00:30:58,440
Och det är att skicka mig detta verkligen
stort slumptal.

671
00:30:58,440 --> 00:30:59,440
Det är inte ganska många.

672
00:30:59,440 --> 00:31:00,390
Det är inte riktigt hexadecimal.

673
00:31:00,390 --> 00:31:03,600
Det är någon form av alfanumerisk sträng,
men förmodligen är det slumpmässigt.

674
00:31:03,600 --> 00:31:06,830
Och det är den hand stämpel så att
tala om att jag hänvisar till.

675
00:31:06,830 --> 00:31:11,960
>> Under tiden, om jag klickar på reload och sedan
titta på denna andra raden för min andra

676
00:31:11,960 --> 00:31:17,600
framställningar, meddelanden nu att min begäran
rubriker inkluderar PHPSESSID motsvarar detta,

677
00:31:17,600 --> 00:31:19,390
inte ställa in-kaka, men bara cookie.

678
00:31:19,390 --> 00:31:22,950
Och det är min webbläsare presentation
min hand stämpel.

679
00:31:22,950 --> 00:31:28,820
>> Så nu som en teaser, och vi ska prata mer
om det här i en vecka eller så, men

680
00:31:28,820 --> 00:31:31,590
på vilket sätt gör det att du
sårbar, ditt Facebook-konto

681
00:31:31,590 --> 00:31:34,137
sårbara, och andra sådana
står utsatta?

682
00:31:34,137 --> 00:31:35,510
>> PUBLIK: Om någon har din cookie.

683
00:31:35,510 --> 00:31:36,750
>> DAVID MALAN: Ja, om någon
har din cookie.

684
00:31:36,750 --> 00:31:39,920
Jag menar riktigt, ungefär som en del av er
kanske har provat på som en klubb eller en

685
00:31:39,920 --> 00:31:44,030
nöjespark, om du försöker något
så här för att kopiera stämpeln, om än

686
00:31:44,030 --> 00:31:47,560
bakåt på en annan persons hand,
och sedan han eller hon presenterar det som

687
00:31:47,560 --> 00:31:53,250
sin egen, om det faktiskt ser
identiska, 123456789, då webben

688
00:31:53,250 --> 00:31:57,980
servern är tydligen bara att
lita på att användaren är dig.

689
00:31:57,980 --> 00:32:01,450
>> Och detta är verkligen en grundläggande
hot när du använder cookies

690
00:32:01,450 --> 00:32:05,420
för om någon bara kapar så att
talar ditt kaka, räknar ut vad det

691
00:32:05,420 --> 00:32:08,660
är, antingen genom att verkligen kopiera den
genom att titta på din dator

692
00:32:08,660 --> 00:32:09,890
och vara som, OK.

693
00:32:09,890 --> 00:32:14,520
Davids cookie är JJ3JIK och så vidare,
och då de är smarta nog att veta

694
00:32:14,520 --> 00:32:18,080
hur sorts skicka manuellt att
cookie från en webbläsare eller från en

695
00:32:18,080 --> 00:32:22,350
program de skriver, de kunde helt
logga in på en webbplats som du.

696
00:32:22,350 --> 00:32:28,560
Det är inte så svårt att låtsas vara
någon annan om vi inte åter p-set

697
00:32:28,560 --> 00:32:30,790
två, som införde vad?

698
00:32:30,790 --> 00:32:32,065
>> PUBLIK: Cryptography.

699
00:32:32,065 --> 00:32:33,860
>> DAVID MALAN: Lite
lite av kryptografi.

700
00:32:33,860 --> 00:32:36,550
Enkel kryptering, åtminstone i
Standard Edition, men krypto

701
00:32:36,550 --> 00:32:36,870
ändå.

702
00:32:36,870 --> 00:32:37,410
mindre.

703
00:32:37,410 --> 00:32:41,440
Så det visar sig om du krypterar alla
dessa rubriker som använder något som du

704
00:32:41,440 --> 00:32:48,770
kanske vet nu mer familjärt som SSL,
Secure Socket Layer, eller https:// URL: er,

705
00:32:48,770 --> 00:32:51,890
då alla dessa saker vi har varit
blick på faktiskt krypterad,

706
00:32:51,890 --> 00:32:54,800
vilket innebär att det är som du
kan inte läsa handstämpel.

707
00:32:54,800 --> 00:32:59,350
Endast facebook.com kan, eller google.com,
eller i detta fall, apparaten kan

708
00:32:59,350 --> 00:33:00,550
Läs den handen stämpel.

709
00:33:00,550 --> 00:33:04,020
>> Tragiskt dock, och igen, detta
alltför lämpligt med NSA grejer

710
00:33:04,020 --> 00:33:06,410
för sent, är till och med SSL brytbar.

711
00:33:06,410 --> 00:33:09,850
Och det är faktiskt inte så svårt
att ens knäcka den kryptering.

712
00:33:09,850 --> 00:33:12,040
Inte så mycket genom att knäcka krypteringen,
men genom att lura

713
00:33:12,040 --> 00:33:15,720
webbläsare till dekryptering
datan i förtid.

714
00:33:15,720 --> 00:33:17,880
Men återigen, vi reta dig
med detta inom kort.

715
00:33:17,880 --> 00:33:21,242
För nu, bara rädd.

716
00:33:21,242 --> 00:33:23,070
Det är tragiskt slags sant.

717
00:33:23,070 --> 00:33:23,760
>> Okej.

718
00:33:23,760 --> 00:33:27,910
Så, när detta lämnar oss nu?

719
00:33:27,910 --> 00:33:29,010
Nåväl, låt oss göra detta.

720
00:33:29,010 --> 00:33:31,790
Låt oss gå vidare och ta en snabb
teaser innan vi tar en paus.

721
00:33:31,790 --> 00:33:33,790
Och jag tror att vi kommer att dröja lite längre
idag, men vi kommer att dyka in

722
00:33:33,790 --> 00:33:37,850
något helt nytt och sexigt, vilket kommer
fundera för ännu mer.

723
00:33:37,850 --> 00:33:38,950
Så det är teaser.

724
00:33:38,950 --> 00:33:41,520
>> Så SQL, började vi prata om
någonsin så kort förra gången.

725
00:33:41,520 --> 00:33:44,670
Du kommer verkligen få händerna smutsiga
med en del av det i p-set sju.

726
00:33:44,670 --> 00:33:46,480
Och i lekmannaspråk, gör vad SQL -

727
00:33:46,480 --> 00:33:47,110
S-Q-L -

728
00:33:47,110 --> 00:33:49,850
göra för dig?

729
00:33:49,850 --> 00:33:50,310
Vad är det?

730
00:33:50,310 --> 00:33:51,546
Yeah.

731
00:33:51,546 --> 00:33:53,240
>> Publik: Låt oss dataåtkomst.

732
00:33:53,240 --> 00:33:53,360
>> DAVID MALAN: Yeah.

733
00:33:53,360 --> 00:33:55,120
Det låter dig komma åt data
i en databas.

734
00:33:55,120 --> 00:33:56,710
Structured Query Language.

735
00:33:56,710 --> 00:33:59,890
Och detta är i huvudsak en
programmeringsspråk.

736
00:33:59,890 --> 00:34:03,400
Det finns funktioner i det som
Vi kommer inte ens att använda i klassen.

737
00:34:03,400 --> 00:34:04,710
Men du kan faktiskt
definiera funktioner.

738
00:34:04,710 --> 00:34:06,870
De kallas lagrade
förfaranden i SQL.

739
00:34:06,870 --> 00:34:09,860
Men vi ska hålla det ganska enkelt och bara
använda den för vissa grundläggande funktioner

740
00:34:09,860 --> 00:34:14,320
såsom välja uppgifter, infoga data,
uppdatera data, och ta bort data.

741
00:34:14,320 --> 00:34:17,400
>> Och du kan verkligen tänka på en databas,
som en SQL-databas, som bara

742
00:34:17,400 --> 00:34:18,800
är Microsoft Excel.

743
00:34:18,800 --> 00:34:21,989
Eftersom SQL hänvisar till en relationsdatabas
databas, där

744
00:34:21,989 --> 00:34:23,480
relation betyder bara tabeller.

745
00:34:23,480 --> 00:34:24,739
Rader och kolumner.

746
00:34:24,739 --> 00:34:27,929
Så allt du kan sätta i ett kalkylblad
Gillar du eller Google Docs,

747
00:34:27,929 --> 00:34:32,460
Du kan sätta in en SQL-databas
genom att förklara ett bord.

748
00:34:32,460 --> 00:34:34,800
>> Nu, hur gör du åt faktiskt
denna information?

749
00:34:34,800 --> 00:34:38,239
Tja, med kommandon eller
frågor som denna.

750
00:34:38,239 --> 00:34:40,199
SELECT, INSERT, UPDATE och DELETE.

751
00:34:40,199 --> 00:34:44,489
Och för det mesta, de är de
fyra enda ingredienserna du behöver för att

752
00:34:44,489 --> 00:34:47,370
göra något ganska kraftfullt
i problem som sju.

753
00:34:47,370 --> 00:34:49,940
>> Nu tillbaka i dag, skulle du faktiskt
interagera med en databas i en

754
00:34:49,940 --> 00:34:52,730
svart och vitt terminalfönster på
en blinkande prompt såhär.

755
00:34:52,730 --> 00:34:56,370
Och databasen vi kör på
Apparaten kallas MySQL, som är

756
00:34:56,370 --> 00:34:58,560
fri och öppen källkod databas motor.

757
00:34:58,560 --> 00:35:02,240
Om du Google och läsa Wikipedia
artikeln, vet du att namnet är

758
00:35:02,240 --> 00:35:05,060
lite av övergång för vissa
versioner av Linux.

759
00:35:05,060 --> 00:35:10,460
Maria databas är faktiskt ett
gaffel så att säga av MySQL.

760
00:35:10,460 --> 00:35:12,740
>> Lång historia kort, köpte Oracle MySQL.

761
00:35:12,740 --> 00:35:13,870
Oracle är ett stort företag.

762
00:35:13,870 --> 00:35:17,010
Folk har varit orolig att det skulle
inte längre vara lika öppen källkod,

763
00:35:17,010 --> 00:35:20,930
så detta är bara en kopia av MySQL som är
fortfarande fri, fortfarande öppen källkod, och

764
00:35:20,930 --> 00:35:23,550
installeras i Fedora Linux som standard.

765
00:35:23,550 --> 00:35:26,130
>> Men det är typ av en smärta i
halsen för att bekanta sig med en

766
00:35:26,130 --> 00:35:27,310
databasen på detta sätt.

767
00:35:27,310 --> 00:35:30,560
Så vi är i CS50 apparaten
ett gratis open source verktyg som kallas

768
00:35:30,560 --> 00:35:31,700
phpMyAdmin.

769
00:35:31,700 --> 00:35:33,940
Bara en tillfällighet att
det är skrivet i PHP.

770
00:35:33,940 --> 00:35:36,450
Det finns ingen grundläggande
behöver för PHP här.

771
00:35:36,450 --> 00:35:40,090
Men detta är bara ett webbaserat verktyg som
vi ned gratis, installerad i

772
00:35:40,090 --> 00:35:43,850
apparaten, som tillåter oss att ha en
grafiskt användargränssnitt med vilken

773
00:35:43,850 --> 00:35:48,610
att utforska p-set sju databas med
som att skapa nya databaser,

774
00:35:48,610 --> 00:35:51,980
säga för egen slutlig projekt om du skulle
vilja, och i slutändan skapa

775
00:35:51,980 --> 00:35:55,900
dynamiska webbplatser som CS50 Finans
som gör att du kan ställa frågor om data och

776
00:35:55,900 --> 00:35:58,140
uppdatera data dynamiskt.

777
00:35:58,140 --> 00:36:01,420
>> Du kommer inte att behöva använda bara
en enkel textfil eller CSV.

778
00:36:01,420 --> 00:36:05,950
Du kan faktiskt använda en smart databas
program så att du kan utföra mer

779
00:36:05,950 --> 00:36:10,240
sofistikerade frågor än att bara läsa
igenom allt linjärt.

780
00:36:10,240 --> 00:36:14,150
>> Så till exempel, är detta vad vi ger
du ur lådan för p-set sju.

781
00:36:14,150 --> 00:36:18,280
Detta är ett bord med till synes minst
tre kolumner, en av vilka är

782
00:36:18,280 --> 00:36:21,450
användarnamn, varav en är hash,
och av vilka den andra är-ID.

783
00:36:21,450 --> 00:36:26,200
>> Men det intressanta, och bara för att
locka fram en tanke här, användarnamn

784
00:36:26,200 --> 00:36:29,270
är förmodligen redan unikt, rätt?

785
00:36:29,270 --> 00:36:31,190
Jag menar, de flesta någon hemsida, om
du har ett användarnamn, det

786
00:36:31,190 --> 00:36:32,370
kan inte vara två caesars.

787
00:36:32,370 --> 00:36:33,440
Det kan inte finnas två Malans.

788
00:36:33,440 --> 00:36:34,950
Det kan inte finnas två jharvards.

789
00:36:34,950 --> 00:36:35,600
Dess unika.

790
00:36:35,600 --> 00:36:38,610
Annars vet de inte vilka
jharvard är det faktiskt.

791
00:36:38,610 --> 00:36:42,710
Så vad kan vara motivationen för också
ha en tredje kolumn till vänster

792
00:36:42,710 --> 00:36:46,970
det kallas ID, som ser ut som en
nummer som är på liknande sätt unik?

793
00:36:46,970 --> 00:36:51,300
Det känns lite överflödigt
till mig vid första anblicken.

794
00:36:51,300 --> 00:36:54,910
Varför skulle det vara spännande att ha
inte bara unikt användarnamn,

795
00:36:54,910 --> 00:36:56,837
men också unika nummer?

796
00:36:56,837 --> 00:36:59,460
>> Publik: De kunde ha
samma lösenord.

797
00:36:59,460 --> 00:37:01,720
>> DAVID MALAN: Människor kan ha
samma lösenord, säker.

798
00:37:01,720 --> 00:37:03,900
Det absolut kunde hända.

799
00:37:03,900 --> 00:37:08,270
Men om de har denna unika användarnamn, jag
skulle hävda att det inte riktigt

800
00:37:08,270 --> 00:37:11,630
materia, för om de skriver i sina
användarnamn, jag behöver bara kontrollera deras

801
00:37:11,630 --> 00:37:15,060
lösenord, deras hash därav.

802
00:37:15,060 --> 00:37:15,970
Varför annars?

803
00:37:15,970 --> 00:37:17,950
>> Publik: Snabbare sökning.

804
00:37:17,950 --> 00:37:18,680
>> DAVID MALAN: Snabbare sökning.

805
00:37:18,680 --> 00:37:19,548
Varför?

806
00:37:19,548 --> 00:37:21,460
>> Målgrupp: ID är bara en.

807
00:37:21,460 --> 00:37:24,040
>> DAVID MALAN: ID är bara ett tecken,
eller för att vara mer exakt, det är ett tal,

808
00:37:24,040 --> 00:37:26,910
så det är nog 32 bitar
eller nåt sånt.

809
00:37:26,910 --> 00:37:30,270
Medan användarnamn, tydligen Jason
Hirschhorn är uppe är typ av

810
00:37:30,270 --> 00:37:33,900
löjligt lång, och det kommer att
ta mig mycket mer tid till sträng

811
00:37:33,900 --> 00:37:40,910
jämför H-I-R-S-C-H-H-O-R-N, och kanske
a / 0 eller något liknande, i syfte

812
00:37:40,910 --> 00:37:45,100
att slå upp Jason, i motsats till bara
säga ge mig användarnamn nummer två.

813
00:37:45,100 --> 00:37:46,510
Det är 32 bitar.

814
00:37:46,510 --> 00:37:48,550
Det är en enda INT som
du måste jämföra.

815
00:37:48,550 --> 00:37:52,150
Och faktiskt, det är exakt varför databaser
tenderar att tilldela unika ID till

816
00:37:52,150 --> 00:37:53,710
rader i dem.

817
00:37:53,710 --> 00:37:56,280
>> Nu vad andra datatyper är det
förutom INT och tydligen

818
00:37:56,280 --> 00:37:57,160
strängar som denna?

819
00:37:57,160 --> 00:37:59,700
Tja, för att vara mer korrekt,
SQL-databaser, som

820
00:37:59,700 --> 00:38:02,060
MySQL har CHAR fält.

821
00:38:02,060 --> 00:38:05,320
Och röding lite missvisande
är inte en enda CHAR.

822
00:38:05,320 --> 00:38:10,290
Ett CHAR fält i en MySQL-databas är
ett eller flera tecken, men det är en

823
00:38:10,290 --> 00:38:11,780
fast antal tecken.

824
00:38:11,780 --> 00:38:15,710
>> Så till exempel, om jag går över till
phpMyAdmin som du kanske redan har, eller

825
00:38:15,710 --> 00:38:21,340
snart kommer ett problem som sju, och jag går
till min databas, och bara för skojs skull,

826
00:38:21,340 --> 00:38:25,700
Låt oss skapa en ny tabell som heter
testa med bara två kolumner.

827
00:38:25,700 --> 00:38:27,160
Jag ska klicka på Go.

828
00:38:27,160 --> 00:38:30,070
Och det kommer att bli ganska bekant,
speciellt när du mixtra

829
00:38:30,070 --> 00:38:31,130
runt på egen hand.

830
00:38:31,130 --> 00:38:34,140
Här kanske jag skriver ID för att skapa
en ny tabell av typen int.

831
00:38:34,140 --> 00:38:37,770
Men här jag kan skriva användarnamn
återskapa den tidigare tabellen.

832
00:38:37,770 --> 00:38:40,700
Och märker jag har ett helt gäng
av olika typer att välja mellan.

833
00:38:40,700 --> 00:38:43,610
>> Och detta är också anledningen till phpMyAdmin
är ganska trevligt.

834
00:38:43,610 --> 00:38:46,770
Det är typ av själv-undervisning i att du
kan bara typ av peka och klicka, och

835
00:38:46,770 --> 00:38:50,730
titta på rullgardinsmenyer, och utläsa
att vilka befogenheter SQL ger dig.

836
00:38:50,730 --> 00:38:54,090
>> Och faktiskt, om jag väljer CHAR, jag sedan
behöva ange längden, eller hur

837
00:38:54,090 --> 00:38:55,940
många värden, hur många tecken.

838
00:38:55,940 --> 00:39:00,090
Så mycket gemensamma värderingar är saker som
255, men det är lite lång.

839
00:39:00,090 --> 00:39:02,250
Vanligen är åtta för ett användarnamn.

840
00:39:02,250 --> 00:39:03,590
Men det är lite små i dessa dagar.

841
00:39:03,590 --> 00:39:05,430
Så detta är en design beslut.

842
00:39:05,430 --> 00:39:08,630
Är det 8 tecken max,
32, 255, 1000?

843
00:39:08,630 --> 00:39:09,830
Det är verkligen upp till dig.

844
00:39:09,830 --> 00:39:12,350
Men en CHAR fält är ett fast antal.

845
00:39:12,350 --> 00:39:16,420
Så väljer för få och du är typ av
skruvas om du vill ha en längre användarnamn.

846
00:39:16,420 --> 00:39:19,132
Välj alltför många och vad som är
Nackdelen?

847
00:39:19,132 --> 00:39:20,820
>> Publik: [OHÖRBAR].

848
00:39:20,820 --> 00:39:21,620
>> DAVID MALAN: Det är slöseri.

849
00:39:21,620 --> 00:39:24,835
Precis som i C, om du har en större
bit av minne än du behöver, du är

850
00:39:24,835 --> 00:39:27,190
bara slöseri med tid och slösa utrymme.

851
00:39:27,190 --> 00:39:31,430
Så som ett alternativ, existerar
VARCHAR, som löser detta problem genom

852
00:39:31,430 --> 00:39:36,390
behandla längd inte som en fast längd,
utan som en maximal längd, och med användning av en

853
00:39:36,390 --> 00:39:40,990
variabelt antal TECKEN, som sedan
tenderar att bara använda så många TECKEN som du

854
00:39:40,990 --> 00:39:42,710
faktiskt behöver.

855
00:39:42,710 --> 00:39:43,670
Det låter perfekt.

856
00:39:43,670 --> 00:39:45,640
>> Varför inte vi bli av med
Datatypen CHAR då?

857
00:39:45,640 --> 00:39:48,500
Vad kan vara Nackdelen med
använder VARCHARs, vilket låter

858
00:39:48,500 --> 00:39:51,644
som det är en fin seger?

859
00:39:51,644 --> 00:39:52,596
Yeah?

860
00:39:52,596 --> 00:39:53,846
>> Publik: [OHÖRBAR].

861
00:39:53,846 --> 00:39:57,360

862
00:39:57,360 --> 00:39:57,790
>> DAVID MALAN: OK, bra.

863
00:39:57,790 --> 00:40:01,101
Så om alla dina data är densamma
längd, vad är oro?

864
00:40:01,101 --> 00:40:05,250
>> Publik: Eftersom du slösar bort
data genom att berätta för dem alla.

865
00:40:05,250 --> 00:40:09,060
>> DAVID MALAN: Så om alla dina data är
samma längd, men skulle jag hävda

866
00:40:09,060 --> 00:40:12,300
att ange en maximal längd
på VARCHAR är inte annorlunda från

867
00:40:12,300 --> 00:40:16,070
ange en fast längd på CHAR om
du vet att många i förväg.

868
00:40:16,070 --> 00:40:19,500
Men det finns faktiskt, och jag ska sortera på
utdrag ur det svaret verkligheten

869
00:40:19,500 --> 00:40:22,610
att det fortfarande finns ett max, vilket skulle kunna
vara irriterande, särskilt om du

870
00:40:22,610 --> 00:40:25,920
möter en persons namn som är
ovanligt länge som du inte

871
00:40:25,920 --> 00:40:26,860
förutse.

872
00:40:26,860 --> 00:40:31,420
Och det är också en lite mindre effektiv
att faktiskt söka på VARCHARs som

873
00:40:31,420 --> 00:40:35,620
motsätter sig söka TECKEN, speciellt
för långa bord som har massor och

874
00:40:35,620 --> 00:40:36,510
massor av data.

875
00:40:36,510 --> 00:40:40,060
Så även här, är tematiskt igen
inget självklart val.

876
00:40:40,060 --> 00:40:42,870
>> Så bara för att ge dig en känsla av andra
datatyper som kan vara av intresse

877
00:40:42,870 --> 00:40:45,400
antingen för p-set sju eller i
framtiden, finns INT.

878
00:40:45,400 --> 00:40:47,270
Det finns BIGINT, som
är som länge länge.

879
00:40:47,270 --> 00:40:48,880
Det tenderar att vara 64 bitar.

880
00:40:48,880 --> 00:40:51,640
Det finns decimal, vilket du kan se i
problemet set, som är en mycket

881
00:40:51,640 --> 00:40:55,300
renare svar på de problem som vi
påträffas med flottör och flytande

882
00:40:55,300 --> 00:40:55,980
punkt imprecision.

883
00:40:55,980 --> 00:40:57,390
Och sedan finns det DATETIME.

884
00:40:57,390 --> 00:41:01,530
Det är bokstavligen en datatyp som har
att se ut som ett år, en månad, en dag,

885
00:41:01,530 --> 00:41:03,730
och en timme, minut och sekund.

886
00:41:03,730 --> 00:41:07,470
>> Men SQL-databaser har också
saker vi ringer index.

887
00:41:07,470 --> 00:41:11,630
Och ett index är något som du
ange när du skapar tabellen till

888
00:41:11,630 --> 00:41:15,720
göra sökningar och andra verksamheter
mer effektiv.

889
00:41:15,720 --> 00:41:18,550
Specifikt, det finns något som kallas
PRIMARY index som du kan

890
00:41:18,550 --> 00:41:19,440
fastställa följande.

891
00:41:19,440 --> 00:41:22,330
>> Vi gjorde detta för dig med
användarna tabell ger vi dig.

892
00:41:22,330 --> 00:41:26,160
Men märker om jag manuellt återskapa
användarna tabellen här ge

893
00:41:26,160 --> 00:41:27,110
det ett namn på användare.

894
00:41:27,110 --> 00:41:28,125
Jag specificerat redan ID.

895
00:41:28,125 --> 00:41:29,330
Jag specificerade INT.

896
00:41:29,330 --> 00:41:32,000
Jag specificerade användarnamn
högst 32 tecken.

897
00:41:32,000 --> 00:41:36,140
Men om vi håller rullning i detta ganska
breda fönster, märker att det finns en

898
00:41:36,140 --> 00:41:38,260
massa andra saker som jag kan ange.

899
00:41:38,260 --> 00:41:40,950
>> One, kan jag specificera attributen
gillar, vet du vad, det här

900
00:41:40,950 --> 00:41:42,190
INT bör vara UNSIGNED.

901
00:41:42,190 --> 00:41:45,510
Jag vill inte ha negativa tal,
så låt oss göra det UNSIGNED.

902
00:41:45,510 --> 00:41:48,660
Null är inte relevant här eftersom
Jag vill att varje användare

903
00:41:48,660 --> 00:41:49,640
ha ett unikt nummer.

904
00:41:49,640 --> 00:41:50,830
Jag vill inte att det ska vara noll.

905
00:41:50,830 --> 00:41:52,330
>> Men detta är intressant.

906
00:41:52,330 --> 00:41:57,780
Jag kan ange att ID är antingen
primärnyckel i denna databas, eller det är

907
00:41:57,780 --> 00:42:00,620
unikt, eller det är indexerad, eller hela texten.

908
00:42:00,620 --> 00:42:05,630
Så för dagens ändamål, lång historia
korta, primär betyder att detta skall

909
00:42:05,630 --> 00:42:10,570
vara både konceptuellt och tekniskt
fältet som vi använder för att unikt

910
00:42:10,570 --> 00:42:12,140
identifiera användare.

911
00:42:12,140 --> 00:42:16,140
>> Så när vi tittar upp användare, är denna typ
av ett löfte att leta upp dem oftast av

912
00:42:16,140 --> 00:42:17,370
som unik identifierare.

913
00:42:17,370 --> 00:42:21,930
Och databasen kommer att se till att om du
har ett användarkonto nummer 3, kan du inte

914
00:42:21,930 --> 00:42:25,400
fysiskt infoga en annan användare
med samma nummer 3.

915
00:42:25,400 --> 00:42:28,380
Databasen kommer bara vägra
för att spara dina ändringar.

916
00:42:28,380 --> 00:42:32,310
Vilket är en bra sak, eftersom du kan
skydda dig från dig själv. själv

917
00:42:32,310 --> 00:42:34,270
>> Alternativt, för användarnamn.

918
00:42:34,270 --> 00:42:37,670
Så den andra raden, återkallelse,
är fältet Användarnamn.

919
00:42:37,670 --> 00:42:41,860
Så den andra raden är här användarnamn,
som vi gjorde längst till vänster där.

920
00:42:41,860 --> 00:42:43,940
>> Så vad mer kan jag vill ange?

921
00:42:43,940 --> 00:42:47,840
Jag är inte tillåtet, enligt SQL,
att specificera två primärnycklar.

922
00:42:47,840 --> 00:42:50,750
Du kan ange en gemensam nyckel där du
titta på båda områdena, men de kan inte

923
00:42:50,750 --> 00:42:52,260
sig vara primärnycklar.

924
00:42:52,260 --> 00:42:54,750
Så det är uteslutet.

925
00:42:54,750 --> 00:42:56,040
Så som jag kanske vill välja?

926
00:42:56,040 --> 00:42:59,710
>> Tja, är UNIK i samma anda som en
primärnyckel där du anger detta

927
00:42:59,710 --> 00:43:03,570
område skall vara unikt, men det är
inte kommer att vara en

928
00:43:03,570 --> 00:43:04,410
Jag använder hela tiden.

929
00:43:04,410 --> 00:43:08,450
Och vi kommer inte att använda den här allt
den tid för vilken anledning igen?

930
00:43:08,450 --> 00:43:10,490
Det är långsammare potentiellt om
det är en lång användarnamn.

931
00:43:10,490 --> 00:43:11,740
Det är bara ett slöseri med tid.

932
00:43:11,740 --> 00:43:16,140
>> INDEX, under tiden, anges att det är
inte att vara unik, men jag skulle vilja

933
00:43:16,140 --> 00:43:19,470
dig att arbeta din magi under
huva för att göra det snabbare för mig att

934
00:43:19,470 --> 00:43:21,420
söka på detta område.

935
00:43:21,420 --> 00:43:23,320
Så det här är nog inte relevant här.

936
00:43:23,320 --> 00:43:26,500
För användarnamn, skulle jag hävda att
UNIKA är ett bra svar.

937
00:43:26,500 --> 00:43:31,200
Men anta att vi gjort användarna mer
intressant än bara användarnamn,

938
00:43:31,200 --> 00:43:32,430
hashar och ID-nummer.

939
00:43:32,430 --> 00:43:33,860
Tänk om vi gav människor fulla namn?

940
00:43:33,860 --> 00:43:37,700
Tänk om vi gav dem adresser
och andra uppgifter om dem?

941
00:43:37,700 --> 00:43:43,360
>> Tja, om du anger att en kolumn i en
databasen är indexerad, innebär att det

942
00:43:43,360 --> 00:43:47,730
MySQL eller Oracle, eller vad databas
du använder, bör arbeta sin magi

943
00:43:47,730 --> 00:43:51,300
och använda någon form av fantasi uppgifter
struktur som ett träd, eller en trie, eller en

944
00:43:51,300 --> 00:43:55,940
hash-tabell, eller något för att garantera
att när du söker efter data med

945
00:43:55,940 --> 00:43:58,150
välja på just det -

946
00:43:58,150 --> 00:44:01,310
liksom visa mig alla att
bor på Oxford Street.

947
00:44:01,310 --> 00:44:02,540
En fråga som det.

948
00:44:02,540 --> 00:44:06,250
Om du har specificerat i förväg att
du vill ha ett index på det området, de

949
00:44:06,250 --> 00:44:09,050
sökningar kommer att bli mycket, mycket snabbare.

950
00:44:09,050 --> 00:44:12,090
>> Om du inte anger ett index, den bästa
du kan göra är en linjär sökning om

951
00:44:12,090 --> 00:44:13,030
det är inte sorterade.

952
00:44:13,030 --> 00:44:16,220
Men om du anger INDEX, smart
människor som gjort databasen -

953
00:44:16,220 --> 00:44:19,340
människor som du som nu vet träd
och länder och hashtabeller -

954
00:44:19,340 --> 00:44:23,220
kommer automatiskt att bygga en sådan uppgifter
struktur i RAM för att se till att

955
00:44:23,220 --> 00:44:26,050
dessa sökningar är mycket snabbare.

956
00:44:26,050 --> 00:44:29,660
>> FULLTEXT tiden är liknande i anden,
men du kan göra wildcard

957
00:44:29,660 --> 00:44:35,480
sökningar, liksom visa mig alla som
bor på gator som börjar med

958
00:44:35,480 --> 00:44:36,960
bokstaven O av någon anledning.

959
00:44:36,960 --> 00:44:38,850
Du kan göra sökningar med jokertecken
så.

960
00:44:38,850 --> 00:44:45,880
Eller, mer övertygande saker som show
mig alla som har ordet -

961
00:44:45,880 --> 00:44:49,400
visa mig alla vars namn börjar
med en viss bokstav.

962
00:44:49,400 --> 00:44:51,880
Du kan söka efter nyckelord
på detta sätt.

963
00:44:51,880 --> 00:44:52,630
Okej.

964
00:44:52,630 --> 00:44:55,760
>> Så, möjligheter konstruktions
det potentiellt.

965
00:44:55,760 --> 00:44:57,740
Det finns andra som jag ska
våg mina händer på.

966
00:44:57,740 --> 00:45:00,530
Det visar sig att man kan ha
olika lagringsmotorer.

967
00:45:00,530 --> 00:45:04,390
Och det är mer svårbegriplig än vi behöver
säkert för problem set sju.

968
00:45:04,390 --> 00:45:06,920
Som standard är ni använder
något som kallas InnoDB.

969
00:45:06,920 --> 00:45:10,910
Du ser omnämnande av detta någonstans i
phpMyAdmin gränssnitt troligast.

970
00:45:10,910 --> 00:45:14,130
Men vet att det finns annan konstruktion
beslut som är av potentiellt

971
00:45:14,130 --> 00:45:18,030
intresse kommer slutprojekt om
du gör något webbaserat.

972
00:45:18,030 --> 00:45:19,330
>> Men låt oss göra detta.

973
00:45:19,330 --> 00:45:23,130
Låt oss gå vidare och lägga detta på
skärmen som en teaser för en berättelse

974
00:45:23,130 --> 00:45:26,330
engagera dig, en rumskompis,
och ett glas mjölk.

975
00:45:26,330 --> 00:45:28,240
Låt oss ta en två minuters
eller så bryter här.

976
00:45:28,240 --> 00:45:31,060
Och om du kan stanna kvar, låt oss komma
tillbaka, titta lite mer på SQL, och

977
00:45:31,060 --> 00:45:35,160
sedan en bit av JavaScript med
p-set åtta i åtanke.

978
00:45:35,160 --> 00:45:36,120
>> Okej.

979
00:45:36,120 --> 00:45:40,420
Så, låt oss få dig att tänka på en
hörn fall som kan mycket lätt uppstå

980
00:45:40,420 --> 00:45:44,240
i samband med användning av en databas, eller
ärligt talat, även med hjälp av verkliga saker

981
00:45:44,240 --> 00:45:46,280
som uttagsautomater för att få pengar.

982
00:45:46,280 --> 00:45:47,640
Så här är ett kylskåp.

983
00:45:47,640 --> 00:45:50,040
Anta att du har en också i
din studentrummet eller ditt hus.

984
00:45:50,040 --> 00:45:54,990
Och du har en rumskompis, och båda
du verkligen gillar mjölk till exempel.

985
00:45:54,990 --> 00:45:57,210
>> Så du kommer hem från klass en dag.

986
00:45:57,210 --> 00:45:58,490
Han eller hon är ännu inte tillbaka.

987
00:45:58,490 --> 00:45:59,180
Du öppnar kylen.

988
00:45:59,180 --> 00:46:00,870
Du verkligen vill ha ett stort glas mjölk.

989
00:46:00,870 --> 00:46:01,820
Det finns ingen mjölk.

990
00:46:01,820 --> 00:46:02,920
Så vad gör du?

991
00:46:02,920 --> 00:46:03,840
Du stänger kylskåpet.

992
00:46:03,840 --> 00:46:04,670
Du tar tag i dina nycklar.

993
00:46:04,670 --> 00:46:05,930
Du går ut till torget.

994
00:46:05,930 --> 00:46:09,240
Och du får i kön på CVS på dem
själv kassan saker, som alltid

995
00:46:09,240 --> 00:46:11,180
ta längre tid än vad som faktiskt
med kassörer.

996
00:46:11,180 --> 00:46:11,820
Hur som helst.

997
00:46:11,820 --> 00:46:15,490
>> Alltså, under tiden, dot dot dot, din
rumskompis kommer hem och han eller hon

998
00:46:15,490 --> 00:46:17,440
på samma sätt har en längtan
för lite mjölk.

999
00:46:17,440 --> 00:46:20,380
Så han eller hon öppnar kylen,
ser ut inuti, och åh, fan.

1000
00:46:20,380 --> 00:46:21,160
Ingen mjölk.

1001
00:46:21,160 --> 00:46:24,750
Så han eller hon ger sig ut, råkar gå
till den andra CVS, som var endast en

1002
00:46:24,750 --> 00:46:27,900
blockera bort av någon anledning, och han eller
hon får i kö för att köpa lite mjölk.

1003
00:46:27,900 --> 00:46:30,480
>> Under tiden, du kommer hem, han eller
hon kommer hem, och vad gör

1004
00:46:30,480 --> 00:46:31,980
du i slutändan ha?

1005
00:46:31,980 --> 00:46:33,080
Dubbelt så mycket mjölk.

1006
00:46:33,080 --> 00:46:34,620
Men du egentligen inte gillar
mjölk som mycket.

1007
00:46:34,620 --> 00:46:37,300
Så nu har du så mycket mjölk som nu
en av dem är bara att gå sura

1008
00:46:37,300 --> 00:46:37,820
så småningom.

1009
00:46:37,820 --> 00:46:39,370
Så det här är ett riktigt dåligt problem.

1010
00:46:39,370 --> 00:46:39,900
Rätt?

1011
00:46:39,900 --> 00:46:41,990
>> Så vad har hänt?

1012
00:46:41,990 --> 00:46:44,810
Så i grunden är denna typ
av ett löjligt exempel.

1013
00:46:44,810 --> 00:46:48,580
Men under huven, det som vi har haft
hända här är er båda kontrollerade

1014
00:46:48,580 --> 00:46:52,390
tillståndet för en viss del av
minne, kylskåpet.

1015
00:46:52,390 --> 00:46:54,420
Ni båda kontrollerade staten
av någon variabel.

1016
00:46:54,420 --> 00:46:57,360
Ni båda drog en slutsats
som du sedan agerade på.

1017
00:46:57,360 --> 00:47:01,420
Men tyvärr, när din rumskamrat
var i butiken, tillståndet i det

1018
00:47:01,420 --> 00:47:05,670
variabel förändrats, han eller hon kom tillbaka
och nu vill förändra staten, men

1019
00:47:05,670 --> 00:47:07,480
det har redan ändrats
på honom eller henne.

1020
00:47:07,480 --> 00:47:11,120
Och naturligtvis, skulle han eller hon inte har
gått till affären om de visste

1021
00:47:11,120 --> 00:47:13,010
att du redan på väg.

1022
00:47:13,010 --> 00:47:16,430
>> Så i den verkliga världen, hur kunde du
undvika detta problem, förutsatt att du har

1023
00:47:16,430 --> 00:47:18,940
ett kylskåp, har du en rumskompis,
och du verkligen gillar mjölk?

1024
00:47:18,940 --> 00:47:19,760
>> PUBLIK: Kommunicera.

1025
00:47:19,760 --> 00:47:20,580
>> DAVID MALAN: Kommunicera.

1026
00:47:20,580 --> 00:47:21,160
OK.

1027
00:47:21,160 --> 00:47:22,500
Men hur kan du kommunicera?

1028
00:47:22,500 --> 00:47:23,990
>> PUBLIK: Lämna en anteckning.

1029
00:47:23,990 --> 00:47:25,480
>> DAVID MALAN: Lämna en anteckning, eller hur?

1030
00:47:25,480 --> 00:47:28,025
Lämna alltid en anteckning, för
fans av showen.

1031
00:47:28,025 --> 00:47:31,580
Okej, så alltid lämna ett meddelande, eller
satte verkligen som ett hänglås eller något

1032
00:47:31,580 --> 00:47:35,440
på kylskåpet som håller din
rumskompis från inspekterande staten

1033
00:47:35,440 --> 00:47:36,540
denna variabel.

1034
00:47:36,540 --> 00:47:40,800
>> Nu, varför skulle detta vara relevant för
Problemet satt sju, eller till uttagsautomater.

1035
00:47:40,800 --> 00:47:46,780
Tja, tänk dig en värld i en bankomat där
du kanske kan gå upp till en ATM

1036
00:47:46,780 --> 00:47:48,920
maskin här, och en annan bankomat här.

1037
00:47:48,920 --> 00:47:50,680
Och det händer ganska ofta.

1038
00:47:50,680 --> 00:47:54,150
Och antar att du hade två ATM-kort,
vilket är möjligt att erhålla.

1039
00:47:54,150 --> 00:47:57,420
Och du loggar in båda maskinerna
effektivt samtidigt, förhoppningsvis

1040
00:47:57,420 --> 00:47:58,660
medan ingen tittar.

1041
00:47:58,660 --> 00:48:01,260
Och sedan skriva in din PIN-kod
ungefär samtidigt.

1042
00:48:01,260 --> 00:48:06,280
Och sedan göra en balansfråga
för att se hur mycket pengar du har.

1043
00:48:06,280 --> 00:48:08,920
Och låt oss säga att du har $ 100
kvar på kontot.

1044
00:48:08,920 --> 00:48:13,310
Så i huvudsak samtidigt, du
säger ett, noll, noll, anger.

1045
00:48:13,310 --> 00:48:16,000
Och du förhoppningsvis få tillbaka lite pengar.

1046
00:48:16,000 --> 00:48:18,440
>> Men hur mycket pengar kan du få tillbaka?

1047
00:48:18,440 --> 00:48:21,710
Nu datorer i slutet av dagen,
särskilt om de pratar med

1048
00:48:21,710 --> 00:48:27,360
servrar, inte nödvändigtvis göra saker
i den ordning som förväntas.

1049
00:48:27,360 --> 00:48:30,860
>> Så antar att vad som händer, på grund av
oavsett nätverks frågor hastighet där

1050
00:48:30,860 --> 00:48:34,530
är, eller CPU-frågor finns det, eller
något liknande, anta att

1051
00:48:34,530 --> 00:48:38,530
första ATM kontrollerar ditt saldo och
ser, åh, denna person har $ 100.

1052
00:48:38,530 --> 00:48:41,840
Men sedan blir distraherad eftersom kanske
en säkerhetskopia som händer och så är det

1053
00:48:41,840 --> 00:48:42,500
saktar ner.

1054
00:48:42,500 --> 00:48:45,080
Eller kanske vid kontroll, nätverket
anslutning fick en lite långsammare eftersom

1055
00:48:45,080 --> 00:48:45,910
det händer bara.

1056
00:48:45,910 --> 00:48:47,100
De är fysiska enheter.

1057
00:48:47,100 --> 00:48:49,330
Så under tiden, är den andra ATM
frågar samma fråga.

1058
00:48:49,330 --> 00:48:53,030
Hur mycket pengar David har?
$ 100 är svaret.

1059
00:48:53,030 --> 00:48:58,930
Men eftersom den första ATM har ännu inte
skickade meddelandet subtrahera $ 100, både

1060
00:48:58,930 --> 00:49:03,000
Bankomater har inspekterat bankens valv,
ser att det finns $ 100 där, och nu

1061
00:49:03,000 --> 00:49:07,160
båda maskinerna potentiellt är
kommer att spotta ut ett svar.

1062
00:49:07,160 --> 00:49:12,240
>> Nu är det bra för dig i någon mening
om vad banken gör i slutändan

1063
00:49:12,240 --> 00:49:17,200
är ändra beloppet till minus 100 av
sätta variabeln lika med din

1064
00:49:17,200 --> 00:49:21,570
bankkonto lika med 0, i motsats
att göra minus 100.

1065
00:49:21,570 --> 00:49:24,410
Nu i värsta fall för banken -

1066
00:49:24,410 --> 00:49:27,470
eller i bästa för banken, under tiden,
de ger dig $ 200, och

1067
00:49:27,470 --> 00:49:31,690
ditt bankkonto visar nu negativa
$ 100, som verkligen inte

1068
00:49:31,690 --> 00:49:32,950
gynna dig alls.

1069
00:49:32,950 --> 00:49:36,500
Men poängen är att denna ras
tillstånd för två rumskamrater uppta

1070
00:49:36,500 --> 00:49:40,660
mjölk, eller för två bankomater försöker få pengar
och ändra tillståndet hos ett valv

1071
00:49:40,660 --> 00:49:44,510
samtidigt föreligger någon
gång du har en databas.

1072
00:49:44,510 --> 00:49:48,290
>> Nu i problemet satt sju, denna fråga
uppstår i den meningen att om du köper en

1073
00:49:48,290 --> 00:49:52,110
andel av Facebook lager, och sedan för
exempel du köpa en andra del av

1074
00:49:52,110 --> 00:49:55,160
Facebook lager, måste du göra
ett beslut som programmeraren.

1075
00:49:55,160 --> 00:49:58,710
För att avgöra hur du uppdaterar
databas, oddsen är att du kommer att

1076
00:49:58,710 --> 00:50:02,250
har en rad för detta bestånd, och detta
är ett sätt att genomföra den.

1077
00:50:02,250 --> 00:50:06,640
Och du kommer att ha en andel av
FB, vilket är deras aktiesymbol

1078
00:50:06,640 --> 00:50:10,120
för detta användarnamn, eller denna användare
ID, en unik identifierare.

1079
00:50:10,120 --> 00:50:12,340
>> Men samma historia kan hända här.

1080
00:50:12,340 --> 00:50:15,800
Om du gör en SELECT i SQL, som du ser
i problembild sju när du ser,

1081
00:50:15,800 --> 00:50:18,460
åh, har David en aktie
av Facebook lager.

1082
00:50:18,460 --> 00:50:23,240
Låt mig nu ändra detta till att vara två aktier,
eftersom han vill köpa en

1083
00:50:23,240 --> 00:50:24,120
andra aktie.

1084
00:50:24,120 --> 00:50:27,860
Men antar att David hade faktiskt två
webbläsarfönster öppnas, eller anta att

1085
00:50:27,860 --> 00:50:32,150
det är ett gemensamt konto med två makar,
och båda av dem försöker utföra

1086
00:50:32,150 --> 00:50:36,770
samma operation, där också den
potential för ett beslut om att vara

1087
00:50:36,770 --> 00:50:39,670
görs utifrån den tidigare
tillståndet i världen -

1088
00:50:39,670 --> 00:50:41,290
kontot har en aktie -

1089
00:50:41,290 --> 00:50:45,630
och både människor, eller båda servrarna, nu
försök att säga öka det till två aktier.

1090
00:50:45,630 --> 00:50:49,020
Men i detta fall, kanske du har laddat
mig pengar för båda aktierna, men

1091
00:50:49,020 --> 00:50:50,830
ökas just det en gång.

1092
00:50:50,830 --> 00:50:54,730
>> Så kort sagt, det grundläggande problemet
här, som med skämt om att lämna ett

1093
00:50:54,730 --> 00:50:58,750
notera, eller sätta ett hänglås på det, är
om två personer, eller två trådar -

1094
00:50:58,750 --> 00:50:59,930
tänker tillbaka på scratch -

1095
00:50:59,930 --> 00:51:03,220
kan inspektera tillståndet för en viss variabel
och sedan försöka ändra på det rörliga,

1096
00:51:03,220 --> 00:51:07,950
men dessa två saker inte händer på
samma tid men kan bli avbruten

1097
00:51:07,950 --> 00:51:11,500
av andra saker som händer, uppgifter kan
komma in i en väldigt konstig tillstånd.

1098
00:51:11,500 --> 00:51:15,450
Och du kan dra eller du kan drabbas
i betydelsen av de pengar som exempel.

1099
00:51:15,450 --> 00:51:18,110
>> Så i problem set sju, vi ger dig
detta en rad kod, som länge

1100
00:51:18,110 --> 00:51:21,000
historia kort, löser detta
problem i MySQL.

1101
00:51:21,000 --> 00:51:24,950
Detta mycket lång instruktion som inte
även passar på en linje på

1102
00:51:24,950 --> 00:51:30,370
Skärmen här ser till att din verksamhet
är vad som kallas atom.

1103
00:51:30,370 --> 00:51:33,720
Allt händer på en gång, eller
det händer inte alls.

1104
00:51:33,720 --> 00:51:37,530
Detta mycket lång fras kan inte
får avbrytas delvis.

1105
00:51:37,530 --> 00:51:39,840
>> Och vad den gör är bokstavligen
vad den säger.

1106
00:51:39,840 --> 00:51:44,200
Sätt in en tabell med följande
tre områden dessa specifika värden,

1107
00:51:44,200 --> 00:51:47,280
men den dubbla nyckel,
inte gör en insats.

1108
00:51:47,280 --> 00:51:48,280
Gör en uppdatering.

1109
00:51:48,280 --> 00:51:52,450
Så det här är som att göra en SELECT och en
INSERT så att säga på samma gång.

1110
00:51:52,450 --> 00:51:55,150
Och det är nyckeln som är nog
hänvisas till här?

1111
00:51:55,150 --> 00:51:58,300

1112
00:51:58,300 --> 00:52:01,380
>> Det visar sig, och du kommer att se detta i
Problemet set sju s spec, eftersom

1113
00:52:01,380 --> 00:52:06,040
Vi har förklarat att det finns en unik nyckel
på denna särskilda bord så att

1114
00:52:06,040 --> 00:52:08,480
du kan inte ha flera rader
för samma användare med

1115
00:52:08,480 --> 00:52:10,150
Samma öre aktiesymbol -

1116
00:52:10,150 --> 00:52:13,780
i detta exempel här, är DVN.V
en dum öre lager som vi

1117
00:52:13,780 --> 00:52:14,980
hänvisa till i spec.

1118
00:52:14,980 --> 00:52:17,860
Eftersom vi har förklarat att det är unikt,
Vad detta betyder är att om du

1119
00:52:17,860 --> 00:52:23,580
Försök att sätta in en dubblett rad, du
istället kommer att uppdatera den utan

1120
00:52:23,580 --> 00:52:27,020
någon annan som har en chans att förändra
tillståndet i världen heller.

1121
00:52:27,020 --> 00:52:29,400
Så kort sagt, säkerställer detta
saker är atom.

1122
00:52:29,400 --> 00:52:32,530
>> Mer allmänt though, databaser
som MySQL -

1123
00:52:32,530 --> 00:52:35,460
och du inte behöver den här funktionen för
p-set sju, men ha det i åtanke för

1124
00:52:35,460 --> 00:52:36,200
framtiden -

1125
00:52:36,200 --> 00:52:38,870
stödja så kallade transaktioner,
där du kan säga

1126
00:52:38,870 --> 00:52:40,990
START TRANSbokstavligen.

1127
00:52:40,990 --> 00:52:43,270
Du kan sedan köra
två SQL-satser.

1128
00:52:43,270 --> 00:52:45,710
Och en SQL-sats, som du ser
i p-set sju, ser lite

1129
00:52:45,710 --> 00:52:46,750
ungefär så här.

1130
00:52:46,750 --> 00:52:48,820
Uppdatera en tabell som heter konto.

1131
00:52:48,820 --> 00:52:52,550
Ställ in balansen kolumnen motsvarar vad
balansen kolumnen för närvarande

1132
00:52:52,550 --> 00:52:57,280
är minus 1,000 där antalet, den
kontonummer, som användar-ID,

1133
00:52:57,280 --> 00:53:00,830
är lika med 2, och sedan uppdatera
konto dot dot dot.

1134
00:53:00,830 --> 00:53:04,350
>> Så i lekmannatermer, vad gör dessa två
frågor verkar göra i

1135
00:53:04,350 --> 00:53:05,840
verkliga världen känsla av bank?

1136
00:53:05,840 --> 00:53:07,440
>> PUBLIK: Överföra till besparingar.

1137
00:53:07,440 --> 00:53:08,020
>> DAVID MALAN: Exakt.

1138
00:53:08,020 --> 00:53:10,470
Överföring av medel från en
konto till den andra.

1139
00:53:10,470 --> 00:53:14,400
Och här är ett annat exempel där man
verkligen vill att dessa två saker att hända

1140
00:53:14,400 --> 00:53:15,570
eller inte hända.

1141
00:53:15,570 --> 00:53:18,880
Du vill inte något att komma i
mitten av dem och potentiellt förstöra

1142
00:53:18,880 --> 00:53:22,220
matten, eller röra upp hur mycket
pengar du har, eller hur mycket

1143
00:53:22,220 --> 00:53:23,170
pengar banken har.

1144
00:53:23,170 --> 00:53:26,890
Så vad är riktigt nice om transaktioner
i MySQL är det, och

1145
00:53:26,890 --> 00:53:30,160
databaser mer allmänt, är att de
och smarta människor som har genomförts

1146
00:53:30,160 --> 00:53:33,670
dessa funktioner lista ut hur man gör
Se till att båda dessa saker hända

1147
00:53:33,670 --> 00:53:35,120
eller inte alls.

1148
00:53:35,120 --> 00:53:38,580
>> Och om du verkligen strävar efter att göra
en webbplats som används av människor på

1149
00:53:38,580 --> 00:53:41,490
campus, människor i den verkliga världen, gör
något i start bemärkelse,

1150
00:53:41,490 --> 00:53:43,300
det är dessa typer av
designbeslut som

1151
00:53:43,300 --> 00:53:45,020
blir aldrig så viktigt.

1152
00:53:45,020 --> 00:53:48,240
Annars börjar du att förlora data, förlorar
användare, eller i värsta fall som

1153
00:53:48,240 --> 00:53:51,800
vi har sett här, potentiellt
förlora pengar.

1154
00:53:51,800 --> 00:53:56,180
Så återigen, mer om det i problembild
sju, samt kanske för en del av

1155
00:53:56,180 --> 00:53:57,530
du i slutprojekt.

1156
00:53:57,530 --> 00:54:01,870
>> Så låt oss ändra den bilden vi hade
nyss bara på ytterligare ett sätt.

1157
00:54:01,870 --> 00:54:04,070
Så låt mig faktiskt se om jag kan -

1158
00:54:04,070 --> 00:54:06,030
nope, det är borta.

1159
00:54:06,030 --> 00:54:06,690
Där är det.

1160
00:54:06,690 --> 00:54:09,020
>> Så det är där vi slutade förra gången.

1161
00:54:09,020 --> 00:54:12,390
Och det visar sig att vi kommer att kasta
en sak i mixen här -

1162
00:54:12,390 --> 00:54:14,510
ett språk som kallas Javascript.

1163
00:54:14,510 --> 00:54:18,060
Så JavaScript faktiskt passar
i detta stycke -

1164
00:54:18,060 --> 00:54:22,086
och jag hade inte riktigt tillräckligt med utrymme,
så det är inte nu i skala.

1165
00:54:22,086 --> 00:54:23,900
OK, detta är verkligen patetiskt.

1166
00:54:23,900 --> 00:54:27,075
OK, så det är JavaScript.

1167
00:54:27,075 --> 00:54:27,340
Okej.

1168
00:54:27,340 --> 00:54:28,760
Jag verkligen gör det en björntjänst.

1169
00:54:28,760 --> 00:54:29,390
Okej.

1170
00:54:29,390 --> 00:54:34,790
>> Så JavaScript är en annan programmering
språk, och vår sista, om det hjälper

1171
00:54:34,790 --> 00:54:37,770
försäkra att det finns inte mycket mer
av brandposter här.

1172
00:54:37,770 --> 00:54:41,100
Så JavaScript är också ett tolkat
språk, vilket innebär att du inte

1173
00:54:41,100 --> 00:54:42,670
sammanställa det i ettor och nollor.

1174
00:54:42,670 --> 00:54:43,690
Du kör bara det.

1175
00:54:43,690 --> 00:54:47,680
Men vad är fundamentalt annorlunda med
JavaScript oftast är att du

1176
00:54:47,680 --> 00:54:49,815
inte köra det på din webbserver.

1177
00:54:49,815 --> 00:54:52,570
Det blir inte köras i
Apparaten i sig.

1178
00:54:52,570 --> 00:54:57,490
Snarare blir det hämtas av en användare
via HTTP i sin webbläsare -

1179
00:54:57,490 --> 00:55:00,260
Chrome, Safari, Internet Explorer,
Firefox, vad som helst -

1180
00:55:00,260 --> 00:55:03,860
och det är den webbläsare som utför detta
visst programmeringsspråk.

1181
00:55:03,860 --> 00:55:08,000
>> Så för att vara tydlig, PHP hittills varit
utförs antingen på kommandoraden i

1182
00:55:08,000 --> 00:55:11,290
vår svarta och vita fönster, på en server
liknande apparaten en dator

1183
00:55:11,290 --> 00:55:14,490
gillar apparaten, eller det har varit
exekveras av en webbserver

1184
00:55:14,490 --> 00:55:15,860
körs på en dator.

1185
00:55:15,860 --> 00:55:20,490
Men temat här är att PHP hittills
har utförts på serversidan, så

1186
00:55:20,490 --> 00:55:24,820
användaren och användarens webbläsare
aldrig ser en rad av PHP-kod.

1187
00:55:24,820 --> 00:55:28,530
>> Faktum är att om du någonsin öppna en webbläsare för
annan din webbplats eller och du

1188
00:55:28,530 --> 00:55:32,400
faktiskt se PHP-kod i ditt fönster,
någon har skruvas upp.

1189
00:55:32,400 --> 00:55:34,950
Eftersom det inte är tänkt att vara
skickas till en webbläsare direkt.

1190
00:55:34,950 --> 00:55:38,150
Det är tänkt att utföras och vände
till något som HTML.

1191
00:55:38,150 --> 00:55:40,120
>> Men JavaScript är huvudsakligen
tvärtom.

1192
00:55:40,120 --> 00:55:44,350
Det är tänkt att köras normalt inne
av användarens webbläsarfönster.

1193
00:55:44,350 --> 00:55:46,840
Och vilka typer av webbplatser använder
JavaScript då dessa dagar?

1194
00:55:46,840 --> 00:55:49,640

1195
00:55:49,640 --> 00:55:52,180
>> Som bokstavligen varje populära hemsidan.

1196
00:55:52,180 --> 00:55:55,430
Varje webbplats som ni antagligen
använder dagligen använder JavaScript för

1197
00:55:55,430 --> 00:55:57,330
enklaste och även den
sexigaste funktionerna.

1198
00:55:57,330 --> 00:55:59,800
>> Så något liknande Facebook
Chatta om du använder det.

1199
00:55:59,800 --> 00:56:01,040
Hur fungerar det egentligen?

1200
00:56:01,040 --> 00:56:05,090
Väl hittills, alla de saker vi har
gjort med HTML och PHP förutsätter att

1201
00:56:05,090 --> 00:56:08,750
du drar upp en URL, och du trycker Enter,
och du ser några HTML-innehåll.

1202
00:56:08,750 --> 00:56:11,970
Och du klickar på länken, som ändrar
URL, ändras på sidan och omladdningar

1203
00:56:11,970 --> 00:56:12,740
lite nytt innehåll.

1204
00:56:12,740 --> 00:56:16,340
Klicka på en annan webbadress eller skicka ett formulär, du
får forslas till en annan sida och

1205
00:56:16,340 --> 00:56:17,420
du se några nya innehållet.

1206
00:56:17,420 --> 00:56:22,710
>> Men med hjälp av något som Facebook Chat,
eller Gchat, eller Google Maps, sällan

1207
00:56:22,710 --> 00:56:27,350
gör hela sidan uppdateras så att
du ser en vit skärm ett kort ögonblick och

1208
00:56:27,350 --> 00:56:28,470
sedan nytt innehåll.

1209
00:56:28,470 --> 00:56:32,610
Snarare webbsidor idag är dynamiskt
få uppdaterad igen och

1210
00:56:32,610 --> 00:56:35,570
igen och igen alla slags
av bakom kulisserna.

1211
00:56:35,570 --> 00:56:38,560
Och det visar sig att när du går till
något som Facebook, eller Gchat,

1212
00:56:38,560 --> 00:56:43,050
eller Gmail, och uppdateras sidan
automatiskt utan att ladda om

1213
00:56:43,050 --> 00:56:47,630
hela skärmen, vad som har hänt är att
din webbläsare har gjort slags hemlighet

1214
00:56:47,630 --> 00:56:49,410
ytterligare HTTP-förfrågningar -

1215
00:56:49,410 --> 00:56:52,740
inte för hela webbsidor, men bara för
små bitar av data, såsom

1216
00:56:52,740 --> 00:56:55,740
snabbmeddelande om att din vän bara
skickade dig, eller statusuppdateringen som

1217
00:56:55,740 --> 00:56:58,210
någon precis skickat, eller tweet
att någon precis skickat.

1218
00:56:58,210 --> 00:57:02,120
Det är bara att göra lite förfrågningar om
uppgifter, och sedan med hjälp av JavaScript, detta

1219
00:57:02,120 --> 00:57:06,370
programmeringsspråk, för att ändra det
webbsidan ser ut utan

1220
00:57:06,370 --> 00:57:09,860
server att hjälpa, utan servern
som result HTML.

1221
00:57:09,860 --> 00:57:13,820
>> Så kort sagt, kan JavaScript användas då
att inte bara hämta nya data från

1222
00:57:13,820 --> 00:57:16,750
servern utan att ladda om hela
sidan eller skicka in ett formulär.

1223
00:57:16,750 --> 00:57:20,060
Den kan också användas för att ändra
den så kallade DOM -

1224
00:57:20,060 --> 00:57:21,520
Document Object Model -

1225
00:57:21,520 --> 00:57:24,620
vilket är precis det finare sätt för
säger träd HTML

1226
00:57:24,620 --> 00:57:26,220
som vi såg förra gången.

1227
00:57:26,220 --> 00:57:31,640
>> Så för att lugna, är JavaScript
syntaktiskt så liknar C också.

1228
00:57:31,640 --> 00:57:32,820
Det finns ingen huvudfunktion.

1229
00:57:32,820 --> 00:57:35,430
Du börjar bara skriva koden
och det kommer att bli avrättade, eller

1230
00:57:35,430 --> 00:57:36,900
tolkas mer korrekt.

1231
00:57:36,900 --> 00:57:38,660
Villkor kommer att se ut så här.

1232
00:57:38,660 --> 00:57:41,230
Ingen annan än C eller
PHP för den delen.

1233
00:57:41,230 --> 00:57:43,890
Booleska uttryck eller-ed tillsammans
kommer att se ut så här.

1234
00:57:43,890 --> 00:57:45,590
-Behandlas tillsammans se ut så här.

1235
00:57:45,590 --> 00:57:47,750
>> Växlar kommer se ut så här.

1236
00:57:47,750 --> 00:57:49,440
För slingor kommer att se ut så här.

1237
00:57:49,440 --> 00:57:51,060
Medan slingor kommer se ut så här.

1238
00:57:51,060 --> 00:57:53,316
Gör medan slingorna kommer se ut så här.

1239
00:57:53,316 --> 00:57:54,780
>> Detta är nytt.

1240
00:57:54,780 --> 00:57:58,753
Så JavaScript har inte en foreach
konstruera per se, men denna konstruktion

1241
00:57:58,753 --> 00:58:03,870
för variabel i i matrisen, och jag i detta
fall blir ett indexvärde.

1242
00:58:03,870 --> 00:58:06,880
Så det är lite annorlunda från det
foreach, även nya versioner av

1243
00:58:06,880 --> 00:58:10,280
JavaScript kommer ut hela tiden,
så även dessa språkfunktioner

1244
00:58:10,280 --> 00:58:10,880
utvecklas.

1245
00:58:10,880 --> 00:58:16,920
>> Och som en sidoreplik, JavaScript dessa dagar
kan också användas på en server precis som

1246
00:58:16,920 --> 00:58:19,920
PHP med hjälp av ett ramverk som kallas Node.js.

1247
00:58:19,920 --> 00:58:24,670
En av CS50 s TF, Kevin, har lett en
seminarium om Node.js som är tillgänglig på

1248
00:58:24,670 --> 00:58:26,440
cs50.net/seminars.

1249
00:58:26,440 --> 00:58:28,830
Så om du är nyfiken, vet att du
kan använda detta på serversidan som

1250
00:58:28,830 --> 00:58:33,870
väl, men det är en ganska ny trend,
men en kraftfull sådan.

1251
00:58:33,870 --> 00:58:35,270
>> Det här är lite annorlunda.

1252
00:58:35,270 --> 00:58:37,910
Detta är en array i JavaScript.

1253
00:58:37,910 --> 00:58:40,115
Och det som slår dig så olika
kontra C eller PHP?

1254
00:58:40,115 --> 00:58:43,890

1255
00:58:43,890 --> 00:58:47,420
Det finns några snabba historier
Vi kan tala om här.

1256
00:58:47,420 --> 00:58:49,367
Det som saknas jämfört med PHP?

1257
00:58:49,367 --> 00:58:51,652
>> PUBLIK: [OHÖRBAR].

1258
00:58:51,652 --> 00:58:52,110
>> DAVID MALAN: Ja?

1259
00:58:52,110 --> 00:58:53,322
Tyvärr, säger igen?

1260
00:58:53,322 --> 00:58:54,740
>> PUBLIK: Inte förklara
typen av variabel.

1261
00:58:54,740 --> 00:58:56,390
>> DAVID MALAN: Vi ska inte förklara
typen av variabel.

1262
00:58:56,390 --> 00:58:59,630
Så faktiskt ganska som PHP, är vi inte
beskriva olika kategorier av denna variabel.

1263
00:58:59,630 --> 00:59:02,670
Snarare är vi mer allmänt
säger var för variabel.

1264
00:59:02,670 --> 00:59:06,690
Vi har inte PHP: s olägenhet av
dollartecken, vilket samtidigt jobbigt att

1265
00:59:06,690 --> 00:59:09,160
typ, gör mer klart att
något som är en variabel.

1266
00:59:09,160 --> 00:59:11,830
Av följande skäl: här är vi slags tillbaka till
C: s strategi genom att bara ringa ett

1267
00:59:11,830 --> 00:59:14,500
variabel med namnet vi vill
för att ge det, som siffror.

1268
00:59:14,500 --> 00:59:17,170
Och även som PHP, vi har
hakparenteser för

1269
00:59:17,170 --> 00:59:19,170
värden inuti som matris.

1270
00:59:19,170 --> 00:59:22,490
>> Så variabler i JavaScript också
skulle kunna se ut så här.

1271
00:59:22,490 --> 00:59:26,900
Lägg märke till här är en sträng som kallas s,
men på samma sätt har vi inte specificerat

1272
00:59:26,900 --> 00:59:28,750
att det är en sträng.

1273
00:59:28,750 --> 00:59:33,160
Här är dock en funktion som inte
existerar på exakt samma sätt i PHP,

1274
00:59:33,160 --> 00:59:34,460
men lite på liknande sätt.

1275
00:59:34,460 --> 00:59:36,530
Detta är ett objekt i JavaScript.

1276
00:59:36,530 --> 00:59:42,110
Och föremål är slags den schweiziska armén
Kniven av en datastruktur i att man

1277
00:59:42,110 --> 00:59:43,900
kan använda dem för en rad olika saker.

1278
00:59:43,900 --> 00:59:46,860
>> Här, till exempel, vi förklara
en variabel som heter citat.

1279
00:59:46,860 --> 00:59:49,110
Typen av den variabeln
Ett ändamål.

1280
00:59:49,110 --> 00:59:53,550
Du kan se det som en C-struct
som har nycklar och värden.

1281
00:59:53,550 --> 00:59:55,250
Symbol är en nyckel.

1282
00:59:55,250 --> 00:59:57,350
FB är ett värde, till synes
en aktiesymbol.

1283
00:59:57,350 --> 00:59:57,930
Kommatecken.

1284
00:59:57,930 --> 01:00:02,180
Priset är en annan nyckel, och dess värde är
tydligen ett flyttal, eller en

1285
01:00:02,180 --> 01:00:06,510
antal mer allmänt i
JavaScript, på $ 49,26.

1286
01:00:06,510 --> 01:00:09,030
>> Så PHP inte har -

1287
01:00:09,030 --> 01:00:12,980
Vi har inte sett i PHP-objekt helt
så här, men vi såg en analog,

1288
01:00:12,980 --> 01:00:14,093
vilket var vad?

1289
01:00:14,093 --> 01:00:14,980
>> PUBLIK: [OHÖRBAR].

1290
01:00:14,980 --> 01:00:16,110
>> DAVID MALAN: Associativa arrayer.

1291
01:00:16,110 --> 01:00:19,990
Så medan PHP har associativa arrayer
vars syntax är aldrig något så

1292
01:00:19,990 --> 01:00:20,370
annorlunda -

1293
01:00:20,370 --> 01:00:21,780
vi såg hakparenteserna.

1294
01:00:21,780 --> 01:00:23,860
Vi såg konstiga pilar symboler.

1295
01:00:23,860 --> 01:00:27,330
JavaScript har objekt, men detta är
mestadels en semantisk skillnad och en

1296
01:00:27,330 --> 01:00:29,260
annan synonym för nu.

1297
01:00:29,260 --> 01:00:35,060
Men, som en sidoreplik, har PHP också
Objekten i ett sätt som Java och andra

1298
01:00:35,060 --> 01:00:37,810
språk har föremål i
objektorienterad programmering.

1299
01:00:37,810 --> 01:00:40,440
Men vi kommer att använda dessa bara
för datatyper för nu.

1300
01:00:40,440 --> 01:00:42,170
Objekt och associativa arrayer.

1301
01:00:42,170 --> 01:00:44,140
>> Detta skulle man kunna göra det
lite mer tydlig.

1302
01:00:44,140 --> 01:00:45,890
Här är varför ett objekt är användbart.

1303
01:00:45,890 --> 01:00:48,760
När du vill deklarera en student,
som Zamyla, vi kan faktiskt

1304
01:00:48,760 --> 01:00:52,630
kapsla in så att säga inne i det
objekt med klamrar precis som

1305
01:00:52,630 --> 01:00:55,060
innan en hel nyckelknippa
och värderingar i här.

1306
01:00:55,060 --> 01:00:59,150
Vi har ett ID, ett hus, och ett namn
Zamyla, följt av ett semikolon som

1307
01:00:59,150 --> 01:01:00,690
vanligt i slutet.

1308
01:01:00,690 --> 01:01:04,840
>> Här nere är också detta något
olika, men också mycket kraftfulla

1309
01:01:04,840 --> 01:01:05,690
dessa dagar.

1310
01:01:05,690 --> 01:01:08,780
Här är en matris, och jag vet att eftersom
det finns en hakparentes upp

1311
01:01:08,780 --> 01:01:11,090
topp och en hakparentes
vid bottnen.

1312
01:01:11,090 --> 01:01:16,050
Och detta är en samling av vilka data
skriver tydligen i JavaScript?

1313
01:01:16,050 --> 01:01:21,260
Detta är en samling av det ser
som tre objekt.

1314
01:01:21,260 --> 01:01:24,580
Och jag vet att det är ett objekt bara
grund av klammerparenteser.

1315
01:01:24,580 --> 01:01:28,760
Och märker att det finns öppen klammerparentes,
vissa grejer, nära klammerparentes, kommatecken,

1316
01:01:28,760 --> 01:01:31,180
sedan lite mer, kommatecken,
och sedan lite mer.

1317
01:01:31,180 --> 01:01:33,800
Så det är tre argument
åtskilda av två kommatecken.

1318
01:01:33,800 --> 01:01:36,810
>> Så detta är en array med tre objekt.

1319
01:01:36,810 --> 01:01:39,940
Och var och en av dessa objekt verkar vara
en student eller anställd av någon

1320
01:01:39,940 --> 01:01:42,370
sortera, var och en med ett ID,
hus, och namn.

1321
01:01:42,370 --> 01:01:45,060
Men jag har kallat detta något
kallas JSON -

1322
01:01:45,060 --> 01:01:47,450
JavaScript Object Notation.

1323
01:01:47,450 --> 01:01:52,060
Och detta är ett dataformat som faktiskt
är så mycket populär och i

1324
01:01:52,060 --> 01:01:55,100
vogue dessa dagar att om du skriver en
program som använder Facebook

1325
01:01:55,100 --> 01:01:59,150
API, Twitter API, egentligen nästan
någon API ute dessa dagar,

1326
01:01:59,150 --> 01:02:02,820
inklusive några av CS50 egen, den
data du får tillbaka är inte i

1327
01:02:02,820 --> 01:02:04,720
old school CSV-format.

1328
01:02:04,720 --> 01:02:06,780
>> Eftersom återkallelse som CSV
är super enkelt.

1329
01:02:06,780 --> 01:02:10,230
Det är bara kolumner separeras
med kommatecken.

1330
01:02:10,230 --> 01:02:13,190
JSON uppgifter ger dig mer metadata.

1331
01:02:13,190 --> 01:02:17,800
Det associerar en nyckel med varje värde så
De behöver inte bara anta att

1332
01:02:17,800 --> 01:02:22,460
den nollte kolumnen är ett värde, kolumn
en är en annan, är kolumn två varandra.

1333
01:02:22,460 --> 01:02:26,790
Allt i ett JSON objekt är här sortens
av självbeskrivande, eftersom varje

1334
01:02:26,790 --> 01:02:30,940
ett av namnen i den här filen har bokstavligen
namn framför det som en

1335
01:02:30,940 --> 01:02:32,510
citerade strängen.

1336
01:02:32,510 --> 01:02:34,950
>> Så låt oss ta en titt på en
några exempel här.

1337
01:02:34,950 --> 01:02:36,800
Låt mig gå in i apparaten.

1338
01:02:36,800 --> 01:02:41,000
Och låt mig gå in på vår vhost
katalog till allmänheten.

1339
01:02:41,000 --> 01:02:45,590
Och låt mig gå in i
JavaScript katalogen.

1340
01:02:45,590 --> 01:02:49,610
Och låt oss gå vidare och öppna upp
dom-0.html, där DOM betyder bara

1341
01:02:49,610 --> 01:02:51,010
Document Object Model.

1342
01:02:51,010 --> 01:02:53,490
Det är trädet grejer som
Jag hänvisade till tidigare.

1343
01:02:53,490 --> 01:02:54,950
>> Och låt mig föreslå följande.

1344
01:02:54,950 --> 01:02:57,720
Här är en webbsida vars
kroppen är ganska enkel.

1345
01:02:57,720 --> 01:03:00,170
Så här nere på botten,
märker jag har ett formulär.

1346
01:03:00,170 --> 01:03:01,500
Vi har sett dem förut.

1347
01:03:01,500 --> 01:03:07,600
Den har två ingångar, en av vilka har en
ID av namn, varav en har en typ av

1348
01:03:07,600 --> 01:03:09,830
lämna, och den första
ens typ är text.

1349
01:03:09,830 --> 01:03:11,900
Så här låter faktiskt ganska enkelt.

1350
01:03:11,900 --> 01:03:13,090
>> Låt oss gå hit.

1351
01:03:13,090 --> 01:03:15,390
Låt oss gå tillbaka till den här sidan här.

1352
01:03:15,390 --> 01:03:21,030
Låt oss gå in localhost, och gå in i
vår JavaScript katalog, och gå till

1353
01:03:21,030 --> 01:03:24,640
dom-0, och här har vi det här formuläret.

1354
01:03:24,640 --> 01:03:26,550
Så det är tydligen
all denna sidan gör.

1355
01:03:26,550 --> 01:03:28,740
Den har ett namn fält med
en Skicka-knapp.

1356
01:03:28,740 --> 01:03:30,340
Men jag tänker inte använda PHP här.

1357
01:03:30,340 --> 01:03:34,310
Jag kommer att göra sidan allt klient
så att säga i JavaScript som följer.

1358
01:03:34,310 --> 01:03:39,100
>> Lägg märke till att jag faktiskt har fått namnet
området för denna ingång en unik

1359
01:03:39,100 --> 01:03:42,350
identifierare, som faktiskt kommer att
rädda mig någon gång i en stund.

1360
01:03:42,350 --> 01:03:45,480
Och märker har jag infört en annan etikett
i huvudet på min hemsida, den

1361
01:03:45,480 --> 01:03:46,565
 tag.

1362
01:03:46,565 --> 01:03:50,120
>> Så det är i denna mening att JavaScript är
en klientsidan programmeringsspråk.

1363
01:03:50,120 --> 01:03:55,020
I det här fallet, precis som CSS, har jag lagt
det rakt insidan av min HTML.

1364
01:03:55,020 --> 01:03:58,810
Men märker jag har förklarat en funktion
som ser lite ut som PHP

1365
01:03:58,810 --> 01:04:01,530
syntaktiskt, men detta är faktiskt
JavaScript, eftersom igen, det är

1366
01:04:01,530 --> 01:04:03,920
klientsidan i webbläsaren.

1367
01:04:03,920 --> 01:04:07,590
Och ta en gissa vad detta kommer att
göra, även om vissa av syntaxen

1368
01:04:07,590 --> 01:04:09,338
här är nya.

1369
01:04:09,338 --> 01:04:11,760
>> Publik: Säg hej till vem.

1370
01:04:11,760 --> 01:04:14,020
>> DAVID MALAN: Det kommer att säga hej
till den som besöker den här sidan.

1371
01:04:14,020 --> 01:04:15,120
Så hur?

1372
01:04:15,120 --> 01:04:18,070
>> Så varsel, visar det sig i JavaScript
det finns en varning () funktionen.

1373
01:04:18,070 --> 01:04:22,840
Detta är en väldigt sorts sorgligt funktion som
verkligen tenderar bara att irritera användarna.

1374
01:04:22,840 --> 01:04:25,440
Det är inte något du verkligen bör använda
typiskt, men det är en snabb och smutsig

1375
01:04:25,440 --> 01:04:27,710
sätt slags skriva något
till ett grafiskt användargränssnitt

1376
01:04:27,710 --> 01:04:29,180
gränssnitt, som en webbläsare.

1377
01:04:29,180 --> 01:04:31,400
Lägg märke till här att jag har fått en
sträng inom enkla citattecken.

1378
01:04:31,400 --> 01:04:36,010
Det visar sig att till skillnad från C, JavaScript
kan faktiskt ha dig använda enkel

1379
01:04:36,010 --> 01:04:38,730
citat, och ärligt talat är det bara typ
av den stilistiska konventionen bland

1380
01:04:38,730 --> 01:04:41,180
JavaScript programmerare
att använda enkla citattecken.

1381
01:04:41,180 --> 01:04:43,750
PHP, har de faktiskt en aning
olika innebörd.

1382
01:04:43,750 --> 01:04:45,810
Men för nu, vet bara att
det är den enda anledningen.

1383
01:04:45,810 --> 01:04:49,270
Konventionen i JavaScript är ofta
Använd apostrof, men vi skulle kunna använda

1384
01:04:49,270 --> 01:04:50,950
citationstecken på båda ställena liksom.

1385
01:04:50,950 --> 01:04:52,610
>> Så det här är intressant.

1386
01:04:52,610 --> 01:04:56,430
Minns förra gången som vi hade att
bild på skärmen som drog ett träd

1387
01:04:56,430 --> 01:04:59,720
där du hade HTML noden, och
huvud nod, och kroppen noden,

1388
01:04:59,720 --> 01:05:00,800
och lite text.

1389
01:05:00,800 --> 01:05:04,700
Men det fanns en speciell nod på
toppen att jag ringde dokumentet.

1390
01:05:04,700 --> 01:05:08,260
Tja, det visar sig i JavaScript, något
gång du skriver ett program i JavaScript

1391
01:05:08,260 --> 01:05:11,040
i en webbläsare, har du tillgång till
en särskild global variabel.

1392
01:05:11,040 --> 01:05:14,130
I samma anda som PHP: s superglobals,
denna kallas i

1393
01:05:14,130 --> 01:05:16,050
gemener dokument.

1394
01:05:16,050 --> 01:05:21,480
>> Det är som en struct, men detta struct
också har funktioner inne i det.

1395
01:05:21,480 --> 01:05:23,790
Så ett C struct har bara data normalt.

1396
01:05:23,790 --> 01:05:29,060
Men ett JavaScript-objekt eftersom detta
tekniskt också har funktioner,

1397
01:05:29,060 --> 01:05:31,830
annars känd som metoder,
inne i den.

1398
01:05:31,830 --> 01:05:35,750
Och du kan ringa en funktion inuti
detta objekt bokstavligen gör sitt

1399
01:05:35,750 --> 01:05:39,610
namn, prick, och sedan namnet på
funktionen, eller igen metod.

1400
01:05:39,610 --> 01:05:41,160
Det är bara en synonym, egentligen.

1401
01:05:41,160 --> 01:05:42,450
>> Och vad gör den här funktionen?

1402
01:05:42,450 --> 01:05:43,840
Du kan typ av gissning från sitt namn.

1403
01:05:43,840 --> 01:05:45,590
Få inslag av ID.

1404
01:05:45,590 --> 01:05:50,040
Så detta kommer att söka på webbsidan,
söka det trädet, söker

1405
01:05:50,040 --> 01:05:55,210
oavsett nod, AKA inslag, har en
unikt ID för offert unquote namn.

1406
01:05:55,210 --> 01:05:56,560
Och vad ska jag göra?

1407
01:05:56,560 --> 01:06:00,350
Jag kommer att få värdet inuti
som nod i trädet, och jag kommer

1408
01:06:00,350 --> 01:06:02,580
att på något sätt säga hej till det namnet.

1409
01:06:02,580 --> 01:06:05,360
>> Så ta en gissning, även om vi har inte
sett detta ännu, vad gör det plus

1410
01:06:05,360 --> 01:06:07,396
symbolerna betyder här och här förmodligen?

1411
01:06:07,396 --> 01:06:08,230
>> PUBLIK: Sammanfoga.

1412
01:06:08,230 --> 01:06:09,220
>> DAVID MALAN: Sammanfoga.

1413
01:06:09,220 --> 01:06:11,290
Rätt, och dessa är bara
sorts designbeslut

1414
01:06:11,290 --> 01:06:12,280
folk gjorde år sedan.

1415
01:06:12,280 --> 01:06:15,190
I PHP, du sammanfoga
saker med prickar.

1416
01:06:15,190 --> 01:06:18,800
I C, hoppar du genom flera hoops och
kalla funktioner som strCopyDatabaseOK () eller

1417
01:06:18,800 --> 01:06:20,600
strcat () eller andra sådana funktioner.

1418
01:06:20,600 --> 01:06:22,060
Men i JavaScript, använder du plus.

1419
01:06:22,060 --> 01:06:24,770
Så det här är bara sammanfoga
tre strängar -

1420
01:06:24,770 --> 01:06:27,850
hej, ett namn, och sedan
ett utropstecken.

1421
01:06:27,850 --> 01:06:30,390
>> Så när och varför är denna funktion
heter men?

1422
01:06:30,390 --> 01:06:33,150
Tja, ta en gissning från
HTML längst ner.

1423
01:06:33,150 --> 01:06:35,810
Varför hälsar () anropas eller när?

1424
01:06:35,810 --> 01:06:39,730

1425
01:06:39,730 --> 01:06:44,030
>> Tydligen så gott jag kan berätta, om
in, då detta formuläret skickas,

1426
01:06:44,030 --> 01:06:47,200
Jag kommer att göra vad som
Insidan av dessa citat.

1427
01:06:47,200 --> 01:06:50,900
Och speciellt, jag ska ringa
hälsar () och sedan returnera false.

1428
01:06:50,900 --> 01:06:53,090
>> Nåväl, låt oss se vad nätet
Effekten här är först.

1429
01:06:53,090 --> 01:06:58,290
Så låt mig gå vidare och skriva
i, säg, Loren, Submit.

1430
01:06:58,290 --> 01:06:59,440
Hej Loren.

1431
01:06:59,440 --> 01:07:02,990
Låt oss se om kanske det var bara
en lycklig genomförande.

1432
01:07:02,990 --> 01:07:03,200
Nope.

1433
01:07:03,200 --> 01:07:05,990
Så det är att skriva ut vad
namnge jag faktiskt lagt där.

1434
01:07:05,990 --> 01:07:07,970
>> Men märker vad som inte förändras.

1435
01:07:07,970 --> 01:07:10,360
Webbadressen är fortfarande dom-0.html.

1436
01:07:10,360 --> 01:07:11,820
Det finns ingen register.php.

1437
01:07:11,820 --> 01:07:13,110
Det finns ingen andra filen.

1438
01:07:13,110 --> 01:07:14,930
Det finns ingen handling attribut.

1439
01:07:14,930 --> 01:07:19,720
Så vad är denna återgång falskt
förmodligen gör?

1440
01:07:19,720 --> 01:07:23,660
Varför jag kallar hälsar () och sedan
vänder falsk förmodligen?

1441
01:07:23,660 --> 01:07:26,420
Vad som normalt händer när du klickar på
Skicka ett formulär att även vi har

1442
01:07:26,420 --> 01:07:27,854
sett under den senaste veckan?

1443
01:07:27,854 --> 01:07:29,900
>> PUBLIK: [OHÖRBAR].

1444
01:07:29,900 --> 01:07:30,860
>> DAVID MALAN: Det går någonstans, eller hur?

1445
01:07:30,860 --> 01:07:32,720
Det går till viss destinationsadress.

1446
01:07:32,720 --> 01:07:34,120
Men jag vill inte att det ska ske här.

1447
01:07:34,120 --> 01:07:37,620
Jag vill att min webbsida för att vara helt
dynamik som Gmail, där när du är

1448
01:07:37,620 --> 01:07:38,650
det, du stannar där.

1449
01:07:38,650 --> 01:07:42,900
Adressen ändras inte på ett sätt som
visar hela sidan laddar om.

1450
01:07:42,900 --> 01:07:46,680
Snarare, jag vill bara ändra något
som att skriva ut något

1451
01:07:46,680 --> 01:07:48,320
här på skärmen.

1452
01:07:48,320 --> 01:07:49,630
>> Nåväl låt mig rengöra
upp lite.

1453
01:07:49,630 --> 01:07:55,370
Jag öppnar inte dom-0, men
låt mig öppna upp dom-2.

1454
01:07:55,370 --> 01:07:57,350
Bara så du har sett några syntax här.

1455
01:07:57,350 --> 01:08:02,080
>> Det visar sig att det som vi just
gjorde använder rå JavaScript.

1456
01:08:02,080 --> 01:08:04,420
Så det här är verkligen det språk
JavaScript.

1457
01:08:04,420 --> 01:08:07,340
Några av er kanske känner till
ett bibliotek som heter jQuery.

1458
01:08:07,340 --> 01:08:09,980
>> Så jQuery är inte samma
sak som JavaScript.

1459
01:08:09,980 --> 01:08:14,110
Det är bara ett bibliotek som en riktigt smart
kille skrev och populariserade sådan

1460
01:08:14,110 --> 01:08:18,100
att nästan alla i världen nu
använder jQuery vid användning av Javascript.

1461
01:08:18,100 --> 01:08:20,890
Och vid första anblicken, ärligt talat, det
ser lite mer kryptisk.

1462
01:08:20,890 --> 01:08:24,990
Men du kommer att hitta, särskilt om du går
där för din slutgiltiga projektet med web

1463
01:08:24,990 --> 01:08:29,029
utveckling, ser du att detta
rensar upp saker och sparar en hel

1464
01:08:29,029 --> 01:08:30,229
några rader kod.

1465
01:08:30,229 --> 01:08:33,189
>> Så låt oss bara blick på hur
denna form fungerar.

1466
01:08:33,189 --> 01:08:35,664
Lägg märke till vad gjorde jag bort tydligen
från min HTML?

1467
01:08:35,664 --> 01:08:38,240

1468
01:08:38,240 --> 01:08:40,630
Det finns ingen på skicka handler
så att säga.

1469
01:08:40,630 --> 01:08:41,470
Det finns inget attribut.

1470
01:08:41,470 --> 01:08:43,359
Eftersom du vet, vad
Jag visste inte riktigt gillar?

1471
01:08:43,359 --> 01:08:45,640
Jag kände mig som om vi faller
i gamla vanor där.

1472
01:08:45,640 --> 01:08:49,340
Precis som det börjar känna sig slarvigt
att blandas både CSS med

1473
01:08:49,340 --> 01:08:52,149
HTML, eftersom du typ att kasta
olika språk över hela

1474
01:08:52,149 --> 01:08:56,180
plats, på samma sätt gick det börjar känna
som en dålig väg att gå ner där

1475
01:08:56,180 --> 01:09:01,069
Jag sätter JavaScript-kod på insidan av mitt
HTML snarare än facto ut det.

1476
01:09:01,069 --> 01:09:02,279
>> Så det är lektionen här.

1477
01:09:02,279 --> 01:09:05,080
I dom-2.html, jag facto det.

1478
01:09:05,080 --> 01:09:07,399
Och jag gör saker och ting en aning
annorlunda.

1479
01:09:07,399 --> 01:09:09,630
För nu kommer jag att våg mina händer
på vad detta egentligen innebär

1480
01:09:09,630 --> 01:09:10,590
under huven.

1481
01:09:10,590 --> 01:09:14,210
Men bara för att nu anta att det första
kodrad i detta bibliotek

1482
01:09:14,210 --> 01:09:18,170
heter jQuery betyder bara när
dokumentet är klar, gör följande.

1483
01:09:18,170 --> 01:09:20,080
>> Eftersom webbsidor kan ta
lite tid att ladda.

1484
01:09:20,080 --> 01:09:23,029
Du kan vara på en långsam internet
anslutning, och den skulle kunna snurra

1485
01:09:23,029 --> 01:09:25,290
och spinning, och slutligen den är laddad.

1486
01:09:25,290 --> 01:09:29,060
Denna kodrad bara säger vänta tills
hela sidan är klar, det dokument

1487
01:09:29,060 --> 01:09:31,189
är klar, innan du utför den här koden.

1488
01:09:31,189 --> 01:09:34,390
>> Och nu märker är detta förmodligen
den mest användbara första

1489
01:09:34,390 --> 01:09:36,189
ta ifrån jQuery.

1490
01:09:36,189 --> 01:09:42,140
Denna linje här är mycket lika i anden
till detta mycket längre linje här.

1491
01:09:42,140 --> 01:09:46,920
Medan rå JavaScript-kod, där
föreligger ett dokument globala objektet som

1492
01:09:46,920 --> 01:09:50,460
har en funktion som kallas getElementById ()
de personer som skrev

1493
01:09:50,460 --> 01:09:55,720
jQuery förenklat att bara säga
dollartecken, och sedan inne i

1494
01:09:55,720 --> 01:10:00,250
parentes satte två citat, och sedan
sätta en hash symbol följt av

1495
01:10:00,250 --> 01:10:02,250
unikt ID som du vill ta.

1496
01:10:02,250 --> 01:10:06,170
Så det här är likvärdigt med
document.getElementById.

1497
01:10:06,170 --> 01:10:11,090
>> Samtidigt. Skicka bara innebär på
inlämning av vilken form du är

1498
01:10:11,090 --> 01:10:14,240
hänvisa till vänster, gå
framåt och utföra detta.

1499
01:10:14,240 --> 01:10:16,600
Men det är nu den nyfikenhet också.

1500
01:10:16,600 --> 01:10:19,560
Vad är konstigt om vad
Jag har markerat här?

1501
01:10:19,560 --> 01:10:23,840

1502
01:10:23,840 --> 01:10:28,594
Inte bara är det typ av syntaktiskt
nytt, det finns också något som saknas.

1503
01:10:28,594 --> 01:10:29,558
>> PUBLIK: Det bara kallas funktionen?

1504
01:10:29,558 --> 01:10:31,970
Det kallas inte vaken?

1505
01:10:31,970 --> 01:10:32,440
>> DAVID MALAN: Ja.

1506
01:10:32,440 --> 01:10:35,450
Tja, så alert () är nere
här, för att vara rättvis.

1507
01:10:35,450 --> 01:10:39,520
Men det finns inget omnämnande av en
namn, som ni vet, foo eller

1508
01:10:39,520 --> 01:10:40,980
upp något här.

1509
01:10:40,980 --> 01:10:43,830
Och faktiskt, det är en av de funktioner
av JavaScript som är helt

1510
01:10:43,830 --> 01:10:45,370
kraftfull, men också ganska nytt.

1511
01:10:45,370 --> 01:10:47,460
Och PHP faktiskt har detta också.

1512
01:10:47,460 --> 01:10:49,500
>> Låt mig gå vidare och göra
något riktigt snabbt.

1513
01:10:49,500 --> 01:10:52,030
Låt mig gå vidare och lägga ut det här.

1514
01:10:52,030 --> 01:10:52,600
Låt mig göra det här.

1515
01:10:52,600 --> 01:10:53,690
Funktion.

1516
01:10:53,690 --> 01:10:56,455
Låt oss kalla hanteraren ().

1517
01:10:56,455 --> 01:10:58,290
En hanterarfunktion så att säga.

1518
01:10:58,290 --> 01:11:00,110
Något som hanterar någon operation.

1519
01:11:00,110 --> 01:11:02,700
Låt mig städa mitt indrag.

1520
01:11:02,700 --> 01:11:04,380
Och sätta detta här.

1521
01:11:04,380 --> 01:11:06,090
Och sätta det här.

1522
01:11:06,090 --> 01:11:06,470
Yep.

1523
01:11:06,470 --> 01:11:07,060
OK.

1524
01:11:07,060 --> 01:11:10,300
>> Så nu har jag en funktion som heter
handler () som jag inte riktigt vet

1525
01:11:10,300 --> 01:11:10,890
vad den gör ännu.

1526
01:11:10,890 --> 01:11:12,710
Det har bara fortfarande det där.

1527
01:11:12,710 --> 01:11:13,900
Whoops.

1528
01:11:13,900 --> 01:11:15,820
Tog för mycket.

1529
01:11:15,820 --> 01:11:18,490
Nu gör vi det här.

1530
01:11:18,490 --> 01:11:18,990
Okej.

1531
01:11:18,990 --> 01:11:20,240
Ursäkta.

1532
01:11:20,240 --> 01:11:23,140

1533
01:11:23,140 --> 01:11:23,690
Okej.

1534
01:11:23,690 --> 01:11:24,720
Låt mig göra det här.

1535
01:11:24,720 --> 01:11:25,020
OK.

1536
01:11:25,020 --> 01:11:27,040
Det ser fint och rakt
framåt nu.

1537
01:11:27,040 --> 01:11:29,090
Låt mig göra det här.

1538
01:11:29,090 --> 01:11:29,860
Gör det här.

1539
01:11:29,860 --> 01:11:30,950
Och OK.

1540
01:11:30,950 --> 01:11:33,080
Så nu, låt oss sätta det här.

1541
01:11:33,080 --> 01:11:35,840

1542
01:11:35,840 --> 01:11:37,270
Inget mer programmering i farten.

1543
01:11:37,270 --> 01:11:37,900
OK.

1544
01:11:37,900 --> 01:11:40,000
>> Så nu, låt oss gå tillbaka till
där historien började.

1545
01:11:40,000 --> 01:11:43,530
Tidigare sade jag att denna linje här
innebär när dokumentet är klart, gå

1546
01:11:43,530 --> 01:11:44,380
vidare och göra det.

1547
01:11:44,380 --> 01:11:45,660
Vad vill jag göra?

1548
01:11:45,660 --> 01:11:49,070
Jo specifikt, jag vill gå
vidare och göra följande.

1549
01:11:49,070 --> 01:11:53,700
Utför denna kodrad, och sedan
vad jag vill att ni ska göra är att ringa det

1550
01:11:53,700 --> 01:11:56,370
fungera när formuläret skickas.

1551
01:11:56,370 --> 01:11:57,730
>> Nu är det här vad som är intressant.

1552
01:11:57,730 --> 01:11:59,170
Detta är inte i sig en funktion.

1553
01:11:59,170 --> 01:12:02,540
Lägg märke till att jag inte sätter parenteser
här på vanligt sätt.

1554
01:12:02,540 --> 01:12:06,800
Jag bokstavligen passerar en funktion som heter
hanterare () till en annan funktion

1555
01:12:06,800 --> 01:12:10,800
kallas in () som ett argument som
även om det är som en variabel.

1556
01:12:10,800 --> 01:12:14,290
Och detta är en av funktionerna i
JavaScript är funktionerna själva

1557
01:12:14,290 --> 01:12:15,710
är egentligen bara objekt.

1558
01:12:15,710 --> 01:12:18,350
Faktum är att de är egentligen bara
variabler av något slag.

1559
01:12:18,350 --> 01:12:21,340
Och om namnet på funktionen är
hanterare (), finns det ingen anledning att jag kan inte

1560
01:12:21,340 --> 01:12:23,390
låta det gå i som ett argument här.

1561
01:12:23,390 --> 01:12:27,530
Och detta innebär att när formuläret
med ID för demo är

1562
01:12:27,530 --> 01:12:29,320
lämnats in, kallar denna funktion.

1563
01:12:29,320 --> 01:12:32,770
>> Men nu, om jag ångra allt detta,
varför då gjorde jag kanske göra

1564
01:12:32,770 --> 01:12:34,850
detta för en stund sedan?

1565
01:12:34,850 --> 01:12:36,840
Nåväl, detta är en anonym funktion.

1566
01:12:36,840 --> 01:12:41,080
Eftersom ärligt talat, insåg jag varför är jag
bry sig om att slösa tid att förklara en

1567
01:12:41,080 --> 01:12:45,540
Funktionen kallas handler () bara för att ringa
det i en och endast en plats?

1568
01:12:45,540 --> 01:12:48,640
Om jag inte behöver namn, och jag gör inte
behöva kalla det mer än en plats,

1569
01:12:48,640 --> 01:12:51,200
låt oss bara implementera funktionen
precis där jag behöver det.

1570
01:12:51,200 --> 01:12:55,190
Och så JavaScript och PHP stöd vad
kallas anonyma funktioner som

1571
01:12:55,190 --> 01:12:57,900
Tillåt mig att göra just det här.

1572
01:12:57,900 --> 01:12:59,570
>> Men vi bara skrapat på ytan.

1573
01:12:59,570 --> 01:13:02,430
Låt oss retas med bara ett par
slutgiltiga exempel här.

1574
01:13:02,430 --> 01:13:04,600
>> Om jag går in i quote.php.

1575
01:13:04,600 --> 01:13:07,160

1576
01:13:07,160 --> 01:13:11,870
Lägg märke till att detta faktiskt är en PHP
funktion, ett PHP-program, som jag skrev

1577
01:13:11,870 --> 01:13:15,270
som förväntar sig en HTTP parameter kallad
symbol, och jag kan passera in

1578
01:13:15,270 --> 01:13:16,730
ett värde som FB.

1579
01:13:16,730 --> 01:13:20,010
Och om vi verkligen titta på käll
kod, är det att fråga en gratis hemsida

1580
01:13:20,010 --> 01:13:23,680
kallas Yahoo Finance, precis som p-set
sju, och det är att återvända till mig

1581
01:13:23,680 --> 01:13:26,580
något i tydligen
format som kallas är JSON -

1582
01:13:26,580 --> 01:13:28,010
JavaScript Object Notation.

1583
01:13:28,010 --> 01:13:28,810
Det är bara ett objekt.

1584
01:13:28,810 --> 01:13:32,500
Lägg märke till de klammerparenteser, citat,
tjocktarmen, och kommatecken.

1585
01:13:32,500 --> 01:13:34,720
>> Nu under tiden, det är ganska coolt.

1586
01:13:34,720 --> 01:13:38,520
För jag kan nog använda en programmerings
språk för att generera webbadresser

1587
01:13:38,520 --> 01:13:40,370
att se ut så här dynamiskt,
rätt?

1588
01:13:40,370 --> 01:13:43,340
Jag kan ändra detta till Google
och få tillbaka Googles

1589
01:13:43,340 --> 01:13:47,930
aktiepris på $ 1,017.55.

1590
01:13:47,930 --> 01:13:49,640
Så låt oss se om vi inte kan använda det här nu.

1591
01:13:49,640 --> 01:13:56,590
>> Låt mig gå till ajax-0 här, vilket
ser ut som följande.

1592
01:13:56,590 --> 01:13:59,750
Det är bara en webbplats som har
ett formulär med en knapp.

1593
01:13:59,750 --> 01:14:05,860
Låt mig här gå vidare och skriva in yhoo
för Yahoos aktiesymbol, klickar du på Hämta

1594
01:14:05,860 --> 01:14:10,530
Citat, och nu märker jag har fått
en varning med 32,86.

1595
01:14:10,530 --> 01:14:14,050
>> Låt mig faktiskt gå till en snyggare version
på denna sida, version två, och

1596
01:14:14,050 --> 01:14:17,530
Skriv in låt oss säga Microsoft, MSFT.

1597
01:14:17,530 --> 01:14:18,410
Få offert.

1598
01:14:18,410 --> 01:14:19,850
Och nu märker, ingen varning.

1599
01:14:19,850 --> 01:14:22,770
Lägg märke där det står pris
som skall fastställas?

1600
01:14:22,770 --> 01:14:27,060
Det är den enklaste av exempel som
tips på vad Gchat, och Facebook

1601
01:14:27,060 --> 01:14:30,070
Chatta, och Gmail och andra sådana
webbplatser gör genom att faktiskt

1602
01:14:30,070 --> 01:14:31,290
ändra webbsidan.

1603
01:14:31,290 --> 01:14:31,800
>> Lägg märke till detta.

1604
01:14:31,800 --> 01:14:33,120
Låt mig ladda om sidan.

1605
01:14:33,120 --> 01:14:35,080
Låt mig öppna Chrome Inspector.

1606
01:14:35,080 --> 01:14:36,890
Låt mig gå till elementen
fliken här nere.

1607
01:14:36,890 --> 01:14:42,310
Nu märker om jag zooma in här nere och
öppna upp detta, märker att det här är min

1608
01:14:42,310 --> 01:14:44,500
HTML DOM - min Document Object Model.

1609
01:14:44,500 --> 01:14:45,920
Det här är min HTML.

1610
01:14:45,920 --> 01:14:48,750
Men nu märker, även om det kommer
vara lite svårt att se det i både

1611
01:14:48,750 --> 01:14:52,080
ställen samtidigt, om jag skriver på FB
upp här, titta på botten

1612
01:14:52,080 --> 01:14:54,110
på skärmen bara.

1613
01:14:54,110 --> 01:14:57,720
>> Det är faktiskt förändras
min HTML i farten.

1614
01:14:57,720 --> 01:15:01,670
Och det gör det helt enkelt
genom att göra något som detta.

1615
01:15:01,670 --> 01:15:06,800
Om jag öppnar ajax-2, meddelande om genomförande
något så sexigt som

1616
01:15:06,800 --> 01:15:09,560
att även om det är ganska fult,
men så sofistikerade som det

1617
01:15:09,560 --> 01:15:11,910
funktionellt, den har några
HTML längst ner.

1618
01:15:11,910 --> 01:15:13,810
Men märker jag brukade tagga.

1619
01:15:13,810 --> 01:15:16,640
Vi har inte använt det förut, men det är
som ett, men det tvingar inte

1620
01:15:16,640 --> 01:15:17,840
allt på en ny rad.

1621
01:15:17,840 --> 01:15:20,830
Det gör bara ett rektangulärt område
på samma linje i huvudsak.

1622
01:15:20,830 --> 01:15:22,870
>> Lägg märke till att jag gav det ett ID i pris.

1623
01:15:22,870 --> 01:15:26,800
Och det visar sig genom att använda samma
JavaScript-bibliotek, jag har en funktion

1624
01:15:26,800 --> 01:15:30,440
kallas citat () som heter när
formuläret skickas.

1625
01:15:30,440 --> 01:15:31,800
Och vad jag gör är det här.

1626
01:15:31,800 --> 01:15:35,730
Jag förklara en variabel i JavaScript
kallas url, spara värdet

1627
01:15:35,730 --> 01:15:38,650
quote.php? symbolen =.

1628
01:15:38,650 --> 01:15:44,220
Med andra ord, jag själv börjar
att förbereda en HTTP-begäran, och sedan

1629
01:15:44,220 --> 01:15:49,250
Jag sammanfoga in på det med ett plus
oavsett elementet med ID-nummer

1630
01:15:49,250 --> 01:15:54,190
av symbolen är, vilket meddelande är att
textfält ända ner hit.

1631
01:15:54,190 --> 01:15:56,630
Så precis som vi hade former i det förflutna.

1632
01:15:56,630 --> 01:16:01,450
>> Och då visar det sig i jQuery, om du
ringa. val (), som kallar på en val

1633
01:16:01,450 --> 01:16:05,900
funktion, ett värde funktion, blir det
vad användaren har matat in i.

1634
01:16:05,900 --> 01:16:08,920
Och så all nätverkstrafik
som händer är detta.

1635
01:16:08,920 --> 01:16:11,230
$. GetJSON.

1636
01:16:11,230 --> 01:16:13,720
>> Och som en sidoreplik, är dollartecken
bara en förkortning notation.

1637
01:16:13,720 --> 01:16:16,860
Det är verkligen jQuery.getJSON.

1638
01:16:16,860 --> 01:16:21,520
Ta mig till JSON från denna URL, och när
begäran kommer tillbaka, kalla detta

1639
01:16:21,520 --> 01:16:26,550
funktion och passera som argument
allt kom tillbaka från servern.

1640
01:16:26,550 --> 01:16:31,205
>> Så med andra ord, om jag går tillbaka till
webbläsaren, och jag går tillbaka till quote.php,

1641
01:16:31,205 --> 01:16:35,590
vad min webbläsare gör är att få
denna bit av data.

1642
01:16:35,590 --> 01:16:38,930
Och när jag går på denna webbsida här,
märka om vi i stället gå till nätverket

1643
01:16:38,930 --> 01:16:43,820
fliken och avmarkera den och skriv in
något som GOOG för Google och få

1644
01:16:43,820 --> 01:16:46,340
Citat, märker sidan ändrades inte.

1645
01:16:46,340 --> 01:16:50,990
Men en HTTP-begäran gjordes, och vad
kom tillbaka hit om vi tittar på

1646
01:16:50,990 --> 01:16:56,130
svaret är en hel massa JSON
som vi åt till slut med

1647
01:16:56,130 --> 01:16:58,070
denna enkla linje här.

1648
01:16:58,070 --> 01:17:00,150
>> Data är det som fått
från servern.

1649
01:17:00,150 --> 01:17:02,120
Priset är namnet på den
nyckel jag bryr mig om.

1650
01:17:02,120 --> 01:17:05,230
Så data.price ger mig det.

1651
01:17:05,230 --> 01:17:07,540
>> Nu under tiden, och detta
är det sista exemplet.

1652
01:17:07,540 --> 01:17:09,280
Du kan göra ännu mer med sidan.

1653
01:17:09,280 --> 01:17:12,440
Ett faktiskt, väl två.

1654
01:17:12,440 --> 01:17:14,780
Vi kan föra tillbaka
tagga, om du kommer ihåg det.

1655
01:17:14,780 --> 01:17:15,850
Det är JavaScript.

1656
01:17:15,850 --> 01:17:17,110
Vi kan göra det.

1657
01:17:17,110 --> 01:17:17,690
Mycket spännande.

1658
01:17:17,690 --> 01:17:18,800
Vi lämnar det som en cliffhanger.

1659
01:17:18,800 --> 01:17:21,590
>> Men mer spännande, kan du
göra saker som denna.

1660
01:17:21,590 --> 01:17:25,940
Om jag går till geolocation-1, visar det sig
att Chrome vet att vi är på

1661
01:17:25,940 --> 01:17:30,672
latitud longitud 42,37. -71,10.

1662
01:17:30,672 --> 01:17:32,940
Så det finns ännu mer där
till ditt förfogande.

1663
01:17:32,940 --> 01:17:34,290
Men mer om det nästa vecka.

1664
01:17:34,290 --> 01:17:35,540
Vi ses måndag.

1665
01:17:35,540 --> 01:17:37,558