DAVID J. Malan: Në rregull, kështu që kjo këtu është krahu Myo band, disa prej të cilave ne kanë për projektet CS50 përfundimtare. Dhe kjo ishte një demonstrim ne pritje ju paraprakisht ku në thelb ky krahu mjaft i ngushtë band këtu dëgjon për lëvizjet tuaja muskulare të cilat janë plotësisht pastaj në software për laptop Colton-së mbi të cilat këtu kishte iTunes dhe se Kënga tashmë queued lart. Në vend se me demoing këtë, Colton ka qenë në laborator në mënyrë të qartë gjatë gjithë javës duke marrë një demonstratë gati për një vullnetar të guximshëm. Nëse dikush do të donte për të ardhur në up-- pa dorën tuaj të parë. Come on up. [00:01:09] Dakord. Dhe çfarë është emri juaj? [00:01:13] AUDIENCA: Uh, Maria. [00:01:14] DAVID J. Malan: Maria, e bukur për të parë ty. Come on këtu. Më lejoni t'ju prezantoj me Colton. Colton, kjo është Maria. [00:01:21] COLTON: Hi, nice to meet you. [00:01:23] DAVID J. Malan: All të drejtë, kështu që hap një, ne jemi do të keni vënë kjo në të parakrah tuaj kështu që kjo është goxha shtrënguar deri në afërsi bërryl tuaj. Dhe ndërkohë, le të kemi vënë në Google Glass tonë dhe ne do të përzierje teknologjive sot. [00:01:33] COLTON: Së pari, ne do të duhet të lidh këtë në gjërat. [00:01:36] DAVID J. Malan: OK. Në fakt, le të vënë krahun tuaj si afër këtë kabëll të jetë e mundur kështu që kemi parë mund të sync atë. [00:01:41] COLTON: Le ta bëjmë këtë. [00:01:42] DAVID J. Malan: Dhe ndërkohë, kështu që të gjithë mund të merrni një shikim më të ngushtë, ne do të hedh kamera Andrew up në ekran atje. Pra, ne kemi një kabllo USB që është u mbyllën në armband Marias. Dhe më lejoni të hedh ekran COLTON-së deri në projektor tjetër. [00:02:00] Pra Colton është duke regjistruar pajisje tani si një Myo lidhur me këtë kabëll. Dhe tani çfarë Maria-së do të bëjë një çast është në të vërtetë ecin nëpër hapat kalibrimit dhe mësojnë software si muskujt e saj përgjigjet kur ajo të bëjë të sigurt para-përcaktuar lëviz se e kupton software. Nëse ju dëshironi të shkoni në para të ekranit. OK, të mbajtur duke u përpjekur. [00:02:30] COLTON: Go si kjo. Dhe si kjo. Dhe të gjitha rrugën në të djathtë. Kthehu prapa. [00:02:35] DAVID J. Malan: OK. Perspektiva të ndryshme. Kjo nuk është që ju. Kjo na është. [00:02:40] MARIA: OK. DAVID J. Malan: Jo Le të lëvizin atë më lart kështu që është e afër bërryl tuaj, apo edhe më të forta. Dakord. [00:02:52] Këtu ne do të shkojmë. Kjo do të jetë një kohë e mirë për CS52X. Nuk shkojmë. [00:02:57] Very nice. OK. Thumb të Pinky. [00:03:02] Very nice. Përhapjen gishtat. Të mirë. Valëvitur drejtë. Është interesant që tregon ju me hand-- majtë [00:03:17] COLTON: Po, kjo është e pazakontë. DAVID J. Malan: Vala për drejtë dhe të shkojë përpara. Fast përpara për të kaloni ose të ardhshëm. Kjo është e drejtë Vala OK. [00:03:25] MARIA: I don't-- prisni. [00:03:26] DAVID J. Malan: Nevojë për ndihmë? [00:03:28] COLTON: Pra, ju jeni duke shkuar si kjo. MARIA: Është kthyer gjë tjetër, edhe pse. COLTON: Kjo është. DAVID J. Malan: Po unë nuk e di pse kjo është duke ju shfaqur një leftie. COLTON: Pse nuk try-- vetëm provoni duke shkuar si kjo. [00:03:38] DAVID J. Malan: Jo? Ndoshta arrijnë krahun tuaj nga një drejte të vogël dhe të bëjë atë më të papritur si kjo. Po, OK, eja. [00:03:48] MARIA: Unë jam i keq. DAVID J. Malan: Nuk është faji juaj. COLTON: Kjo është në rregull. DAVID J. Malan: All drejta. Well-- [00:03:56] MARIA: A duhet të kaloni këtë, atëherë? DAVID J. Malan: Po, le të ju lejojnë off hook. Pra, nëse dikush do të donte për të bërë një Projekti final duke përdorur këtë avantazh prerjes hardware, të kuptojë se mund vetëm të marrë pak duke u përdorur për të. Dhe this-- realiteti është ky është në të vërtetë shumë gjakderdhje buzë. [00:04:10] Kjo është ajo që quhet kit zhvilluesi i saj, i cili është menduar të jetë në thelb një para-release në mënyrë që njerëzit mund të bëjnë pikërisht this-- luftojnë me të, figura se si trupat e njerëzve punojnë me teknologjinë. Pra, nëse ju doni më pas, pas ligjëratës, ne mund të ju lejojnë të vijnë dhe të marrë një goditje me thikë në atë. Por ndryshe, një raund të duartrokitje, nëse ne mund të, sepse Maria për të ardhur në dorë. [00:04:26] MARIA: Ju faleminderit. [00:04:28] DAVID J. Malan: Ju faleminderit. Ne do të ul receptorin e telefonit për në këtë, por ne do të japim you-- si në lidhje me një top stresi këtu? Oh, and-- if-- yeah, thanks. Dakord. Kështu që për kurioz, nëse ju keni qenë panjohur me zgjedhje të shëndoshë që kemi bërë atje më parë, një TV mahnitshme tregojnë se ju duhet absolutisht të jetë qejf-shikuar në Netflix është kjo këtu. [00:04:51] Gjuha 1: Zonja dhe zotërinj, një magjistar i quajtur Josh. [00:05:04] DAVID J. Malan: Dhe me sa duket, kjo është një gjë për tekst më gjatë leksionit tani. Unë jam duke u thënë se Maria kishte një ditëlindjen dje. Pra, happy birthday nga CS50 me Maria si. [00:05:18] Kështu që ju mund të keni lexuar në muajin e fundit se kjo zotërinj këtu, Steve Ballmer, i cili ishte në të vërtetë klasë të 1977 në kolegj, në pension kohët e fundit për Microsoft. Ai ishte një universitare këtu, pas nja dy vjet më vonë e gjeti veten në Stanford Business School kur ai mori një telefon telefononi nga një mik i cili tij kishte jetuar poshtë sallë prej tij këtu në Harvard. Emri i atij mikut ishte Bill Gates, dhe në atë kohë, ai ishte duke u përpjekur për të rekrutuar Steve të jetë personi i parë të biznesit, me të vërtetë, në një kompani të vogël emrin Microsoft. [00:05:45] Një histori të gjatë të shkurtër, Steve u fitua në fund të fundit gjatë, u bashkua me Microsoft kur ata kishte vetëm 30 të punësuar. Dhe nga koha që ai në pension kohët e fundit, kompania kishte 100.000 të punësuar gjatë viteve të fundit. Dhe kështu një website i njohur si prag përgatitur këtë haraç në video që ne menduam se do të të përbashkët që ju jep një ndjenjë të vetëm se sa shumë energji Steve sjell në çdo prezantim që ai jep. [VIDEO Playback] -Microsoft Është si një fëmijë të katërt. Fëmijët bëjnë të largohet nga shtëpia. Në këtë rast, unë mendoj Unë jam duke e lënë shtëpinë. Hey Bill, whazzap? [00:06:23] -Wazzap? [00:06:24] -Hej, Wazzap? Ne kemi qenë të dhënë një mundësi të mëdha. Dhe Bill na dha këtë mundësi. Unë dua të falënderoj ligjin për këtë. Unë dua që ju të too. Ritmi i inovacionit nuk do të ngadalësohet. [00:06:42] Ajo do të merrni më të shpejtë dhe më të shpejtë. Nuk mund të jetë një konkurrentë pak të cilat janë eliminuar për fat të keq! [00:06:54] I love this kompani. Po! Unë jam një PC, dhe unë e dua këtë kompani! [00:07:08] Zhvilluesit, zhvilluesit, zhvilluesit, zhvilluesit, zhvilluesit, zhvilluesit, zhvilluesit, zhvilluesit. Po! Hartuesit Web! [00:07:19] Hartuesit Web! Hartuesit Web! Dëgjoni se çfarë tjetër ju merrni pa pagesë shtesë! [00:07:28] Ekzekutiv MS-DOS, një takim kalendar, një grumbull kartë, një bllok shënim, një orë, një panel kontrolli. Dhe, ju mund të besoni atë? Reversie! [00:07:35] Djegë atyre të CD! Posto atyre të MSN! Ju postës atyre të miqve! [00:07:40] Të gjitha me një klik! Një Microsoft, një strategji, një team-- fokusuar, të disiplinuar, profesionale, dhe ekspert në gjithçka që bëjmë. Më lejoni të përdor një vijë nga një film i vjetër. [00:07:52] Marrëdhëniet janë si peshkaqenë. Ata lëvizin përpara ose ata vdesin. Unë në fakt mendoj teknologjisë kompanitë janë të njëjta. [00:08:01] [END VIDEO rishikim] DAVID J. Malan: Pra, ne jemi aq të kënaqur për njoftuar se Steve do të bashkohen me ne këtu në CS50 të mërkurën e ardhshme në vendin dhe kohën e zakonshme këtu. Hapësirë ​​do të ngjarë të jetë i kufizuar. Dhe në mënyrë që të bashkohen me ne në person, ju lutem kreu sot, ose menjëherë pas kësaj për cs50.harvard.edu/register. [00:08:22] Dhe ne do të ndjekim nga E martë konfirmuar spote. Shikoni përpara për të se e ardhshëm Të mërkurën gjatë leksionit në CS50. Tani, në lajme të tjera, I ka ndodhur të vijnë të gjithë këtë në The Crimson vetëm ditë të tjera. [00:08:34] Ajo rezulton se një prej stafit CS50-së dhe të paktën një prej s nxënës CS50 është aktualisht kandidon për UC president dhe zëvendëspresident, e cila solli më mbrapa në ditët e mia prapa kur kam humbur zgjedhjet UC fat. Por rreshtim argjendi ne se eshte I gjithmonë tregoni histori është se një nga I jam i sigurt shumë arsye kam humbur zgjedhjeve ishte një mungesë të plotë një talent për të folurit publik. Dhe kështu krejt sinqerisht, atë çuan mua, se përvoja Unë mendoj se viti im i vogël, që në fakt nënshkruajnë për Harvard Shoqëria në kompjuter, i cili është grup mbi kompleksin se mban bisedime të ndryshme teknike dhe gjëra të tjera. Dhe e mora përsipër mësimdhënien e tyre seminare dhe për këtë arsye kishte një mundësi, një mundësi e mrekullueshme, të fillojë të punojë në pikërisht këtë. Por gjithashtu, kam pasur një mundësi Gjatë kësaj përvoje për të mësuar veten të gjitha më e HTML. Dhe kështu që unë zvarritur mbrëmë nga duke kërkuar nëpërmjet internetit HTML bazuar I bërë në si vitin 1997, '98, për tim Fushata e cila duket si ky këtu. Unë e di. [00:09:29] Because-- dhe natyrisht, njoftimi ky vendim mahnitshme dizajn në vitin 1998 apo gjësend. Gjëja e parë që ju doni përdoruesit për të bërë mbi të vizituar faqen tuaj te internetit është që të kemi të klikoni një lidhje tjetër vetëm për të hyrë në faqen tuaj këtu me murg pas si një perde fshehur ku duket Platforma ime fushatës ishte. Dhe kjo është e gjitha që ju do të merrni sot është vetëm një screenshot. Por unë u lexuar me, si, postera mia fushatës natën e kaluar dhe platformë e mia. [00:09:50] Dhe unë isha aq i zemëruar në atë kohë. Platforma ime was-- ishte interesante. Kështu që unë e kam qetësuar që nga atëherë. Por një ditë, unë do të kandidojë përsëri dhe shpresojmë se më mirë këtë kohë. [00:10:03] Pra HTML, se gjuha në të cilën kam bërë që in-- ju së shpejti do të bëjë more-- shumë është diçka që ne kemi qenë duke folur në lidhje me kohët e fundit dhe kryesisht marrë për të dhënë tani që ne kemi lëvizur për në gjuhë të tjera. Por le të ndalemi për një moment dhe të vënë disa nga këto gjëra në kontekst. Pra, në një fjali, çfarë është HTML? [00:10:18] Apo, ajo përdoret për të? Çdokush? Po. [00:10:20] AUDIENCA: Markup për faqet e internetit. DAVID J. Malan: Markup për faqen. Pra, kjo është një gjuhë markup që ju lejon të strukturojë një faqe web. Header shkon deri këtu, titulli shkon këtu, trupi shkon këtu. Ky është shkrim me germa të zeza, kjo është italics-- atë lloj detaje. [00:10:33] OK, mirë. Pra, CSS lejon you-- dhe unë mori disa liritë atje me guximshme-përballur dhe italik, sepse që është zbatuar më mirë me këtë. CSS is-- çfarë? Thonë se në një fjali. Çdokush në të gjitha. Po. [00:10:46] Audienca: Embellishments dhe sende, si se si për të hartuar atë. DAVID J. Malan: OK, mirë. Embellishments që ju lejojnë për të hartuar apo stilizoj atë me gjëra të tilla si shkrim me germa të zeza dhe italics dhe ngjyrave dhe gjithashtu më të bukura Pozicionimi trashë i elementeve. Kjo lloj ju lejon të merrni gjërat e milje e fundit në mënyrë që në qoftë se, për shembull, në Pset7, ju mund të keni vënë re në tuaj Faqja e portofolit në qoftë se ju jeni në këtë moment tashmë se një tavolinë parazgjedhur që ju bëjnë për të treguar pronat e përdoruesit aksioneve dhe cash ndoshta duket goxha e shëmtuar nga default me ​​asnjë hapësirë ​​të bardhë. Lloj Gjithçka është e mbushur së bashku në rreshta dhe kolona. [00:11:18] E pra, me pak CSS, si ju mund të kuptojnë, ju në fakt mund të shkulje atë dhe e bëjnë atë diçka shumë më të njohur dhe shumë prettier për të parë në. Pra, CSS është rreth stilizim e faqeve. Por pastaj ne kemi prezantuar një tjetër gjuha, PHP, e cila na lejon të bëjmë atë? [00:11:36] Le të vetëm të bëjë atë? Çdokush. Got për të sipërmarrje përtej rreshtat e para çift. Po. [00:11:40] AUDIENCA: Generate përmbajtje dinamike. DAVID J. Malan: Perfect. Generate përmbajtje dinamike. Dhe ju mund ta bëni këtë në çdo numër të gjuhëve. Ne të ndodhë që të përdorin PHP, sepse kjo është pjesërisht në mënyrë të ngjashme me C sintaksë. [00:11:50] Por, PHP bën pikërisht këtë. Kjo ju lejon të gjenerojë dinamike prodhimit. Dhe disa të asaj prodhimit mund të jetë HTML, siç kemi bërë zakonisht. Dhe kjo është gjithashtu, sepse kjo është një gjuhë programimi, është mekanizmi via cila ne mund të flasim për bazat e të dhënave. [00:12:03] Dhe ne mund të bëjë pyetje për serverat tjera si Yahoos dhe të programuar të bëjë asgjë me të vërtetë që ju mund të ndryshe duan të detyrojnë një kompjuter për të bërë. Pra PHP na lejon të fillojë dinamike kompjuteri përmbajtjen. Pra, sipas kësaj logjike, unë nuk kam një faqe interneti dinamike mbrapa në vitin 1998. [00:12:16] Ajo ishte vetëm një web faqe statike. Përmbajtja e mia duhej të ndryshohen nga dorë me gedit ose ndonjë ekuivalent. Por PHP është ajo që kemi përdorur ose mund të ketë përdorur, përkundrazi, për diçka si Website Frosh IMs, e cila është dashur të marrë regjistrime dhe menaxhuar një listë të gjërave që users-- janë në të vërtetë ndryshuar gjatë kohë, edhe pse ne të ndodhë për të përdorur Perl, një tjetër Gjuha në atë kohë. [00:12:35] Dhe pastaj në fund, ne kemi prezantuar Strukturuar SQL-- Query Language. Pra, edhe një gjuhë tjetër që është përdorur për çfarë? Përdoret për çfarë? A mund të sipërmarrje slight-- OK, ne nuk jemi duke shkuar për të marrë shumë larg se orkestër këtu. AUDIENCA: Kjo është një protokoll përdorur për të folur për bazat e të dhënave. DAVID J. Malan: Një protokoll përdorur për të folur për bazat e të dhënave. Më lejoni shkulje. Kjo është një gjuhë e natyrshme e përdorur për të folur për databases-- zgjedh dhe fut dhe fshin dhe më të reja dhe të vërtetë edhe më shumë karakteristika që ne nuk kemi as fetar në, por ju mund të dëshironi që të ketë explore-- për të shqyrtuar për të, të themi, një projekt përfundimtar. Pra, nuk janë këto pjesë të ndryshme. [00:13:09] Dhe shpresojmë Pset7, edhe pse Specifikim i saj është mjaft i gjatë, kjo është me qëllim të gjatë për të ecur ju me mënyrën se si këto gjëra mund të gjitha të shtypur bashkë. Tani, të hënën, ne futur gjuhën tonë të fundit se ne do të prezantoj zyrtarisht në course-- që është, JavaScript. Kjo, si PHP, është një Gjuha interpretuar. [00:13:25] Por një dallim kyç I propozoi të hënën është se ndërsa PHP është ekzekutuar ose duke interpretuar në server, e cila në këtë rast është aplikim CS50, ose mund të ketë disa web komerciale server në internet, JavaScript në përgjithësi është një gjuhë që shkon krah klientit Nuk server side-- aq në shfletuesin. Që do të thotë, ashtu si kur kam hapur up kodin burimor Facebook dhe gjeti të gjitha e këtyre dosjeve .js, implikimi ishte se kur ju vizitoni Facebook ose më faqet e internetit këto ditë, ju merrni jo vetëm HTML, jo vetëm CSS, por një bandë e tërë e JavaScript Kodi shpesh në formën e dosjeve .js. Dhe pastaj kjo është browser-- tuaj Mac apo PC-- që ekzekuton këtë kod. [00:14:03] Por shfletuesi juaj ekzekuton atë. Ju mund të mendoni se në lloj të një sandbox. Kështu që kodi JavaScript nuk duhet të jetë në gjendje për të fshini fotografi në kompjuterin tuaj. Ajo nuk duhet të jetë në gjendje të të dërgoni postë elektronike në emër tuaj. Lloj Shfletuesi juaj e kufizon çfarë ju mund të bëni me të. [00:14:17] Pra, në këtë kuptim, është pak më pak të fuqishme, ndoshta, se C. Por JavaScript mundet, si një mënjanë, do të përdoret në server, edhe pse ne do të priren për të mos flasim në lidhje me atë në këtë kontekst. Pra, tani le të lidhin këto së bashku. Një javë plus më parë, ne kemi paraqitur disa HTML në left-- web faqe super mërzitshëm. [00:14:34] Vetëm thotë përshëndetje botë. Dhe pastaj kam propozuar në drejtë ne mund të lloj të vjedhin idetë nga diskutimi ynë i Strukturat e të dhënave në C dhe të mendojnë për mënyrën se si kjo hierarkike gjuha markup në të majtë mund të nxirren ose zbatohen në kujtesën si një strukturë aktuale pemë me nyje dhe pointers dhe ato llojet e detaje. Në të djathtë, që ne e quajmë se një dokument DOM-- Object Model-- e cila është vetëm një mënyrë e sofistikuar për të thënë pemë. [00:14:56] Tani, pse është kjo e dobishme për të mendojnë për atë në këtë mënyrë? Sepse tani me JavaScript, sepse ne kemi kodin që merr për të luajtur në këtë Mjedisi, HTML aktuale që është e është dërguar në shfletuesin tashmë dhe ka tashmë është ngarkuar në memorie nga shfletues në një pemë në kompjuterit tuaj RAM si kjo, ne mund të përdorim JavaScript që në fakt të kaloj ose në këmbë apo kërkimi ose të ndryshojë atë pemë DOM megjithatë ne duam. Pra, në fakt, në qoftë se ju mendoni se rreth facebook.com, në qoftë se ju përdorni chat funksion, nëse ju Përdorimi Gmail dhe funksion gchat, çdo gjë ku ju keni Mesazhet që vijnë përsëri dhe përsëri dhe përsëri, këto mesazhe janë ndoshta, si, LI tag, tags Lista Item, ndoshta. [00:15:35] Apo ndoshta ata janë vetëm divs që mbajnë shfaqeshin çdo herë që ju të merrni një mesazh të çastit. Dhe kështu që vetëm do të thotë se çfarë Facebook ose Google është duke bërë është çdo herë që të merrni një Mesazhi nga serveri, ata janë ndoshta duke përdorur JavaScript për të vetëm të shtoni një tjetër nyje në këtë tree-- një nyje në këtë pemë që atëherë shikimi vetëm duket si një linjë të re të tekstit në ekranin tuaj. Por ata janë futur në këtë strukturë të dhënave. [00:15:57] Pra, në klasa si CS124 dhe të tjerët, ju do të në fakt shkruani kodin shumë kundër Strukturat e të dhënave si kjo. Por, tani për tani në JavaScript, ne vetëm do të supozojmë ne të merrni të gjithë këtë funksionalitet falas nga gjuha vetë. Pra, le të shikojmë një shembull. [00:16:09] Më lejoni të hapur një skedar të quajtur form.html. Kjo është super e thjeshtë. Ajo thjesht duket si ky. [00:16:15] Jo CSS, asnjë mendim për estetikë. Kjo është thjesht funksionale dhe me sa duket unë jam duke kërkuar për një email, një fjalëkalim, fjalëkalimin përsëri, dhe pastaj një kontroll për të rënë dakord për disa termave dhe kushteve. Çfarë kodi burim për këtë duket sikur është ndoshta diçka ju mund të me mend me a pak e mendimit tani. Unë kam marrë një tag formë këtu. [00:16:32] Një veprim është me sa duket do të shkoni në një skedar të quajtur register.php. Metoda që unë jam duke shkuar për të përdorur është marrë. Dhe pastaj unë kam marrë një tekst fushë emri i të cilit është email. [00:16:40] Unë kam marrë një fushë fjalëkalimin emri i të cilit është password. Unë kam marrë një tjetër fushë fjalëkalimin emri i të cilit është konfirmim disi arbitrare. Kjo është vetëm një HTTP parametër. [00:16:49] Dhe atëherë ne nuk kemi përdorur këto përveç pasi IMs Frosh demo në class-- një kuti kontrolloni që është vetëm lloji barabartë kontroll. Dhe unë do të thërrasë atë marrëveshje. Kështu që unë kam lloj mënyrë arbitrare, por quajtur të përshtatshme këto fusha. Kështu që tani, kur kjo formë merr dorëzuar, le të shohim se çfarë ndodh. Nëse unë bëj malan@harvard.edu, Unë do të bëj një fjalëkalim të purpur. Unë do të bëj një fjalëkalim të asgjë. Le të mos bashkëpunojnë. [00:17:10] Dhe unë nuk do të kontrolloni kutinë. Më lejoni të klikoni Regjistrohu. Dhe ai thotë, HM, ju jeni të regjistruar. Jo me të vërtetë. [00:17:16] Por URL ndryshoi. Pra, kjo formë është e lejuar në mënyrë të qartë të paraqesë në register.php. Por me sa duket, unë duhet të jenë të infektues disa nga këto gabime. Tani, në Pset7 dhe disa e shembujve tanë leksion, ne përgjithësi do të shtypura nga një mesazh i madh i kuq gabimi këtu duke thënë, emrin e zhdukur, ose fjalëkalimin e humbur. Ne e kemi bërë këtë më parë dhe ne kemi Done side server error zbulimin. [00:17:37] Por, shumë faqet e internetit këto ditë bëni klientit zbulimin gabim side ku URL nuk ndryshon. Gjithë faqja nuk rifreskohet. Ju merrni reagime të menjëhershme nga shfletuesi. Ndoshta diçka shkon kuqe. [00:17:48] Ndoshta ju merrni një pop up. Por ju nuk e humbni kohën dërguar për Të dhënat server që është e paplotë. Pra, le të shohim se si ne mund të arritur këtë funksion si. [00:17:56] Më lejoni të shkoj në form1.html, cila duket njëjtë. Por në qoftë se këtë herë bëj malan@harvard.edu dhe unë lloji kuqe flakë dhe unë nuk do të bashkëpunojnë më tej por kliko Regjistrohuni, vëreni tani. Kjo nuk është zgjidhja sexiest. Unë e kam të paktën kapur këtë gabim. Dhe unë e kam përdorur alarm funksion në JavaScript-- të cilat ne jemi vetëm duke përdorur në klasë. Në përgjithësi, ju nuk duhet të përdorin këtë sepse ajo shumë shpejt mund të marrë jashtë e kontrollit. Por fjalëkalimet nuk plotëson është gabim. [00:18:19] Më lejoni të shkoj përpara dhe klikoni OK. Por ajo takeaway kyç këtu është se URL nuk ka ndryshuar. Gërryes kështu që unë nuk e kam shqetësuar Ora serverin e kërkuar atë një pyetje që unë mund të ketë motive nga një përgjigje për veten time. [00:18:30] Dhe përdoruesit, edhe pse qenë duke folur në lidhje me këtë më shumë se përdoruesit e do të mendojnë për këtë, do të ketë reagime të menjëhershme. Nuk ka latente me lidhjes të rrjetit. Pra, le të shohim në këtë kod burimor. [00:18:40] Duket Form1.html strukturore të ngjashme deri këtu. Forma është në faktin njëjtë. Por le të shohim se çfarë kam bërë këtu poshtë. Dhe ka mënyra të ndryshme për ta bërë këtë. Dhe unë e kam bërë më të drejtë ndjekës por jo mënyrën më elegante ende. Unë kam një tag script. Unë pastaj telefononi document.getElementByID ('regjistrimi'). Dhe unë ruajtur këtë vlerë në formë, një variabël. [00:19:04] Pra, çfarë kam bërë? Ju mund të mendoni document.getElementByID si një funksion të veçantë që JavaScript ju jep që fjalë për fjalë duart ju a tregues për një nga nyjet apo rectangles në këtë pemë. Deri tani kjo është ajo formë e ndryshueshme ynë në JavaScript është në të vërtetë vënë në. [00:19:21] Deri tani sintaksa është i ndryshëm nga C. Por, ne jemi duke bërë disa gjëra këtu. Një, kjo është pak e çuditshme kërkuar, sigurisht kundrejt C. Por shikoni në linjë 35. Pra, në form.onsubmit majtë. Kujtojnë se onsubmit është si një fushë në një strukturë. Nëse ju mendoni se e formës variablit është vetëm të qënit një struct C, ajo mund të ketë disa fusha. [00:19:42] Kthehu në ditë, kemi pasur studentëve emra, ID, shtëpitë, ato lloj fusha. Vetëm mendoni për onsubmit si një tjetër fushë. Por kjo është një fushë të veçantë, sepse shfletuesi është preprogrammed të presin .onsubmit të mos jetë një vlerë si një numër apo varg, por që në fakt të jetë një funksion ose adresën e një funksioni në kujtesën e kompjuterit. [00:20:02] Dhe me të vërtetë, kjo është ajo ky fjalen here bën. Kjo thotë se, më jep mua një funksion të ri. Por ajo që është emri i saj do të jetë, duket? [00:20:09] Duke menduar përsëri deri të hënën. Cili është emri i kësaj Funksioni i bazuar në këtë sintaksë? Jo, dua të them, nuk ka në mënyrë të qartë no name associated-- siguri jo në atë që unë kam theksuar këtu. [00:20:21] Por kjo është e vërtetë në rregull. Ky është një funksion anonim, apo një Funksioni lambda si disa mund të quajnë atë. Dhe kjo vetëm do të thotë kjo është ende një funksion. Është vetëm, ju nuk mund të telefononi atë me emër. Por kjo është në rregull. Sepse përsëri, shfletuesi ka qenë preprogrammed nga kompanitë si Google ose Microsoft apo Mozilla apo të tjerët të vetëm e di se në qoftë se fusha .onsubmit brendësi të një element formë ka Vlera, trajtojnë atë si një function-- një tregues funksion, nëse ju do. Dhe e quajti atë, kur forma është dorëzuar. [00:20:46] Pra, çfarë kodi duhet të ekzekutohet kur forma është dorëzuar? Me sa duket, çdo gjë brenda e Brace kaçurrel. Dhe kjo është vetëm stilistik. [00:20:53] Ju mund ta bëni këtë si ne priren për të bërë në CS50. Por në JavaScript, shumica e njerëzve kanë tendencë për të mbajtur atë në të njëjtën linjë vetëm për shkak se ajo është më qartë lidhur me këtë funksion fjalen. Deri tani çfarë po bëj? [00:21:03] Nëse form.email.value barabartë të barabartëve string bosh ose asgjë, këtu është një alarm ku unë jam duke shkuar për të thënë, ju duhet të sigurojë adresën tuaj e-mail, dhe pastaj të kthehen rreme. Dhe kjo është se rreme kthimi që pengon formularin nga të paraqitur. Ndërkohë, në qoftë se vlera fjalëkalimi është bosh, unë jam duke shkuar për të çirrem në përdoruesit dhe të thonë, ju duhet të sigurojë një fjalëkalim. [00:21:21] Ndërkohë gjërat po pak njohës këtu. Nëse form.password.value nuk form.confirmation.value të barabartë, fushë tjetër, çirrem në përdoruesit që fjalëkalimet nuk përputhen, si ata A nuk qe një moment më parë. Dhe pastaj kjo është një pak sexier sepse unë e di se unë e dija që konceptualisht kontrolluar është emri i një kuti kontrolloni s. [00:21:40] Kështu që unë mund të përdorni vetëm një thirrje pikë të thonë se çeku nuk është checked-- është Boolean vlera, e vërtetë apo false-- Unë do të çirrem në përdorues për këtë arsye. Përndryshe, në qoftë se ne të merrni me anë të të gjitha këto kushte, le të kthehen vetëm e vërtetë. Le forma të dorëzohet. Dhe kjo do të ndodhë. [00:21:56] Le të shkruani në të kuqe flakë. Le të kontrolloni kutinë, klikoni Regjistrohu. Dhe tani unë po shkoj deri në destinacion. Tani, nuk ka asnjë bazë të dhënash atje. Nuk ka asgjë interesante në register.php. Unë vetëm nevojë për diçka në të vërtetë flasin për të. Pra, më lejoni të bëj një pauzë, këtu. Çdo pyetje mbi atë që ne kemi bërë vetëm ose ajo që disa prej këtij sintaksës së re është? OK, vërtet? [00:22:17] Audienca: Pra, çdo checkbox është automatikisht një Boolean. Ju nuk duhet ta deklarojnë atë si kjo. [00:22:21] DAVID J. Malan: Correct. Çdo checkbox që është dërguar për ju nga një formë HTML për kodin tuaj JavaScript do të trajtohen, po, si Boolean value-- vërtetë apo false. Kjo është një pyetje e mirë. Ndërsa vlerat e tjera, të Natyrisht, ka qenë teksti, vargjet AKA. [00:22:36] Të gjitha të drejtat, kështu që le të më Rewind pak më tej. Cila ishte pika e tërë e kësaj? Vetëm të jetë i qartë. Ashtu si, ne tashmë e dimë, madje edhe nga Pset7 dhe madje edhe nga leksioni i javës së kaluar shembuj, që ne mund të kontrolloni të qartë $ _GET $ _POST Shohim nëse përdoruesi na japë një vlerë bosh. Mos harroni funksionin bosh në PHP. [00:22:54] Pra, vetëm të jetë i qartë, çfarë është një arsye që ne mund të doni të bëni këtë gabim kontrolluar brenda shfletuesit? Çfarë është motivimi këtu? Po. [00:23:06] AUDIENCA: Faster, dhe ju nuk e bëni dërgoni të dhëna të padobishme në server. DAVID J. Malan: Mirë. Është e shpejtë. Ju nuk dërgoni padobishme dhënave tek serveri. [00:23:12] Pra, ju merrni mbrapa a më shumë përgjigje të menjëhershme. Dhe në përgjithësi, përdoruesit përvoja është më e mirë. Mendoni për këtë alternativë. [00:23:17] Nëse për Gmail-- dhe ishte rasti shumë vite më parë. Supozoni se ju mori një email të ri Gmail tuaj llogari, por e vetmja mënyrë me anë të për të parë se është me, si, ringarkoni faqen e tërë. Ose Supozoni se ju klikoni mbi një lidhje për të lexuar një email. [00:23:29] Çdo gjë duhet të ringarkoni kështu që ju mund të shihni email. Ose Facebook-- ju merrni një mesazh chat. Ju nuk e shihni atë deri sa ju reload faqja ose klikoni ndonjë lidhje. [00:23:36] Si, kjo do të jetë një jashtėzakonisht bezdisshëm user experience. Dhe kjo është ajo që ishte si, në mënyrë të qartë, mbrapa, kur unë u zhvillua për UC dhe web ishte shumë më pak dinamike dhe JavaScript nuk ishte aq i popullarizuar siç është tani. Dhe gjërat po shkojnë shumë më dinamike dhe shumë më tepër anën e klientit në këtë kuptim. [00:23:49] Por ka një kapur këtu, dhe kjo është lloj i një Gotcha bezdisshëm. Vetëm për shkak se ju të shtoni anën e klientit zbulimin si kjo nuk do të thotë ju mund ose duhet të braktisë server side zbulimin. Thelb ju doni të vënë tuaj error kontrolluar në të dy vendet. Sepse ajo ishte një i mësimit të mësuar nga artikull kam lexuar disa fragmente nga me këtë system-- budallaqe CMS Content Management System-- kjo ishte zbatimin e sistemit të saj të vërtetimit, login saj nëpërmjet çfarë mekanizmi? JavaScript. [00:24:20] AUDIENCA: JavaScript. DAVID J. Malan: JavaScript, saktësisht, e drejtë? Ajo ishte duke përdorur JavaScript. Dhe fjalë për fjalë, ju djema keni luajtur pak ndoshta me Inspektorin Chrome-it. Dhe në qoftë se unë mund të gjeni atë, inspektojë element. [00:24:30] Më lejoni të shkoj gjatë për të bërë të gjitha opsionet e Chrome-it. Dhe kjo është sa e lehtë është për të çaktivizoni JavaScript në shfletuesin. Kontrolloni, nuk ka më shumë JavaScript. [00:24:38] Pra në drejtësi, shumë i web këto ditë është vetëm duke shkuar për të thyer, sepse Gmail dhe sites-- të tjera Facebook-- supozojmë se JavaScript është e aktivizuar. Por nëse ju jeni duke bërë diçka stupid si vetëm Vleresimin përdoruesit input dhe kontrolluar atë për gabime në anën e klientit, një kundërshtar të lehtë mund të bëjë këtë. Dhe pastaj, edhe më të zgjuar Armiku si ju djema tani mund të përdorin Telnet ose Curl ose thjesht komandës komanda linjë dhe në fakt për të dërguar mesazhe në server që në mënyrë të ngjashme nuk janë iluzione kontrolluar. [00:25:05] Kështu që kjo është më e a Përdorues vendim ndërfaqe se ajo është një aktuale teknike improvement-- zbatimin Ana diçka klienti si kjo. Deri tani një vështrim i shpejtë, por pastaj Unë do të shtyjë në internet shëtitje përmes për këtë. Në formën e dy, ne fakt shkuan përmes dhe pastruar shifra pak. Por më lejoni të shtyjë për një e videos që do të ngjarë embed në Pset8 që vetëm ju tregon a Sintaksa e ngjashme duke përdorur një bibliotekë të quajtur jQuery, e cila është një super, super Biblioteka popullore në JavaScript që sinqerisht shumica e njerëzve përdorni vetëm këto ditë dhe madje edhe të ngatërruar si vetë qenie JavaScript. [00:25:37] Dhe ajo tenton që të përfshijë disa shenja dollar dhe fjalë kyçe si dokument në kllapa këtu. Por përsëri, më lejoni të shtyjë për disa mësime ngadalshme në linjë në vend se të merrni të lidhur në vetëm sintaksë. Le të lëvizin për diçka një pije freskuese pak në drejtim të aplikacioneve të kësaj. [00:25:50] Pra, në mënyrë të veçantë, më lejoni të shkoj përpara dhe të hapur këtë këtu. Come on. Nuk shkojmë. [00:25:59] Më lejoni të hapur këtë foto këtu. Panevojshme e komplikuar në kërkim, por kjo përshkruan një teknikë të quajtur AJAX-- Asynchronous JavaScript dhe XML, ku X për XML është në të vërtetë nuk përdoret më me të vërtetë. Ajo ka tendencë për të përdorur diçka tjetër të quajtur JSON. [00:26:13] Por këtu është se si diçka si Google Maps ose Google Earth punon. Le të provoni këtë në fluturojnë, në fakt. Më lejoni të shkoj përpara dhe të hapur up Chrome në shfletuesin tim. [00:26:21] Dhe më lejoni të shkoj në, thonë, maps.google.com. Dhe në të vërtetë, në qoftë se ju jeni të vjetër të mjaftueshme për të kujtuar se çfarë, si, MapQuest ishte si mbrapa në ditë, dhe ndoshta ata ende punojnë si kjo. Kur keni përdorur për të kërkuar për something-- 33 Oxford Street, Cambridge, Mass, le të bëjmë this-- ju do në të vërtetë, në qoftë se ju donte të pan dhe poshtë, majtas dhe djathtas, ju do të duket si a shigjeta i madh në krye, dhe ajo do t'ju tregojë një tjetër kornizë e hartës deri këtu. Ose ju do të klikoni majtë dhe ju do të shkojnë mbi këtu, ose në një tjetër klikoni dhe ju do të shkoni këtu. Por në vend që këto ditë, ne natyrisht vetëm marrë për të dhënë se ne mund të shkojmë rreth Kembrixh shumë shpejt vetëm duke klikuar dhe zvarritur. Por vini re ka disa glitches. [00:26:59] Në qoftë se unë bëj këtë të shpejtë të mjaftueshme, ajo që duket të jetë duke ndodhur si unë zvarrit pak a shumë të shpejtë për kompjuter për të mbajtur lart? Çfarë e shihni ju? Po. [00:27:07] AUDIENCA: E pixels nuk refresh. DAVID J. Malan: pixels nuk refresh. Ka actually-- dhe ju mund të shihni këtë, në fakt, në qoftë se ju jeni duke shikuar në internet dhe pushim kjo ose në të vërtetë ngadalëson gjëra poshtë për once-- ju do të shihni se ka pllaka, sheshet, rectangles ose se janë të zhdukur nga harta deri në një ndarje të dytë më vonë, më shumë të dhëna, më shumë imazhe të vërtetë shfaqen në ekran. Dhe në fakt, nëse ne e bëjmë këtë duke shikuar up Chrome's-- le të themi, Chrome-- le të shohim. Ne nuk mund ta bëjmë këtë. [00:27:31] Oh, uh. Le të hapur maps.google.com. Më lejoni të bëjë dritare të mëdha përsëri. [00:27:36] Kthehu mbrapa në 33 Oxford Street. Cila ishte website isha në kohët e fundit? Unë kisha këtë, si, përçartje privat tek veten se unë do mesazhin atëherë çastit ndonjë mik i cili ka qenë në linjë që dëshironin të dëgjojnë atë. Ka disa website. Unë mendoj se është kaq Comcast-- një ISP shumë e madhe amerikane. Ju mund të, kur nënshkrimin për kabllo të ri Shërbim modem apo shërbimi TV kabllor, ata kanë një formë shumë të arsyeshme ku ata të ju pyes për adresën tuaj. Dhe keni këtë mahnitshme funksion të quajtur të plotë auto, si Google, që fillon për të mbushur në përgjigje të pyetjes suaj. [00:28:04] Problemi është, ata e kryejnë auto për gjërat e para që ju shkruani. Pra, nëse ju filloni të shtypni në 33, atë do t'ju tregojë fjalë për fjalë çdo shtëpi në Amerikë që fillon me numrin 33 para se të vazhdoni të presim që ju të shkruani më shumë. Pra, nëse ju shkruani 33 Oxford, atëherë ajo ju tregon çdo rrugë në Amerikë që ka 33 Oxford në emri i saj, pavarësisht nga të qytetit që ju jeni në. [00:28:25] Dhe pastaj ju vazhdoni të shtypni. Dhe së fundi, ai e kupton se ata nuk e bëjnë Oferta Shërbim në shtëpinë tuaj, në Kembrixh ose diçka të tillë. Por pikë është, kjo është më e Zbatimi gomar i auto përfunduar kurrë. [00:28:34] Dhe unë jam vetëm duke shkuar jashtë në këtë tangjent përsëri. Por ka mënyra të mira për të përdorin JavaScript dhe mënyra të këqija. Dhe kjo nuk është domosdoshmërisht një të mirë. [00:28:40] Por pika këtu, para këtij bisedë, ishte për të hapur mjetet këtu poshtë dhe e hapur deri Developer Tools, si ne kemi inkurajuar më parë, dhe të shikojnë Network tab si unë klikoni me të vërtetë të shpejtë. Dhe vini re një bandë e tërë i marrë kërkesa ndodhur. E gjithë kjo ndodhi që unë zvarritur. [00:28:57] Dhe ka shumë të ngjarë, të vërtetë një shumë prej këtyre rreshtave tani janë image slash JPEG Lloje MIME ose llojet e përmbajtjes. Kjo është për shkak se ajo është duke bërë kromit çdo herë që unë klikoni dhe terhiq, klikoni dhe terhiq, është ajo e realizimit, oh, unë duhet të shkoni kërkoni Google për tjegull në hartë që është këtu, shpejt për ta shkarkuar atë nëpërmjet HTTP, dhe pastaj shtoni atë në të ashtu-quajtur DOM të shfletuesit web në pemë e kujtesës përfaqësimi në mënyrë që përdoruesi, mua, sheh atë tjegull përditësuar. Dhe kjo është për shkak të një teknikë të quajtur AJAX. Kthehu në ditë, me të vërtetë ishte rasti se në qoftë se ju donte për të ndryshuar atë që është në ekran, ju do të duhet të klikoni lart, poshtë, majtas, të drejtë. Dhe pastaj një faqe e re do të hapet. Por këto ditë, gjithçka është më dinamike. Kjo ndodh në mënyrën se si ne njerëzit do të shpresoj se ai në fakt do interaktive. Dhe ajo arrin këtë duke Rruga e një teknikë të quajtur AJAX, e cila është ndoshta më e mirë shpjegohet me një shembull. Së pari, më lejoni të shkoj përpara dhe të hapur një skedë quajtur quote.php në Kodi sotme shpërndarjes. [00:29:53] Dhe pastaj më lejoni të bëj Uh symbol--. Më lejoni të bëj simbol GOOG = për vetëm disa aksioneve. Ose në të vërtetë, le të bëjë një nga Pset FALAS. Enter. [00:30:05] Dhe tani vini re atë që unë të kthehem. Pra, kjo është me të vërtetë fotografi short PHP se unë shkroi se thjesht huazon kodin nga lookup funksion Pset7 s dhe pështyn jashtë duke përdorur këtë mbajtëse kaçurrel dhe Kuotat dhe simbol i zorrës së trashë, me sa duket, Çmimi i sistemit aktual për kompani që ju të kalojnë në anë të merrni. Pra, kjo është e ndryshme nga shumica e asaj që ne kemi bërë në këtë shënim unë jam fjalë për fjalë pështypje jashtë ajo që duket si kod JavaScript. [00:30:27] Në fakt, ky është një objekt JavaScript. Në fakt, vetëm për të qenë më i qartë, JavaScript Object Notation-- JSON-- është vetëm një mënyrë e sofistikuar për të thënë se ju mund të përfaqësojnë të dhënat në JavaScript shumë si ju mund të në PHP duke përdorur palë kryesore me vlerë. Pra, nëse kam kërkuar për të deklaruar një variabël në JavaScript që paraqet Zamyla, për instance-- strukturë për Zamyla-- dhe ne do të thërrasë atë student, kjo është e ndryshueshme. ID i saj është një, shtëpia është Winthrop, dhe emri është Zamyla. [00:30:53] Por unë mund të ketë një rrjet të objekteve. Pra, nëse unë vërtetë kërkuar që të ketë një grup në JavaScript që përmban objekte të shumta të tilla, kjo Koha stafit përfaqësojnë, Unë mund të ketë këto tre chunks të kodit mbrapa për të kthyer prapa për këto tre ish-anëtarë të stafit. Pra sintaksë, pretty të ngjashme me both-- me PHP. Por kjo është veçanërisht e JavaScript. Është objekt simbol. Pra, çfarë është kjo e dobishme për të? [00:31:17] Nëse unë shkruaj kodin që pështyn jashtë JSON-- JavaScript Object Notation-- gjëra që duket si ky apo sende që duket si strukturë Zamyla-së, Unë në fakt mund të përdorni këtë në programet e unë shkruaj. Më lejoni të shkoj në ajax0.html. Dhe kjo too-- jo shumë mendimi i dhënë në estetikë. Por të shikojnë se çfarë ndodh. [00:31:34] Më lejoni të shkoj përpara dhe të shkruani të lirë këtu. Kliko marrë kuotë. Dhe vini re URL nuk ka ndryshuar. Por unë e kam marrë një pop up me sa duket Çmimi i aksioneve të sotme penny prej $ 0,15. Pra, jo të gjithë aq keq. Por dallimi është se në njëfarë mënyre, këto të dhëna u kthye në mua direkt. Por le të marrin një hap drejt diçka më të njohur. Në versionin e parë të kësaj, le të më shtypni përsëri të lirë, klikoni Get kuotë, dhe now-- oh, kjo ishte në fakt versioni jQuery. Pra, le të me-- që unë nuk e kam fast-forward mjaft mjaft larg. Më lejoni të shkoj në version dy, e cila është vendi ku kam kërkuar. Njoftim atë që unë kam bërë këtu. Unë kam një web page-- një super version i thjeshtë i ndonjë web faqe ju mund të përdorni sot me një fushë teksti këtu për të lira dhe pastaj me sa duket vetëm teksti. [00:32:14] Kjo nuk është një formë e këtu, me sa duket. Por në qoftë se unë klikoni shkoj quote, njoftim web faqen time është gati të ndryshojë sikur unë mori vetëm një mesazh të ri çastit ose sikur unë vetëm u zhvendos hartë dhe të nevojshme për të marrë më shumë të dhëna shtuar dinamike në web faqe pa ndryshimin URL dhe përdoruesit Përvoja duke ndërprerë. Në të vërtetë, unë jam ende në saktë të njëjtën ajax2.html place--. [00:32:35] Pra, le të shohim vetëm në këtë shembull dhe të shohim se si kjo po ndodh. Më lejoni të shkoj në ajax2.html. Dhe njoftim formën e parë. [00:32:44] Këtu poshtë, unë jam kthyer off plotë të auto. Ndonjëherë ajo merr i bezdisshëm, nëse shfletuesi është duke u përpjekur për të treguar ju tërë historinë tuaj. Kështu që ju mund ta bëni atë në HTML nga vetëm duke thënë auto përfunduar off. [00:32:53] Unë e kam dhënë këtë tekst fushë a symbol-- më tepër, një ID të simbolit. Dhe tani, kjo është një tipar interesant. Ne nuk kemi biseduar në lidhje me pëllëmbë, por ju mund të mendoni rreth saj si një tag paragrafi apo div tag. Kjo është ajo që quhet një në-linjë element, i cili do të thotë që ju nuk do të merrni një paragraf thyer sipër dhe poshtë saj. Është vetëm do të qëndrojë në linjë pa goditur ekuivalentin e të hyjë. Kështu që unë kam dhënë këtë copë të HTML për të përcaktuar një identifikues unik që në mënyrë arbitrare të quajtur çmimi. Dhe unë kam një buton Submit. [00:33:21] Sepse tani up here-- dhe kjo është Kodi fakt super e mahnitshme se sa pak ju mund të shkruani për të bërë relativisht i zoti things-- vini re atë që unë kam bërë deri këtu, nëse I shkoni deri në krye të kësaj faqe. Unë e kam përfshirë të parë në koka ime a tag script që në fakt i referohet një JavaScript paraqesë diku tjetër. Kjo është nga organizata që shkruan jQuery, dhe kjo është vetëm duke ju dhënë të fundit version i bibliotekës jQuery tyre. [00:33:42] Pra, kjo është lloj i si të mprehtë përfshijnë në C, ose të kërkojë në PHP. Ju përdorni tag script me një atribut burim. Por tani kodi im është do të jetë e drejtë këtu. [00:33:52] Njoftim Unë kam një funksion të quajtur Quotes. Dhe kjo duket pak fshehtë në shikim të parë. Por le të ngas këtë larg. Më jepni një variabël të quajtur URL. Të caktojë atë fjalë për fjalë në këtë varg. Pra, citate të vetme, kuotat dyfishtë në JavaScript vetëm më jep një varg. Çfarë do të bëjë plus? Varg. [00:34:08] Pra, kjo tani është sintaksë jQuery i cili merr pak duke u përdorur për të. Por kjo thjesht do të thotë shkoni merrni mua DOM nyje identifikues unik i të cilit është simbol. Hashtag nuk do të thotë simbol unik identifikues. [00:34:21] Shenjë dollar në kllapa do të thotë vetëm, të përfundojë kjo në jQuery një lloj i salcë sekrete kështu ju merrni funksionalitet shtesë. Dhe pastaj .val është me sa duket një funksion, apo siç themi tani, një metodë brenda kësaj nyje që vetëm ju jep vlerën. Pra me pak fjalë, të shëmtuar dhe konfuze pasi kjo duket në shikim të parë, kjo do të thotë vetëm të marrë me përdoruesit shtypur in, vënë në fund të vargut duke concatenating atë. Kjo është e gjitha. [00:34:43] Deri tani, tre linja e fundit. Ju mund të shtrydh shumë funksionalitetin nga tre linja. Kjo shenjë dollar, si një mënjanë, është vetëm një pseudonim për një variabël të veçantë globale quhet fjalë për fjalë jQuery. [00:34:55] Shenjë Dollar vetëm duket cool. Pra, komuniteti jQuery vetëm lloji e përdorur atë si simbol të tyre të veçanta. Kjo nuk do të thotë se çfarë do të thotë në PHP. Në JavaScript, shenjë dollari është vetëm si një letër e alfabetit ose një numër për një variabël. [00:35:07] Ju vetëm mund të keni atë si emrin. Vetëm duket cool. Pra komunitetit miratoi atë si një pseudonim për bibliotekën e tyre të quajtur jQuery. [00:35:13] Dhe kjo është super popullor. Pra merrni JSON është pikërisht kjo. Kjo është një funksion që folks në jQuery shkroi që merr JSON nga një server-- JavaScript simbol Object. Nga ajo URL po shkon për të marrë këtë informacion? Me sa duket nga kjo URL këtu. [00:35:27] Dhe çfarë duhet të bëjë shfletues si shpejt si ajo merr përsëri këtë përgjigje? Dhe kjo është magjia e AJAX, në mënyrë që të speak-- Asynchronous JavaScript në XML. Është e vështirë për të parë se me të tillë një Shembulli i thjeshtë si ne kishte këtu. [00:35:41] Por kjo ishte asinkrone në Ndjenja se kodi im kur ekzekutuar dërgoi një mesazh server për të shkuar të marrë mua disa JSON. Dhe kjo ndodhi super të shpejtë që kam marrë një përgjigje. Por ajo që është interesante është se ky linjë e kodit nuk rri kompjuterin tim. [00:35:55] Unë nuk e shoh një ikonë tjerrje. Unë nuk e humb Aftësia për të lëvizur miun e mia. Shfletuesi im ishte në të vërtetë të përkryer gjobë. [00:36:01] Sepse rruga JavaScript trajton përgjigje nga serveri është si më poshtë. Ju të regjistroheni atë që ju do të thërrasë një funksion callback, e cila thjesht do të thotë, hej, JavaScript. Sapo server përgjigjet me JSON, ju lutem telefononi këtë funksion anonim. [00:36:18] Dhe ju lutem kaluar në këtë funksion çfarëdo string server nxjerr nga goja si një argument i quajtur të dhënave. Pra, në të tjera, fjalë, në qoftë se Unë jam grumbulluar dinamike a quote.php URL kalon në këtë Simboli si FREE apo GOOG apo gjësend, Unë jam atëherë them JavaScript shkoni merrni atë URL. Mos harroni se të shfletuesit do të kthehet diçka që duket si e pamë earlier-- këtë. [00:36:42] Dhe çfarë argumenti i dytë këtu për të marrë JSON është thënë po e quajmë këtë funksion kur server merr prapa nëse kjo është 10 milisekonda prej tani ose 10 sekonda nga tani. Dhe, sa më shpejt që ju bëni, shtoni çmimin në faqe. Kjo sintaksë këtu vetëm thotë shkoni merrni nyjen nga pema unik cilit identifikues është price-- atë periudhë kemi parë më herët. [00:37:01] Kjo metodë quhet HTML thjesht thotë, shkoni të zëvendësojë HTML që është atje me data.price. Çfarë është data.price? Well, shfletuesi, kujtojnë, tregoi me këtë vijnë. Pra, kjo është e të dhënave. [00:37:14] Dhe kështu që është pak i fshehtë për të parë presje këtu. Por në fakt, më lejoni të bëjë këtë. Më lejoni vetëm të ngjisni këtë reale të shpejtë në gedit dhe tregojnë këtë si kemi treguar Struktura Zamyla më parë. [00:37:27] Çfarë server është dërguar përsëri është një pak objekt që duket si kjo. Dhe kështu është data.price vetëm duke i dhënë mua 0,1515. Pra, një shumë e lëvizjes pjesë këtu të gjithë përnjëherë. [00:37:39] Por takeaways kyçe është që ne kemi këtë mundësi për të bërë HTTP shtesë Kërkesat përdorur JavaScript pa pasur nevojë të rifreskoni faqen. Dhe pastaj ne mund të vërtetë ndryshuar web faqe në të fluturojnë. Dhe kjo rezulton se JavaScript dhe gjuhë të tjera mund të përdoret tani jo vetëm që të shndrrohet web pages, por që në fakt të shkruar software në një kompjuter të vërtetë, nuk kufizohen vetëm për Chrome apo si. [00:38:00] Në fakt, if-- COLTON, do t'ju të donte të na bashkohen përsëri këtu me kodin tuaj laborator, dhe Chang si edhe? Le të shkojnë përpara, duke folur për Funksionet anonim dhe callbacks dhe me të vërtetë provokoj fatin këtu me një demo të jetojnë me gjakderdhje teknologji edge, një nga këto pajisje Elite Motion. Tani, kjo pajisje, kujtojnë, është një pajisje e vogël USB si dhe that-- kjo është beautiful-- që priza në portet USB tuaj. [00:38:25] Dhe pastaj ajo siguron të dhëna në formën e gjesteve njerëzore duke përdorur zbulimin infra të kuqe trarëve, në thelb, lëvizjet nga krahun tuaj. Pra, ndërsa ajo që Maria u përpoq më parë ishte muskuloz, në fakt ndjenja çfarë po ndryshon krahun tuaj, ky është infra të kuqe në bazë. Pra, ajo është në kërkim për lëvizjet brenda lloj i sferës së një këmbë apo më shumë i pajisjes vetë. [00:38:46] Pra, pse nuk mund ta marrë një goditje me thikë në këtë së pari? Dhe le të shkojë përpara dhe të hedhin ju deri në lart këtu. Pra, le të vënë laptop Colton e deri këtu. Ne kemi marrë Andrean në TV. Dhe çfarë do të donte mua për të bërë së pari? [00:39:00] COLTON: Shkoni përpara dhe vetëm vënë duart tuaja mbi këtë djalë dhe ju do të shihni disa shkëlqim të pabesueshëm. [00:39:04] DAVID J. Malan: Very nice. Kjo është e gjitha ndodh në kohë reale. OK. Të gjithë të drejtë, dhe yep. Aq e bukur. Në rregull, çfarë tjetër mund të bëjmë? [00:39:15] COLTON: Shko në ekran tjetër dhe të shohim. [00:39:17] DAVID J. Malan: Në rregull. [00:39:19] COLTON: Një lojë zbavitëse pak ku mund të merrni për të bërë robots. [00:39:21] DAVID J. Malan: Të gjithë të drejtë, kështu që kjo Duart e rreme që tregon mua se çfarë të bëj. COLTON: Po Pra shkoni përpara dhe kapje një nga blloqet dhe e vënë atë në krye të trupit të atij robot. DAVID J. Malan: Oh, nuk ka dora ime. Oh. OK, adorable. Prisni një minutë, OK. Nuk shkojmë. [00:39:41] COLTON: Unë bëra një në aksident. [00:39:43] DAVID J. Malan: OK, unë do të marrë këtë djalë. Damn it! Kur ne ishim praktikuar këtë të fundit natën, ju e dini se çfarë këtë transferuar në? [00:39:51] Si kjo. OK. Një tjetër? [00:39:55] COLTON: Sigurisht. [00:39:56] DAVID J. Malan: Në rregull, dhe ka një të tretë. Dakord. COLTON: Dhe në këtë, ju merrni to-- DAVID J. Malan: Oh, kjo e bukur. COLTON: --yeah, bie përveç kësaj lule. DAVID J. Malan: OK. Nuk ka? Humbur. [00:40:14] COLTON: Oh, ju shkoni atje. [00:40:15] DAVID J. Malan: Ah, Shikoni se. Very nice. E pra, pse nuk "kemi marrë nga një vullnetar këtu të cilët do të donte për të ardhur në dorë. Si për të drejtën atje në të gjelbër, është ajo? [00:40:27] Të gjitha të drejtat, dhe le have-- në vend që të bëjnë këtë, disa prej jush mund të dinë këtë lojë here-- prerë litarin, ndoshta? Le të shohim. Ne kemi syzet tona në më shumë këtu? [00:40:37] OK. Falemnderit. Çfarë është emri yt? [00:40:39] AUDIENCA: Laura. [00:40:40] DAVID J. Malan: Laura? Nisë për të parë. Nëse ju nuk e mendjes duke vënë Google Glass mbi syzet tuaja. Kjo është Colton. [00:40:46] COLTON: Hi. Gëzohem që u njohëm. [00:40:48] DAVID J. Malan: OK, eja rreth. Të gjithë të drejtë, kështu që ajo që ju jeni duke shkuar për të të bërë këtu, duke luajtur këtë më parë, është vënë dorën mbi Motion brishtë këtu. Dhe tani arrow tuaj duhet të lëvizë. Oh, jo. [00:40:57] AUDIENCA: Jo [00:40:58] DAVID J. Malan: Ne nuk duan të lënë ende. OK, prisni. Mbi këtu. Pra, vini re si ju mbani tuaj gisht mbi diçka, miun fillon për të shkuar jeshile, e cila është se si ju klikoni. [00:41:06] Pra, rri pezull mbi Play. Dhe vetëm një gisht është e mirë. Dhe tani klikoni mbi pak djalë e gjelbër në të majtë. Dhe tani të mbajë deri sa të mbush up gjelbër. Të mirë. Tani, ashtu si, niveli një deri të lartë. [00:41:16] AUDIENCA: Po, ne duam një niveli, këtu. [00:41:20] DAVID J. Malan: Mirë. OK, kështu që të gjithë ju duhet të bëni është të prerë litar. Kursori juaj është një e bardhë atje poshtë. [00:41:28] Very nice. Në rregull, kjo është për të marrë më shumë. Pra, mbani gishtin tuaj mbi të ardhshëm tani. Të mirë. Kjo është e vështirë. [00:41:39] AUDIENCA: Oh mut. OK. Ajo dëshiron të shkojë në këtë mënyrë. Oh mut, that-- [00:41:44] DAVID J. Malan: Po. Qëllimi sekondar është që të marrë të gjitha yjet. Të gjithë të drejtë, tjetër. [00:41:53] Le të shohim nëse ju mund të merrni këtë të tretë. Të mirë. OK, të shkojnë atje. [00:42:06] Të sigurt. Oh, shumë e bukur. Dakord. [00:42:11] Pra, pse nuk kemi shtyrë këtu sot? Le dikush të vijë në dorë i cili dëshiron të luajë. Thanks so much për të Laura vullnetare tonë. Dhe ne do të shohim të hënën. [00:42:18] AUDIENCA: Ju ndoshta dëshironi këto prapa. [00:42:21] Gjuha 2: Në CS50-- ardhshëm