DAVID J. Malan: Labi, tāpēc tas šeit ir Myo roku joslā, pāris, kas mums ir par CS50 gala projektiem. Un tas bija demonstrācija mēs rindā esošajiem jūs up iepriekš kur būtībā tas diezgan saspringts roku joslā šeit klausās jūsu muskuļu kustībām kas pēc tam tiek kartēti programmatūrā lai Colton s klēpjdators pār šeit, kas bija iTunes un ka Dziesma jau ievietots rindā uz augšu. Nevis mani demoing šo, Colton ir bijis lab skaidri visu nedēļu iegūt demonstrāciju gatavs vienu drosmīgs brīvprātīgo. Ja kāds vēlas nākt par up-- redzēja savu roku pirmais. Nāciet uz augšu. [00:01:09] Labi. Un kāds ir tavs vārds? 

[00:01:13] Mērķauditorija: Uh, Maria. 

[00:01:14] DAVID J. Malan: Maria, jauki tevi redzēt. Nāc uz vairāk nekā šeit. Ļaujiet man jūs iepazīstināt ar Colton. Colton, tas ir Marija. 

[00:01:21] COLTON: Hi, nice to meet you. 

[00:01:23] DAVID J. Malan: All labi, tāpēc soli vienu, mēs esam nāksies jūs likts tas uz jūsu apakšdelms tā, ka tas ir diezgan saspringts up netālu no jūsu elkoņa. Un tikmēr, pieņemsim ir likts uz mūsu Google Glass un mēs samaisa tehnoloģijas jau šodien. 

[00:01:33] COLTON: Vispirms mums nāksies āķis to vērā lietas. 

[00:01:36] DAVID J. Malan: Labi. Patiesībā, pieņemsim nodot savu roku, kā tuvu šo kabeli iespējas tā, ka mēs varam vispirms sinhronizēt to uz augšu. 

[00:01:41] COLTON: Darīsim to. 

[00:01:42] DAVID J. Malan: Un tikmēr, tāpēc ka ikviens var saņemt tuvāk skatienu, mēs mētāt Andreja kameru uz ekrāna tur. Tātad mums ir USB kabeli, kas ir tiek pieslēgts Marijas aproces. Un ļaujiet man mētāt Colton ekrānu up projektoru nākamo. 

[00:02:00] Tātad Colton Reģistrējoties ierīci Tagad kā Myo saistīta ar šo kabeli. Un tagad to, ko Maria s darīsim momentāni faktiski staigāt pa kalibrēšanas soļi un mācīt programmatūru kā viņas muskuļi atbildēt kad viņa pārliecināties iepriekš definētas Žesti, ka programmatūra saprot. Ja vēlaties doties priekšējā ekrāna. Labi, jāmēģina. 

[00:02:30] COLTON: Go kā šis. Un, piemēram, ka. Un visu ceļu pa labi. Iet atpakaļ. 

[00:02:35] DAVID J. Malan: Labi. Atšķirīga perspektīva. Tas nav jums. Tas ir mums. 

[00:02:40] MARIA: OK. DAVID J. Malan: Nē. Pieņemsim pārvietot to augstāk, lai tas ir tuvāk jūsu elkonis, vai pat stingrāka. Labi. 

[00:02:52] Šeit mēs iet. Tas varētu būt labs laiks, lai CS52X. Tur mēs ejam. 

[00:02:57] Ļoti jauki. OK. Īkšķi uz Pinky. 

[00:03:02] Ļoti jauki. Izplatīt jūsu pirkstiem. Labi. Vilnis labi. Tas ir savādi rāda tu ar kreiso hand-- 

[00:03:17] COLTON: Jā, tas ir dīvaini. DAVID J. Malan: Wave līdz labi un virzīties uz priekšu. Ātri uz priekšu, lai izlaistu vai nākamo. Tas ir OK Wave taisnība. 

[00:03:25] MARIA: Es don't-- gaidīt. 

[00:03:26] DAVID J. Malan: Vajadzīga neliela palīdzība? 

[00:03:28] COLTON: Tātad jūs iet kā šis. MARIA: Tas ir pagrieziena Otra lieta, though. COLTON: Tā ir. DAVID J. Malan: Jā es nezinu kāpēc tas parāda jums leftie. COLTON: Kāpēc jūs try-- tikai mēģināt iet kā šis. 

[00:03:38] DAVID J. Malan: Nē? Varbūt sasniegt savu roku out mazliet taisnāk un padarīt to pēkšņi kā šis. Jā, OK, come on. 

[00:03:48] MARIA: Es atvainojos. DAVID J. Malan: Tas nav jūsu vaina. COLTON: Tas ir jauki. DAVID J. Malan: All Right. Well-- 

[00:03:56] MARIA: Vai mums vajadzētu izlaist šo, tad? DAVID J. Malan: Jā, pieņemsim let jums pie āķa. Tātad, ja kāds vēlētos darīt galīgais projekts, izmantojot šo līderi aparatūra, saprotu, ka tas var tikai ņemt nedaudz jāpierod. Un this-- realitāte ir šāda ir tiešām ļoti asiņošana mala. 

[00:04:10] Tas ir tas, ko sauc attīstītājs komplekts, kas ir domāts, lai būtu būtībā pirmsizlaides lai cilvēki var darīt tieši this-- cīnīties ar to, skaitlis , cik cilvēku struktūras strādāt ar tehnoloģiju. Tātad, ja jūs vēlaties pēc tam, pēc lekcijas, mēs varam jums nākt un veikt vēl stab pie tā. Bet citādi, kārta aplausi, ja mēs varētu, Maria par nāk uz augšu. 

[00:04:26] MARIA: Paldies. 

[00:04:28] DAVID J. Malan: Paldies. Mēs jābalstās uz to, bet mēs sniegsim you-- kā par stresa bumbu šeit? Ak, and-- if-- yeah, paldies. Labi. Tātad ziņkārīgs, ja jūs bijāt svešs ar skaņas izvēli ka mēs, kas tur agrāk, pārsteidzošs TV liecina, ka jums vajadzētu absolūti būt iedzeršana-skatoties Netflix ir šeit, tas viens. 

[00:04:51] SPEAKER 1: Dāmas un kungi, burvis nosaukts Josh. 

[00:05:04] DAVID J. Malan: Un acīmredzot, tas ir lieta teksts man lekciju laikā tagad. Es esmu to teicis, ka Maria bija dzimšanas dienu vakar. Tik daudz laimes dzimšanas dienā, no CS50 lai Maria kā labi. 

[00:05:18] Lai jūs varētu būt lasīt pēdējā mēnesī ka šī kungi šeit, Steve Ballmer, kurš patiesībā bija klase 1977. gada koledžā, nesen pensijā Microsoft. Viņš bija bakalaura šeit Pēc tam pāris gadus vēlāk nonācis pie Stanford Business School kad viņš saņēmis tālruni zvanu no drauga viņa kurš bija dzīvojuši uz leju zālē no viņa šeit Hārvardā. Drauga vārds bija Bill Vārti, un tajā laikā, viņš mēģina pieņemt darbā Steve būt pirmā biznesa cilvēks, tiešām, pie maza uzņēmuma nosaukumu Microsoft. 

[00:05:45] Garš stāsts īss, Steve galu galā ieguva vairāk, pievienojās Microsoft, kad viņi bija tikai 30 darbinieki. Un, kad viņš pensijā pavisam nesen, uzņēmumam bija 100,000 darbinieki pēdējos gados. Un tā mājas lapā pazīstams kā draudēja sagatavojusi šo cieņu par video ka mēs domājam, ka mēs gribētu dalīta, kas dod jums sajūtu, cik daudz enerģijas Steve nes uz jebkuru prezentācijā viņš dod. [VIDEO PLAYBACK] -Microsoft Ir kā ceturtais bērns. Bērni darīt atstāt mājas. Šajā gadījumā, es domāju, Es esmu atstājot māju. Hey Bils, whazzap? 

[00:06:23] -Wazzap? 

[00:06:24] -Hey, Wazzap? Mēs esam dota milzīgs iespēja. Un Bils deva mums šo iespēju. Es vēlos pateikties Bilu par to. Es gribu, lai jūs pārāk. Inovāciju temps nav gatavojas lēni. 

[00:06:42] Tas ir gatavojas saņemt ātrāk un ātrāk. Tur varētu būt daži konkurenti ka diemžēl likvidēta! 

[00:06:54] Es mīlu šo uzņēmumu. Jā! Es esmu datoru, un es mīlu šo uzņēmumu! 

[00:07:08] Attīstītāji, attīstītāji, attīstītāji, attīstītāji, attīstītāji, attīstītāji, attīstītāji, izstrādātāji. Jā! Web izstrādātājiem! 

[00:07:19] Web izstrādātājiem! Web izstrādātājiem! Uzklausīt to, ko vēl jūs saņemt bez papildu maksas! 

[00:07:28] MS-DOS izpildvaras, iecelšana kalendārs, kartes kaudzes, piezīmju bloks, pulkstenis, vadības panelis. Un, jūs varat noticēt? Reversie! 

[00:07:35] Ierakstīt tos CD! Pēc tās, lai MSN! Jūs pastu tos draugiem! 

[00:07:40] Visi ar vienu klikšķi! Viens Microsoft, viena stratēģija, viena team-- mērķtiecīga, disciplinēti, profesionālās, un eksperts visu, ko mēs darām. Ļaujiet man izmantot līniju no vecās filmas. 

[00:07:52] Attiecības ir kā haizivis. Viņi pārietu uz priekšu vai viņi mirst. Es tiešām domāju, ka tech kompānijas ir vienādi. 

[00:08:01] [END VIDEO PLAYBACK] DAVID J. Malan: Tātad mēs esam tik priecīgi paziņojam, ka Stīvs būs savieno mūs šeit CS50 nākamo trešdienu parasti vietu un laiku šeit. Telpa, iespējams, būs ierobežota. Un tāpēc, lai pievienotos mums personīgi, lūdzu galvu šodien vai īsi pēc tam līdz cs50.harvard.edu/register. 

[00:08:22] Un mēs sekot līdz Otrdiena apstiprinot plankumi. Ceram, ka nākamajā Trešdiena lekciju CS50 laikā. Tagad, citiem jaunumiem, man gadījās nākas sastapties ar to The Crimson tikko otro dienu. 

[00:08:34] Izrādās, ka viens no CS50 darbinieku un vismaz viens no CS50 studentiem šobrīd darbojas UC prezidents un viceprezidents, kas cēla mani atpakaļ uz savām dienām atpakaļ kad es zaudēju UC vēlēšanās nožēlojami. Bet sudraba maliņa jo tas man vienmēr pateikt stāsts ir tāds, ka viens no I esmu pārliecināts daudz iemeslu, es zaudēju vēlēšanas bija pilnīgs trūkums par talantu retorikā. Un tā pavisam godīgi, to brauca man, ka pieredze Es domāju, ka mana junior gadu, faktiski parakstīt up Hārvardas Computer Society, kas ir grupa, kas Campus tur dažādus tehniska rakstura sarunas un citas lietas. Un es pārņēma viņu mācīšanu semināri un tāpēc bija iespēja, Lieliska iespēja, sākt darbu tieši to. Bet arī, man bija iespēja šīs pieredzes laikā mācīt sev visu vairāk HTML. Un tāpēc es procrastinated pagājušajā naktī ar Skatoties caur HTML pamatā tīmekļa vietnē Es līdzīgā 1997, '98, par manu Kampaņa, kas izskatās šādi šeit. Es zinu. 

[00:09:29] Because-- un, protams, paziņojums šo apbrīnojamo dizaina lēmums 1998.gadā vai plauktiņš. Pirmā lieta, ko vēlaties, lai lietotāji darīt pēc apmeklē jūsu mājas lapā ir jābūt, lai noklikšķiniet uz citu saiti tikko lai ievadītu jūsu mājas lapā šeit ar mūku aiz kā shrouded aizkaru kur acīmredzot mana kampaņa platformu bija. Un tas ir viss, jūs saņemsiet šodien ir tikai screenshot. Bet es lasīju, izmantojot, piemēram, mani kampaņas plakāti pagājušajā naktī un mana platforma. 

[00:09:50] Un es biju tik dusmīgs laikā. Mana platforma was-- tas bija interesanti. Tāpēc es esmu nomierinājos kopš tā laika. Bet kādu dienu, es darbosies atkal un cerams, ka labāk šo laiku. 

[00:10:03] Tātad HTML, ka valoda, kurā es ka in-- jums drīz padarīt daudz more-- ir kaut kas, mēs esam bijuši runājot par vēlu un lielā mērā ķeršanu piešķirts tagad ka mēs esam pārgājuši uz citām valodām. Bet pieņemsim apstāties tikai brīdi un likts dažas no šīm lietām kontekstā. Tātad vienā teikumā, kas ir HTML? 

[00:10:18] Vai, kas tiek izmantots, lai? Ikviens? Jā. 

[00:10:20] Mērķauditorija: Markup tīmekļa vietnēm. DAVID J. Malan: iezīmēšanas mājas lapā. Tātad, tas ir iezīmēšanas valoda, kas ļauj strukturēt mājas lapu. Header iet uz augšu šeit, virsraksts iet šeit, ķermeņa iet šeit. Tas ir treknrakstu, tas ir italics-- šāda veida detaļas. 

[00:10:33] Labi, labi. Tātad CSS ļauj you-- un I bija daži brīvības tur ar drosmīgu-apšuvumu un slīprakstā tāpēc, ka kas ir labāk īstenota ar to. CSS is-- ko? Teikt teikumā. Ikviens vispār. Yeah. 

[00:10:46] Mērķauditorija: Embellishments un sīkumi, piemēram, kā veidot to. DAVID J. Malan: Labi, labi. Rotājumus, kas ļauj jums veidot to, vai stylize to ar lietām, piemēram, trekniem burtiem un slīprakstā un krāsas, kā arī vairāk naudas graudains pozicionēšana elementiem. Tā veida ļauj veikt lietas par pēdējais km tā, ka, ja, piemēram, in Pset7, jūs varētu būt pamanījuši par savu portfolio lapa, ja jūs šajā brīdī jau, ka noklusējuma tabula, kas jums veikt, lai parādītu lietotāja krājumu saimniecībām un naudas, iespējams, izskatās diezgan pretīgs pēc noklusējuma, bez atstarpēm. Viss ir sava veida pieblīvēts kopā rindās un kolonnās. 

[00:11:18] Nu, ar mazliet CSS, kā jūs varat saprast, Jūs faktiski var iekniebt, ka, un dara to kaut kas daudz vairāk pazīstams un daudz prettier apskatīt. Tātad CSS ir par stilizācija tīmekļa vietnes. Bet tad mēs ieviesām vēl viens valoda, PHP, kas ļauj mums darīt? 

[00:11:36] Darīsim, ko? Ikviens. Nokļuvis uzdrīkstēties pirmās pāris rindas. Yeah. 

[00:11:40] Mērķauditorija: Izveidot dinamisku saturu. DAVID J. Malan: Perfect. Radītu dinamisku saturu. Un jūs varat darīt to jebkuru valodu skaits. Mēs notikt izmantot PHP, jo tas ir daļēji tāpēc līdzīgi C sintaksi. 

[00:11:50] Bet PHP dara tieši tā. Tas ļauj dinamiski ģenerēt produkciju. Un daži no šīs produkcijas varētu būt HTML, kā mēs esam parasti darot. Un tas ir arī tāpēc, ka tas ir programmēšanas valoda, ir mehānismu, ar kura mēs varam runāt ar datu bāzēm. 

[00:12:03] Un mēs varam darīt vaicājumus citiem serveriem, piemēram Yahoos un programmatiski darīt jebko tiešām, ka jūs varētu citādi vēlas piespiest datoru darīt. Tāpēc PHP ļauj mums sākt dinamiski outputting saturu. Tātad, šīs loģikas, man nebija dinamiska mājas lapa atpakaļ 1998. gadā. 

[00:12:16] Tas bija tikai statiska mājas lapa. Mans saturs bija mainīt manuāli ar gedit vai kādu līdzvērtīgu. Bet PHP ir tas, ko mēs, ko izmanto vai varēja izmantot, drīzāk, kaut ko līdzīgu Frosh IP mājas lapa, kurā bija paredzēts veikt reģistrāciju un pārvaldīt sarakstu users-- lietām, kas faktiski pārslēgšanu laiks, lai gan mēs notikt izmantot Perl, atšķirīgs valodas laikā. 

[00:12:35] Un tad visbeidzot, mēs iepazīstinājām SQL-- Strukturēts Query Language. Tātad vēl viena valoda kas tiek izmantots par ko? Izmanto par ko? Vai mēs varam riska slight-- Labi, mēs nebrauksim iegūt daudz tālāk kā orķestra šeit. Mērķauditorija: Tas ir protokols izmanto, lai sarunātos ar datu bāzēm. DAVID J. Malan: protokols izmanto, lai sarunātos ar datu bāzēm. Ļaujiet man iekniebt. Tas ir dabiski lietotā valoda runāt ar databases-- Atlasa un ieliktņi un dzēš un atjauninājumus un faktiski pat vairākas pazīmes, kas mēs neesam pat ienira stājas bet jūs varētu vēlēties, lai būtu explore-- izpētīt, teiksim, galīgo projektu. Tātad ir šie dažādie gabali. 

[00:13:09] Un cerams Pset7, kaut tās specifikācija ir diezgan garš, tas ir apzināti ilgi staigāt jums ar to, kā šīs lietas var visu būt drukāti kopā. Tagad, pirmdien, mēs iepazīstināja mūsu pēdējā valodu ka mēs oficiāli ieviest course-- tas ir, JavaScript. Tas, piemēram, PHP, ir interpretēts valoda. 

[00:13:25] Bet galvenais atšķirība Es ierosināju pirmdien ir tas, ka tā PHP izpildes vai interpretēt uz serveri, kas Šajā gadījumā, ja ir CS50 ierīce, vai varētu būt daži komerciāla web servera internetā, JavaScript parasti ir valoda, kas darbojas klienta pusē ne servera side-- tik pārlūkprogrammā. Kas ir, tāpat kā tad, kad es atvēru up Facebook pirmkodu un atrada visu no šiem Js failus, nozīmēja, ka tad, kad jūs apmeklējat Facebook vai lielākā mājas lapas šajās dienās, jūs saņemsiet ne tikai HTML, ne tikai CSS, bet viss ķekars JavaScript kods bieži formā Js failus. Un tad tas ir browser-- savu Mac vai PC-- kas izpilda šo kodu. 

[00:14:03] Bet jūsu pārlūkprogramma izpilda to. Jūs varat domāt veida smilšu kastē. Tā, ka JavaScript kodu nedrīkst būt iespējams izdzēst failus datorā. Tai nevajadzētu būt iespējai sūtīt e-pastus uz jūsu vārdā. Jūsu pārlūkprogramma veida darbība ierobežo Ko jūs varat darīt ar to. 

[00:14:17] Tātad šajā ziņā, tas ir maz mazāk spēcīgs, iespējams, nekā C. Bet JavaScript var, jo malā, ko izmanto uz servera, lai gan mēs nemēdz runāt par to šajā kontekstā. Tāpēc tagad pieņemsim tie tās kopā. Nedēļas plus Pirms mēs iesniegusi dažus HTML uz left-- super boring mājas lapā. 

[00:14:34] Vienkārši saka sveiki pasaule. Un tad es ierosināja taisnība, mēs varam veida nozagt idejas no mūsu diskusijas par datu struktūras C un domāt par to, kā šis hierarhiska iezīmēšanas valoda pa kreisi nevar izdarīt vai īstenot atmiņā kā faktiskā koka struktūru ar mezgliem un norādes un tie detaļu veidus. Labajā pusē, mēs saucam ka a DOM-- dokuments Objekts Model-- kas ir tikai iedomātā veids, kā pateikt koku. 

[00:14:56] Tagad, kāpēc tas ir lietderīgi domā par to šādā veidā? Tāpēc, ka tagad ar JavaScript, jo mums ir kodu, kas izpaužas spēlēt šajā vide, faktiskais HTML, kas ir nosūtīts pārlūku jau ir, un jau ievadīta atmiņā pārlūkprogramma kokā jūsu datora RAM, piemēram, tas, mēs varam izmantot JavaScript faktiski traversa vai staigāt vai meklēšana vai mainīt, ka DOM koks tomēr mēs vēlamies. Tātad faktiski, ja jūs domājat, ka par facebook.com, ja jūs izmantojat tērzēšanas funkciju, ja jūs izmantošana Gmail un gchat funkciju, kaut kur jums ir ziņas nāk atkal un atkal un atkal, šīs ziņas, iespējams, piemēram, LI tag, saraksts punkts tagus, varbūt. 

[00:15:35] Vai varbūt viņi vienkārši divs, kas uztur parādās katru reizi, kad jūs saņemsiet tūlītēju ziņu. Un tā tas tikai nozīmē to, ko Facebook vai Google dara ir jebkurā laikā jums ziņu no servera, tie, iespējams, izmantojot JavaScript vienkārši pievienot citu mezglu tam tree-- citu mezglu šim koks, kas tad vizuāli tikai izskatās piemēram, jaunu līniju teksta ekrānā. Bet viņi ievietojot šajā datu struktūru. 

[00:15:57] Tātad klasēs, piemēram, CS124 un citiem, jūs faktiski rakstīt vairāk kodu pret datu struktūras, piemēram, tas. Bet tagad JavaScript, mēs vienkārši pieņemam mēs visu šo funkcionalitāti par brīvu no pašas valodas. Tātad, aplūkosim piemēru. 

[00:16:09] Ļaujiet man atvērt failu ar nosaukumu form.html. Tas ir super vienkārši. Tā tikai izskatās. 

[00:16:15] Nē CSS, nekādas domas estētiku. Tas ir tīri funkcionāla un acīmredzot es esmu lūdzot e-pastu, paroli, paroli vēlreiz, un tad pārbaude piekrist dažiem noteikumiem un nosacījumiem. Kāda pirmkods šim Izskatās, ka ir iespējams, kaut varat minēt ar mazliet domas tagad. Man veidlapu tag šeit. 

[00:16:32] Darbība ir acīmredzami gatavojas iet uz failu ar nosaukumu register.php. Metode, es esmu gatavojas izmantot, ir iegūt. Un tad es esam ieguvuši tekstu lauka, kura vārds ir e-pastu. 

[00:16:40] Man paroles lauku kura vārds ir parole. Man vēl viens paroles lauks, kura vārds ir nedaudz patvaļīgi apstiprinājums. Tas ir tikai vēl viens HTTP parametrs. 

[00:16:49] Un tad mēs, mēs esam nav izmantoti šie izņemot jo Frosh IP demo in class-- rūtiņa, kas ir tikai veids vienāds pārbaudi. Un es aicinu šo vienošanos. Tāpēc es esmu veida patvaļīgi, bet ērti nosaukts šos laukus. Tā, ka tagad, kad šī forma kļūst iesniegts, pieņemsim redzēt, kas notiek. Ja man malan@harvard.edu, Es darīšu paroli purpura. Es darīšu paroli neko. Pieņemsim nesadarbojas. 

[00:17:10] Un es ne pārbaudīt lodziņu. Ļaujiet man noklikšķiniet uz reģistru. Un tā saka, hm, jūs esat reģistrēts. Nav īsti. 

[00:17:16] Bet URL mainījusies. Tātad šī forma tika skaidri atļauta iesniegt register.php. Bet, domājams, man būtu noķert kādu no šīm kļūdām. Tagad, Pset7 un dažās mūsu lekciju piemēriem, mēs parasti izdrukāt liels sarkans kļūdas ziņojums šeit sakot, trūkst vārdu, vai trūkst paroli. Mēs esam darījuši iepriekš, un mēs esam darīts servera pusē kļūdu atklāšanai. 

[00:17:37] Bet daudzi mājas lapas šajās dienās do klienta pusē kļūdu atklāšana kur URL nemainās. Visa lapa nav atsvaidzināt. Jūs saņemsiet tūlītēju atgriezenisko saiti no pārlūka. Varbūt kaut kas sarkans. 

[00:17:48] Varbūt jums pop up. Bet jums nav tērēt laiku nosūtot servera datu, kas ir nepilnīgi. Tātad, pieņemsim redzēt, kā mēs varētu sasniegtu šo funkciju, kā arī. 

[00:17:56] Ļaujiet man iet uz form1.html, kas izskatās vienādi. Bet, ja šoreiz es daru malan@harvard.edu un es tipa tumšsarkanā un es nedomāju, sadarboties turpmākajā bet noklikšķiniet Reģistrēties, paziņojums tagad. Tas nav sexiest risinājums. Esmu vismaz nozvejotas šo kļūdu. Un es esmu izmantojis brīdinājumu funkcija JavaScript-- kas mēs esam tikai izmantot klasē. Vispār, jums nevajadzētu izmantot šo jo tas var ļoti ātri izkļūt kontroles. Bet paroles nesakrīt, ir kļūda. 

[00:18:19] Ļaujiet man iet uz priekšu un noklikšķiniet uz Labi. Bet ko galvenais takeaway šeit ir, ka URL nemainījās. Tāpēc man nav bothered izšķērdēt servera laiks lūdzot jautājums, ka es varētu būt sapratu, ka atbildi uz sevi. 

[00:18:30] Un lietotājs, kaut arī ir runāt par to ilgāk par lietotāja gatavojas domāt par to, nāksies tūlītēju atgriezenisko saiti. Nav latentuma ar tīkla savienojumu. Tātad, pieņemsim apskatīt šo pirmkodu. 

[00:18:40] Form1.html izskatās strukturāli līdzīgs šeit. Forma ir faktiski tā pati. Bet pieņemsim redzēt, ko es darīju uz leju šeit. Un tur ir dažādi veidi, kā to darīt. Un es esmu darījusi visvairāk taisni sekotājs bet visvairāk elegants veids, kā vēl. Man ir skriptu tag. Tad es aicinu document.getElementById ("reģistrācija"). Un es saglabāt šo vērtību formā, mainīgs. 

[00:19:04] Tātad, ko es esmu darījis? Jūs varat iedomāties document.getElementById kā īpaša funkcija, kas JavaScript dod jums kas burtiski rokas jums rādītājs uz vienu no mezgliem vai taisnstūri šajā kokā. Tāpēc tagad, ka tas, ko mūsu forma mainīgs JavaScript ir faktiski norādot uz. 

[00:19:21] Tāpēc tagad sintakse atšķiras no C. Bet mēs darām dažas lietas šeit. Viens, šī ir mazliet dīvaini skatoties, protams, salīdzinot ar C. Bet apskatīt līnija 35. Tā kreisajā form.onsubmit. Atgādināt, ka onsubmit ir kā lauka struktūrai. Ja jūs domājat par veidlapas mainīgā ir tikai to C struct, tas varētu būt daži lauki. 

[00:19:42] Atpakaļ dienā, mums bija studentu vārdus, ID, mājas, tie veida jomās. Tikai domā par onsubmit kā citā jomā. Bet tas ir īpašs lauks, jo pārlūks ir ieprogrammēts gaidīt .onsubmit ne būt vērtība tāpat kā daudzas vai auklas, bet faktiski funkcija vai adresi funkciju jo datora atmiņā. 

[00:20:02] Un tiešām, tas ir kas šis atslēgvārds šeit dara. Tas saka, dod man jaunu funkciju. Bet kas ir tās nosaukums būs, acīmredzot? 

[00:20:09] Atceroties pirmdien. Kāds ir nosaukums, tas funkcija, pamatojoties uz šo sintaksi? Nē, es domāju, tur ir skaidri bez nosaukuma associated-- noteikti nevis to, ko es esmu iezīmēts šeit. 

[00:20:21] Bet tas ir tiešām OK. Tas ir anonīms funkcija, vai lambda funkcija kā daži to varētu saukt. Un tas tikai nozīmē, tas joprojām funkcija. Tas ir tikai, jūs nevarat to sauc pēc nosaukuma. Bet tas ir OK. Jo atkal, pārlūks ir ieprogrammēts uzņēmumi, piemēram, Google vai Microsoft vai Mozilla vai citus tikai zinu, ka, ja .onsubmit jomā iekšpusē forma elements ir vērtība, uzskatīt to par function-- funkcija rādītājs, ja Jums gribas. Un sauc to, kad tiek iesniegta veidlapa. 

[00:20:46] Tātad, kādi kods būtu jāizpilda kad tiek iesniegta veidlapa? Acīmredzot, viss iekšpusē cirtaini lencēm. Un tas ir tikai stilistiska. 

[00:20:53] Jūs varētu darīt, piemēram, mums ir tendence darīt CS50. Bet Javascript, lielākā daļa cilvēku tendence, lai saglabātu to uz vienas līnijas tikai tāpēc, ka daudz skaidrāk ir saistīts ar šo atslēgvārdu funkciju. Tāpēc tagad, ko es daru? 

[00:21:03] Ja form.email.value vienāds vienāds tukša virkne vai neko, lūk, brīdinājumu, kur es esmu gatavojas teikt, jums ir jāsniedz savu e-pasta adresi, un pēc tam atgriezties viltus. Un tas ir, ka atgriešanās nepatiesa, ka novērš veidlapu iesniegšanas. Tikmēr, ja parole vērtība ir tukšs, es esmu gatavojas kliegt lietotājam un teikt, jums ir jāsniedz paroli. 

[00:21:21] Tikmēr lietas kļūst mazliet mīļotājs šeit. Ja form.password.value nav vienāds form.confirmation.value, citā jomā, bļaut lietotāja, paroles nesakrīt kā viņi nebija pirms brīža. Un tad tas viens ir maz sexier jo I zinu, es zināju, ka konceptuāli pārbauda ir rūtiņu vārds. 

[00:21:40] Tāpēc es varu tikai izmantot izsaukuma punkts, lai teikt, ja pārbaude nav checked-- tas Bula vērtība, patiess vai false-- Es kliegt lietotājam šī iemesla dēļ. Pretējā gadījumā, ja mēs pārdzīvot visi no šiem nosacījumiem, pieņemsim tikai atgriezties taisnība. Ļaujiet jāiesniedz forma. Un tas būs, tad notiks. 

[00:21:56] Pieņemsim ierakstiet tumšsarkanā. Let 's pārbaudīt lodziņu, noklikšķiniet uz Reģistrēties. Un tagad es iet cauri uz galamērķi. Tagad tur nav datu bāzes tur. Tur nekas interesants in register.php. Man vajadzēja tikai kaut ko faktiski runāt. Tāpēc ļaujiet man pauze, šeit. Visus jautājumus par to, kas mēs esam tikko veikts vai ko daži no šī jaunā sintakse ir? OK, jā? 

[00:22:17] Mērķauditorija: Tāpēc jebkura rūtiņa ir automātiski Būla. Jums nav jādeklarē, piemēram, ka. 

[00:22:21] DAVID J. Malan: Pareizi. Jebkurš rūtiņa, kas ir nosūtīts uz jums no HTML formu, lai jūsu JavaScript kodu tiks apstrādāti, jā, jo Būla value-- patiess vai nepatiess. Tas ir labs jautājums. Tā kā citām vērtībām, no Protams, ir bijuši tekstu, AKA stīgas. 

[00:22:36] Viss ir labi, tāpēc ļaujiet man attīt mazliet tālāk. Kāds bija viss punkts šo? Tikai, lai būtu skaidrs. Tāpat, mēs jau zinām, pat no Pset7 un pat no pagājušās nedēļas lekciju piemēri, ka mēs, protams, var pārbaudīt $ _GET $ _POST Redzēt, ja lietotājs dod mums tukša vērtība. Atceros tukšo funkciju PHP. 

[00:22:54] Tik vienkārši, lai būtu skaidrs, kas ir viens no iemesliem, mēs varētu arī vēlas darīt šo kļūdu pārbaudi iekšpusē pārlūku? Kāda ir motivācija šeit? Yeah. 

[00:23:06] Mērķauditorija: Ātrāk, un jums nav nosūtīt bezjēdzīgi datus uz serveri. DAVID J. Malan: Labi. Tas ir ātrāk. Jums nav sūtīt bezjēdzīgi dati uz serveri. 

[00:23:12] Tātad jūs saņemsiet atpakaļ vairāk tūlītēja reakcija. Un kopumā, lietotājs pieredze ir labāka. Padomā par alternatīvu. 

[00:23:17] Ja Gmail-- un bija gadījums pirms daudziem gadiem. Pieņemsim, ka jums jaunu e-pastu ar savu Gmail kontu, bet vienīgais veids, kā caur redzēt, ka ir, piemēram, pārlādēt visu lapu. Vai, pieņemsim, jūs noklikšķiniet uz saite, lai lasītu e-pastu. 

[00:23:29] Viss ir tik pārlādēt ka jūs varat redzēt e-pasta adresi. Vai Facebook-- jums tērzēšanas ziņu. Jūs neredzat to, kamēr jūs pārlādēt lapa vai noklikšķiniet uz kādu saikni. 

[00:23:36] Tāpat kā, tas būtu briesmīgi kaitinošas lietotāju pieredzi. Un tas ir tas, kas tas bija, piemēram, skaidri, atpakaļ, kad es ilga UC un web bija daudz mazāk dinamiska un JavaScript nebija tik popularizēts kā tas ir tagad. Un viss kļūst daudz dinamiskāku un vēl daudz vairāk klienta puses šajā ziņā. 

[00:23:49] Bet tur ir nozvejas šeit, un tas ir sava veida kaitinošas Gotcha. Tikai tāpēc, ka jūs pievienot klienta pusē noteikšanas, piemēram, tas nenozīmē, Jūs varat vai vajadzētu atteikties servera pusē atklāšanu. Jūs būtībā vēlaties, lai jūsu kļūdu pārbaudi abās vietās. Tāpēc, ka to, kas bija viens Stundas uzzināja No raksta es izlasīju dažus fragmentus No šīs stulba CMS system-- Content Management System-- kas bija Īstenojot savu autentifikācijas sistēmu, tā pieteikšanās pa kādam mehānismam? JavaScript. 

[00:24:20] AUDITORIJA: JavaScript. DAVID J. Malan: JavaScript, tieši tā, labi? Tas bija, izmantojot JavaScript. Un burtiski, jūs guys ir spēlēja mazliet iespējams ar Chrome inspektors. Un, ja es varu atrast to, pārbaudīt elementu. 

[00:24:30] Ļaujiet man iet pāri darīt visas Chrome iespējas. Un tas ir, cik viegli tas ir, lai atslēgt JavaScript pārlūkprogrammā. Pārbaudiet, ne vairāk JavaScript. 

[00:24:38] Tātad taisnīgumu, daudz web šajās dienās ir tikai gatavojas lauzt, jo Gmail un citas sites-- Facebook-- pieņemt, ka JavaScript ir iespējots. Bet, ja jūs darāt kaut ko stulbu piemēram, tikai apstiprinot lietotāji ievadi un pārbaudīt to kļūdas klienta pusē, pretinieks var viegli izdarīt. Un tad vēl gudrāku Pretinieks patīk jums, puiši tagad varētu izmantot Telnet vai Curl vai tikai komandrindas komandas un faktiski nosūtīt ziņojumus serverī kas tāpat nav ERROR pārbaudīti. 

[00:25:05] Tātad tas ir vairāk lietotāja saskarne lēmums nekā tas ir faktiski tehniska improvement-- īstenojot kaut klienta puses, kā šis. Tāpēc tagad ātrs skatiens, bet tad Es piekāpjas tiešsaistes staigāt caur šo vienu. Formā diviem, mēs faktiski gāja cauri un sakopta Koda mazliet. Bet ļaujiet man atliek vienam no video, mēs, visticamāk iegult Pset8 ka tikai parāda jums Līdzīga sintakse, izmantojot bibliotēku sauc jQuery, kas ir super, super populāra bibliotēka JavaScript ka atklāti lielākā daļa cilvēku tikai izmantot šīs dienas un pat sajaukt kā būtne JavaScript pati. 

[00:25:37] Un tai ir tendence iesaistīt daži dolāra zīmes un atslēgas vārdi, piemēram, dokumenta iekavās šeit. Bet atkal, ļaujiet man atliek daži lēnāk konsultācijas tiešsaistē nevis piesaistīt sevi tikai sintaksi. Pieņemsim pāriet uz kaut nedaudz vēsāks attiecībā uz pieteikumiem par to. 

[00:25:50] Tāpēc jo īpaši, ļaujiet man iet priekšu un atvērt šo šeit. Come on. Tur mēs ejam. 

[00:25:59] Ļaujiet man atvērt šo attēlu šeit. Nevajadzīgi sarežģīta meklē, bet tas apraksta metodi, ko sauc AJAX-- Asynchronous JavaScript un XML, kur X XML ir faktiski vairs īsti izmanto. Tā ir tendence, lai izmantotu kaut ko cits sauc JSON. 

[00:26:13] Bet šeit ir veids, kā kaut kas līdzīgs Google Maps vai Google Earth darbojas. Mēģināsim šo par lidot, faktiski. Ļaujiet man iet uz priekšu un atvērt up Chrome par manu pārlūku. 

[00:26:21] Un ļaujiet man iet, saka, maps.google.com. Un, patiesībā, ja jūs esat vecs pietiek atcerēties, ko, piemēram, MapQuest bija kā atpakaļ dienā, un varbūt viņi joprojām strādā kā šis. Kad jūs izmantot, lai meklētu something-- 33 Oxford Street, Cambridge, Mass, darīsim this-- tevi tiešām, ja jūs gribēja panna augšu un leju, pa kreisi un pa labi, jūs varētu izskatīties liels bultiņa uz augšu, un tas parādīs jums citu rāmis kartē šeit. Vai jūs noklikšķiniet uz pa kreisi un jums varētu iet vairāk nekā šeit, vai cits klikšķis un jūs varētu iet vairāk nekā šeit. Bet tā vietā šie dienās, mēs, protams, vienkārši pieņemt par pašsaprotamu, ka mēs varam iet ap Cambridge diezgan ātri vienkārši noklikšķinot un velkot. Bet paziņojums tur ir dažas glitches. 

[00:26:59] Ja es to izdarītu pietiekami ātri, ko, šķiet, ir noticis kā es velciet pārāk ātri par datoru, lai sekot līdzi? Ko jūs redzat? Yeah. 

[00:27:07] Mērķauditorija: Ar pikseļi nav atsvaidzināt. DAVID J. Malan: pikseļi nav atsvaidzināt. Ir actually-- un jums varēja redzēt to, patiesībā, ja jūs skatīties tiešsaistē un pauzes tas vai tiešām palēnina lietas leju lai once-- jūs redzēsiet, ka tur ir flīzes, laukumi, vai taisnstūri, ka trūkst karti līdz split otrais vēlāk, vairāk datu, vairāk bildes faktiski parādās uz ekrāna. Un patiesībā, ja mēs to darām, meklējot up Chrome's-- teiksim, Chrome-- redzēsim. Mēs nevaram darīt. 

[00:27:31] Ak, Vai!. Pieņemsim atvērt maps.google.com. Ļaujiet man logs lielāks vēlreiz. 

[00:27:36] Iet atpakaļ uz 33 Oxford Street. Kāda bija mājaslapa man bija nesen? Man bija šī, piemēram, privātā skaļas frāzes, lai sevi, ka es gribētu, tad tūlītējo ziņojumu kāds draugs, kurš bija online kuri vēlējās dzirdēt. Tur ir dažas mājas lapā. Es domāju, ka tas ir tik Comcast-- ļoti liels amerikāņu ISP. Jūs varat, kad pierakstīšanos jauna kabeļa modema pakalpojumu vai kabeļtelevīzijas pakalpojumu, viņiem ir forma ļoti saprātīgi kur viņi lūdz jums par jūsu adresi. Un ir šī pārsteidzošs funkciju sauc auto pabeigta, piemēram, Google, kas sāk aizpildīt ir atbilde uz jūsu jautājumu. 

[00:28:04] Problēma ir tā, tie auto pabeigta par pirmajām lietām, ko rakstāt. Tātad, ja jūs sākat rakstīt 33, to parādīs burtiski katrā mājā Amerikā, kas sākas ar numuru 33 pirms došanās uz sagaida, lai jūs rakstīt vairāk. Tātad, ja jūs tipa 33 Oxford, tad tas liecina, jums katru ielu Amerikā, kas ir 33 Oxford tās nosaukums, neatkarīgi no pilsētas kas tu esi. 

[00:28:25] Un tad jūs turpināt rakstīt. Un visbeidzot, tā saprot, ka tie nav piedāvā pakalpojumu, lai jūsu mājās Kembridžā vai kaut kas tamlīdzīgs. Bet jautājums ir, tas ir visvairāk muļķīgs īstenošana auto pabeigtu jebkad. 

[00:28:34] Un es esmu tikai gatavojas off par šo pieskari vēlreiz. Bet ir labi veidi izmantot JavaScript un slikti veidus. Un tas nebūt nav labākais. 

[00:28:40] Bet punkts šeit, pirms šī pilnība, bija atvērt instrumentus leju šeit un atvērt izstrādātāju rīki, kā mēs esam aicināti iepriekš, un skatīties Network tab kā es noklikšķiniet tiešām ātri. Un paziņojums visu ķekars no get pieprasījumi noticis. Tas viss notika, jo es vilka. 

[00:28:57] Un, visticamāk, patiešām daudz no šiem rindām tagad attēlu slash JPEG MIME tipi vai satura veidi. Tas ir tāpēc, ka tas, ko hroma dara Katru reizi, kad es noklikšķiniet un velciet, noklikšķiniet un velciet, ir tā neapzinoties, ak, es jāiet lūgt Google flīze kartē, kas ir vairāk nekā šeit, ātri lejupielādēt to, izmantojot HTTP, un tad pievienot to tā saukto DOM uz tīmekļa pārlūkiem atmiņas kokā atveidojums tā, ka lietotājs, mani, redz, ka atjauninātā flīzes. Un tas ir tāpēc, ka tehniku ​​sauc AJAX. Atpakaļ dienā, tas tiešām bija gadījums, ka, ja jums gribēja, lai mainītu to, kas ir uz ekrāna, Jums būs noklikšķiniet uz augšu, uz leju, pa kreisi, labi. Un tad jauna lapa varētu atvērt. Bet šajās dienās, viss ir dinamiskāka. Tas notiek tā, kā mēs cilvēkiem būtu ceru, ka tas tiešām būtu interaktīvi. Un tas sasniegts, veids, kā metodi, ko sauc AJAX, kas ir iespējams, vislabāk izskaidrot ar piemēru. Pirmkārt, ļaujiet man iet uz priekšu un atvērt failu sauc quote.php in šodienas izplatīšanas kodu. 

[00:29:53] Un tad ļaujiet man darīt symbol-- Whoops. Ļaujiet man darīt simbolu = GOOG lai tikai dažiem krājumiem. Vai tiešām, pieņemsim do viens no PSET BEZMAKSAS. Enter. 

[00:30:05] Un tagad paziņojums, ko es saņemt atpakaļ. Tātad tas ir patiešām Īsumā PHP failu, ka es rakstīja, ka vienkārši aizņemas kodu No Pset7 s uzmeklēšanas funkcijas un atklepo izmantojot šo cirtaini lencēm un citātus un resnās zarnas apzīmējums, acīmredzot, Pašreizējais cena par uzņēmums, kas jums pāriet caur GET. Tātad, tas ir atšķirīgs no lielākās daļas to, ko mēs esam darīts šajā paziņojumā es esmu burtiski spitting veic kāda izskatās JavaScript kodu. 

[00:30:27] Faktiski, tas ir JavaScript objekts. Patiesībā, tikai, lai būtu vairāk skaidrs, JavaScript Object Notation-- JSON-- ir tikai iedomātā veids, kā pateikt, ka jums var pārstāvēt datu JavaScript daudz kā jūs varat PHP izmantojot atslēgas vērtību pārus. Tātad, ja es gribēju paziņot mainīgais JavaScript lai pārstāv Zamyla, lai instance-- struct par Zamyla-- un mēs to saucam students, šis mainīgais. Viņas ID ir viens, māja ir Winthrop, un vārds ir Zamyla. 

[00:30:53] Bet es varu arī būt masīvs objektiem. Tātad, ja es tiešām gribēju, lai būtu masīvs JavaScript satur vairāki šādi objekti, šis laiks, kas pārstāv darbiniekus, Es varētu būt šīs trīs gabalos koda atpakaļ atpakaļ atpakaļ uz šiem Trīs bijušie darbinieki. Tātad sintakse, diezgan līdzīgi both-- PHP. Bet tas ir īpaši JavaScript. Tas ir objekts notācija. Tātad, kas tas ir noderīgi? 

[00:31:17] Ja es rakstīt kodu, kas atklepo JSON-- JavaScript Object Notation-- sīkumi, ka izskatās šādi, vai lietām, kas izskatās Zamyla struktūru, Es patiesībā var izmantot šo programmās es rakstīt. Ļaujiet man iet uz ajax0.html. Un tas too-- nav daudz doma dota estētiku. Bet skatīties, kas notiek. 

[00:31:34] Ļaujiet man iet uz priekšu un ierakstiet bezmaksas šeit. Noklikšķiniet uz Saņemt piedāvājumu. Un paziņojums URL nav mainījusies. Bet I did get pop up ar acīmredzami šodienas penijs akciju cena sākot ar $ 0.15. Tāpēc ne viss, kas slikti. Bet atšķirība ir tā, ka kaut kā, šie dati atnāca atpakaļ uz mani tieši. Bet pieņemsim solis kaut kas vairāk pazīstams. Jo šīs versijas viena, let me tipa free atkal, noklikšķiniet uz Saņemt piedāvājumu, un now-- oh, tas bija faktiski jQuery versija. Tāpēc ļaujiet me-- man nav ātri uz priekšu pilnīgi pietiekami tālu. Ļaujiet man iet uz versiju diviem, kas ir, ja es gribēju. Paziņojums, ko es esmu darījusi šeit. Man ir web page-- super vienkāršs versija jebkurā tīmekļa lapā jūs varētu izmantot šodien ar teksta laukā šeit par brīvu, un tad acīmredzot vienkārši teksta. 

[00:32:14] Tas nav veids, šeit, acīmredzot. Bet, ja es noklikšķiniet nokļūt quote, ievērosiet manu mājas lapu ir par pārmaiņām, it kā I tikko ieguva jaunu tērzēšanas ziņu vai tā, it kā es tikko pārcēlās karte un nepieciešams, lai iegūtu vairāk datu pievienots dinamiski mājas lapā bez URL mainīgajā un lietotājam pieredze kļūst pārtraukta. Patiešām, es esmu vēl Precīzs pats place-- ajax2.html. 

[00:32:35] Tātad, aplūkosim tikai šo piemēru un redzēt, kā tas notiek. Ļaujiet man iedziļināties ajax2.html. Un paziņojums veidlapu pirmās. 

[00:32:44] Šeit lejā, es esmu pagrieziena off auto pabeigta. Dažreiz tas izpaužas kaitinošas, ja pārlūkprogramma mēģina parādīt jums visa tava vēsture. Tātad, jūs varat darīt to ar HTML vienkārši sakot, auto pabeigtu off. 

[00:32:53] Es esmu devis šo teksta laukā symbol-- drīzāk ID simbolu. Un tagad, tā ir interesanta iezīme. Mēs neesam runājuši par sprīdī, bet jūs varat domāt par to kā punktu birku vai div tag. Tas ir tas, ko sauc in-line elements, kas nozīmē, ka jūs nesaņemsiet rindkopu break virs un zem tā. Tas ir tikai gatavojas palikt tiešsaistē bez hitting ekvivalentu ienākt. Tāpēc man ir dota šī rieciens HTML ko nosaka ar unikālu identifikatoru ka es patvaļīgi sauc cenu. Un man ir pogas Iesniegt. 

[00:33:21] Jo tagad up here--, un tas ir tiešām super pārsteidzošs, cik maz kods jūs varat rakstīt darīt samērā veikls things-- paziņojums, ko es esmu darījusi šeit, ja I ritiniet līdz galvas šīs lapas. Es esmu iekļauts pirmais mana galva skriptu tag kas faktiski atsauces JavaScript failu citur. Tas ir no organizācijas ka raksta jQuery, un tas ir tikai sniedzot jums jaunāko versija par to jQuery bibliotēka. 

[00:33:42] Tātad šis ir veids kā asu iekļaut C vai pieprasīt PHP. Jūs varat izmantot skriptu tagu ar avota atribūtu. Bet tagad mana kods ir būs tieši šeit. 

[00:33:52] Paziņojums Man ir funkcija sauc Quotes. Un tas izskatās mazliet mistisks pēc pirmā acu uzmetiena. Bet pieņemsim diedelēt šo intervālu. Dodiet man mainīgo sauc URL. Piešķirt to burtiski šo virkni. Tātad, vienu pēdiņām, pēdiņas in JavaScript tikai dod man virkni. Kāda plus darīt? Konkatenācija. 

[00:34:08] Tāpēc tagad tas ir jQuery sintakse kas aizņem mazliet kļūst izmantoti, lai. Bet tas tikai nozīmē, iet saņemt man DOM mezglu, kura unikālais identifikators ir simbols. Hashtag tur nozīmē unikāls identifikators simbols. 

[00:34:21] Dolāra zīme iekavās tikai nozīmē, wrap šis jQuery veida slepeno mērci tik Jūs saņemsiet papildus funkcionalitāti. Un tad .val acīmredzot funkcija, vai kā mēs sakām tagad, metode iekšpusē šī mezglā ka tikai dod jums vērtību. Tātad īsumā, neglīts un mulsinoši kā tas izskatās no pirmā acu uzmetiena, tas tikai nozīmē nokļūt ar lietotāju drukāti in, nodot to beigās string ko concatenating to. Tas ir viss. 

[00:34:43] Tāpēc tagad, pēdējās trīs rindas. Jūs varat saspiest daudz funkcionalitāte no trim līnijām. Šis dolāra zīmi, kā malā, ir tikai iesauka par īpašu globālu mainīgo sauc burtiski jQuery. 

[00:34:55] Dolāra zīmi tikai izskatās cool. Tātad jQuery kopiena tikko veida par to izmanto kā savu īpašo simbolu. Tas nenozīmē to, ko tas nozīmē, PHP. JavaScript, dolāra zīme ir tāpat kā alfabēta burtu vai numuru mainīgo. 

[00:35:07] Jūs varat vienkārši ir to kā nosaukumu. Tikai izskatās cool. Tātad sabiedrībā to pieņēma kā segvārdu par savu bibliotēku sauc jQuery. 

[00:35:13] Un tas ir super populāra. Tātad iegūt JSON ir tieši tā. Tā ir funkcija, kas ļaudīm jQuery rakstīja kas izpaužas JSON no server-- JavaScript Object Apzīmējumi. No tā, ko URL tas notiek lai saņemtu šo informāciju? Acīmredzot no šejienes šo URL. 

[00:35:27] Un ko vajadzētu pārlūku darīt, kā tiklīdz tā saņem atpakaļ šo atbildi? Un tas ir burvju AJAX, tāpēc, lai speak-- Asynchronous JavaScript XML. Tas ir grūti, lai redzētu, ar šādu Vienkāršs piemērs, kā mums bija šeit. 

[00:35:41] Bet tas bija asinhronā in sajūta, ka mans kods, ja izpildīts nosūtīja vēstuli serveris iet saņemt man JSON. Un tas notika super ātri ka es saņēmu atbildi. Bet kas ir interesanti ir tas, ka šis līnija koda nav pakārt manu datoru. 

[00:35:55] Es neredzēju vērpšanas ikonu. Es nezaudēja spēja pārvietot manu peli. Mans pārlūks patiesībā bija perfekti labi. 

[00:36:01] Jo kā JavaScript rokturi atbilde no servera, ir šādi. Jūs reģistrēt to, ko jūs vēlaties zvanīt atzvanīšanas funkcija, kas tikai nozīmē, hey, JavaScript. Tiklīdz serveris atbild ar JSON, zvaniet šo anonīmo funkciju. 

[00:36:18] Un, lūdzu, nonāca šīs funkcijas neatkarīgi no stīgu serveris izspļaut kā argumentu sauc datus. Tātad citiem, vārdiem, ja Es esmu montāža dinamiski URL quote.php iet šajā simbolu, piemēram, bezmaksas vai GOOG vai plauktiņš, Es tad saku JavaScript iet saņemt šo URL. Atcerieties, ka pārlūku gatavojas atgriezties kaut kas izskatās kā mēs redzējām earlier-- šo. 

[00:36:42] Un ko Otrs arguments šeit, lai iegūtu JSON saka ir nosaukt šo funkciju kad serveris saņem atpakaļ vai tas ir 10 milisekundes no šī brīža vai 10 sekundes no tagad. Un, tiklīdz jūs, pievienot cenu lapu. Tas sintakse šeit tikai nozīmē iet saņemt mezglu no koka, kuras unikālais identifikators ir price-- mēs redzējām iepriekš minētajā posmā. 

[00:37:01] Šī metode sauc HTML vienkārši saka, iet aizstāt HTML, kas ir tur ar data.price. Kas ir data.price? Nu, pārlūku, atgādināt, parādīja man šo nāk atpakaļ. Tāpēc tas ir datu. 

[00:37:14] Un tā tas ir nedaudz noslēpumains redzēt komatus šeit. Bet patiesībā, ļaujiet man darīt. Ļaujiet man tikai ielīmēt reālā ātri uz gedit un parādīt to kā mēs parādīja Zamyla struktūra agrāk. 

[00:37:27] Kas serveris sūta atpakaļ ir maz, objekts, kas izskatās šādi. Un tā ir data.price tikai dod man 0,1515. Tik daudz kustīgu daļas šeit visu uzreiz. 

[00:37:39] Bet būtiskus secinājumus, ir ka mums ir šī iespēja veikt papildu HTTP pieprasījumi, izmantojot JavaScript bez pārlādēt lapu. Un tad mēs varam reāli mainīt tīmekļa lapu par lidot. Un izrādās, ka JavaScript un citas valodas var izmantot, tagad ne tikai mutācijas tīmekļa lapas, bet faktiski rakstīt programmatūru ar faktisko datoru, ne tikai tikai uz Chrome vai tamlīdzīgi. 

[00:38:00] Patiesībā, if-- Colton, varētu tevi vēlētos pievienoties mums atpakaļ šeit ar savu lab kodu, un Chang, kā arī? Iesim uz priekšu, tam runāja par anonīmas funkcijas un atzvaniem un tiešām kārdināt liktenis šeit ar dzīvu demo ar asiņošanu mala tehnoloģija, kas ir viens no šie Elite Motion ierīces. Tagad šī ierīce, atgādināt, ir maz USB ierīce kā arī that-- tas beautiful-- ka sveces, lai jūsu USB porti. 

[00:38:25] Un tad tā sniedz ieguldījumu veidā cilvēka žesti atklājot, izmantojot infrasarkanos starus, būtībā, kustības no rokas. Tādējādi, kaut kādi Maria mēģināju , pirms bija muskuļots, tiešām sajūta par to, kas mainās jūsu rokas, tas ir infrasarkanais pamatā. Tāpēc tas meklē pārvietošanu veida sfērā kājām, vai arī tā pašas ierīces. 

[00:38:46] Tātad, kāpēc ne es stab pie šī pirmā? Un iesim uz priekšu un mest Jums līdzi virs galvas šeit. Tātad pieņemsim likts Colton ir klēpjdators šeit. Mēs esam ieguvuši Andrejam televizorā. Un ko jūs vēlētos man darīt vispirms? 

[00:39:00] COLTON: Iet uz priekšu un vienkārši likt rokas pār šo puisi un jūs redzēsiet dažas pasakains mirdzēt. 

[00:39:04] DAVID J. Malan: Ļoti jauka. Tas viss notiek reālajā laikā. OK. Visas tiesības, un yep. Tik jauki. Visas tiesības, ko vēl mēs varam darīt? 

[00:39:15] COLTON: Doties uz nākamo ekrānu un redzēt. 

[00:39:17] DAVID J. Malan: Nu labi. 

[00:39:19] COLTON: fun maz spēle kur jums veikt roboti. 

[00:39:21] DAVID J. Malan: Labi, tāpēc šī ir viltus rokas rāda man, ko darīt. COLTON: Jā Tik iet uz priekšu un greifers viens no blokiem un nodot to uz augšu, ka robota ķermeni. DAVID J. Malan: Ak, tur ir mana roka. Oh. Labi, adorable. Pagaidiet minūti, OK. Tur mēs ejam. 

[00:39:41] COLTON: Es vienu par negadījumu. 

[00:39:43] DAVID J. Malan: Labi, es nopirkšu šo puisis. Damn it! Kad mēs praktizē šis pēdējais nakts, jūs zināt, ko tas nodotas vērā? 

[00:39:51] Tāpat kā šī. OK. Nākamais? 

[00:39:55] COLTON: Protams. 

[00:39:56] DAVID J. Malan: Labi, un tur ir trešais. Labi. COLTON: Un šo vienu, jūs saņemsiet kuri paredzēti, DAVID J. Malan: Ak, tas viens ir skaista. COLTON: --yeah, pick izņemot šo ziedu. DAVID J. Malan: Labi. Nē? Garām. 

[00:40:14] COLTON: Ak, tur jums iet. 

[00:40:15] DAVID J. Malan: Ah, Paskaties, ka. Ļoti jauki. Nu, kāpēc dont "mēs no vienas brīvprātīgais šeit kas vēlas nākt uz augšu. Kā par turpat zaļajā, tas ir? 

[00:40:27] Visas tiesības, un pieņemsim have-- tā vietā, lai to dara, daži no jums varētu zināt šo spēli here-- sagriež virvi, varbūt? Paskatīsimies. Mums ir mūsu glāzes vairāk nekā šeit? 

[00:40:37] OK. Paldies. Kāds ir tavs vārds? 

[00:40:39] AUDITORIJA: Laura. 

[00:40:40] DAVID J. Malan: Laura? Jauki redzēt. Ja jums nav prātā, liekot Google Glass pār jūsu brilles. Tas ir Colton. 

[00:40:46] COLTON: Hi. Priecājos ar jums iepazīties. 

[00:40:48] DAVID J. Malan: Labi, come on apkārt. Labi, lai to, ko jūs gatavojas darīt šeit, kam ir bijusi pirms, ir nodot savu roku pār Leap Rezolūcijas šeit. Un tagad jūsu arrow vajadzētu virzīties. Ak, nē. 

[00:40:57] AUDITORIJA: Nē. 

[00:40:58] DAVID J. Malan: Mēs negribu atmest vēl. Labi, pagaidiet. Nekā šeit. Tātad paziņojums, kā jūs turiet savu pirkstu pār kaut ko, pele sāk iet zaļa, kas ir, kā jūs noklikšķiniet. 

[00:41:06] Tātad lidināties virs Play. Un tikai viens pirksts ir labi. Un tagad noklikšķiniet uz maz zaļā puisis pa kreisi. Un tagad turēt līdz tas piepildās zaļa. Labi. Tagad, piemēram, vienu līmeni uz augšu augšas. 

[00:41:16] Mērķauditorija: Jā, mēs vēlamies vienu līmeni, šeit. 

[00:41:20] DAVID J. Malan: Labi. Labi, tāpēc viss, kas jums to darīt, ir samazināt virvi. Jūsu kursors ir balta viena tur lejā. 

[00:41:28] Ļoti jauki. Viss ir labi, tas ir par iegūt grūtāk. Tā turēt pirkstu pār nākamo tagad. Labi. Tas viens ir grūti. 

[00:41:39] Mērķauditorija: Ak crap. OK. Tā vēlas iet šo ceļu. Oh crap, that-- 

[00:41:44] DAVID J. Malan: Jā. Sekundārais mērķis ir iegūt visas zvaigznes. Labi, nākamo. 

[00:41:53] Let 's redzēt, ja jūs varat saņemt šo trešo vienu. Labi. Labi, iet tur. 

[00:42:06] Pārliecināts. Ak, ļoti jauki. Labi. 

[00:42:11] Tātad, kāpēc nav mēs atlikt šeit šodien? Let kāds nāk uz augšu, kurš vēlas spēlēt. Pateicoties tik daudz, lai Laura mūsu brīvprātīgo. Un mēs redzēt jūs pirmdien. 

[00:42:18] Mērķauditorija: Jūs droši vien vēlaties tiem atpakaļ. 

[00:42:21] SPEAKER 2: Nākamajā CS50--