DAVID J. Malan: Bone, tiel ĉi tie estas la Myo brako bando, paro de kiuj ni havas por CS50 fina projektoj. Kaj tio estis pruvo ni vosto vin anticipe kie esence tiu sufiĉe firme brako bando tien aŭskultas viajn muskolajn movadoj kiuj tiam mapita en programaro al Colton la tekkomputilo tien kiu havis iTunes kaj ke kanto jam vosto supren. Anstataŭ mi demoing ĉi, Colton pasis en la laboratorio klare ĉiu semajno prenanta manifestacio pretaj por unu kuraĝa volontulo. Se iu volus veni sur up-- vidis vian manon unue. -Venu. [00:01:09] Bone. Kaj kia estas via nomo? 

[00:01:13] Publiko: Uh, Maria. 

[00:01:14] DAVID J. Malan: Maria, agrable vidi vin. Venu ĉi tien. Lasu min prezenti vin al Colton. Colton, tiu estas Maria. 

[00:01:21] Colton: Hi, agrable renkonti vin. 

[00:01:23] DAVID J. Malan: Ĉiuj Bone, do tretas unu, ni estas havos vin meti tio sur via antaŭbrako tiel ke ĝi estas bela firme supren proksime via kubuto. Kaj dume, ni havas surmetis nian Google Vitra kaj ni miksas teknologioj hodiaŭ. 

[00:01:33] Colton: Unue ni devos hoko jeonon al la aĵoj. 

[00:01:36] DAVID J. Malan: Bone. Fakte, ni kunigu vian brakon kiel proksime al tiu kablo kiel ebla tiel ke ni povas unue sinkronigi ĝin. 

[00:01:41] Colton: Ni faros. 

[00:01:42] DAVID J. Malan: Kaj dume, do ke ĉiuj povas ricevi pli proksiman rigardon, ni rulos Andrew ĉambro supren sur la ekrano. Do ni havas USB kablon tio esti konektita al Maria braceleto. Kaj mi rulos Colton la ekrano supren sur la proyector proksima. 

[00:02:00] Do Colton estas registri la aparato nun kiel Myo konektita al ĉi kablo. Kaj nun kio Maria faros momente Efektive trairu la calibración paŝoj kaj instruos la programaron kiom ŝi muskoloj respondi kiam ŝi faras iujn pre-difinita Gestoj ke la programaro komprenas. Se vi ŝatus eniri antaŭ la ekrano. OK, provadi. 

[00:02:30] Colton: Iru kiel ĉi. Kaj kiel tio. Kaj la tutan vojon al la dekstra. Reiru. 

[00:02:35] DAVID J. Malan: Bone. Malsama perspektivo. Ne estas vi. Estas ni. 

[00:02:40] MARIA: OK. DAVID J. Malan: No. Ni movi ŝin pli supren tiel ĝi estas proksima al via kubuto, aŭ eĉ pli strikta. Bone. 

[00:02:52] Tie ni iras. Tiu estus bona tempo por CS52X. Tie ni iras. 

[00:02:57] Tre agrabla. OK. Dikfingro al Pinky. 

[00:03:02] Tre agrabla. Diskonigi vian fingroj. Bonan. Skuu pravas. Ĝi estas kurioze montrante vin per la maldekstra hand-- 

[00:03:17] Colton: Yeah, jen Wierd. DAVID J. Malan: Ondo de dekstren kaj movi antauxen. Rapida antaŭen salti aŭ proksimaj. Tio estas OK Ondo pravas. 

[00:03:25] MARIA Mi don't-- atendu. 

[00:03:26] DAVID J. Malan: Bezonas helpon? 

[00:03:28] Colton: Do vi iras kiel ĉi. MARIA: ĝi turniĝas la alia afero, tamen. Colton: Jes. DAVID J. Malan: Jes mi ne konas kial estas montranta vin leftie. Colton: Kial ne try-- nur provu iri kiel ĉi. 

[00:03:38] DAVID J. Malan: Neniu? Eble atingos vian brakon el iom pli rekta kaj fari ĝin pli abrupta kiel ĉi. Jes, bone, venu. 

[00:03:48] MARIA: Mi bedaŭras. DAVID J. Malan: Ne via kulpo. Colton: Estas bone. DAVID J. Malan: Bone. Well-- 

[00:03:56] Maria: Ĉu ni salti ĉi, do? DAVID J. Malan: Jes, ni lasu vin trompi la hoko. Do se iu volas fari fina projekto uzanta ĉi avangardo aparataro, realigi eble simple preni iom alkutimiĝi al. Kaj this-- la realeco estas ĉi Estas vere tre sanganta latero. 

[00:04:10] Ĉi tio estas kion nomas la ellaboranto kit, kiu estas intencita esti esence antaŭ-ĵeto tiel ke homoj povas fari ekzakte this-- batali kontraux gxi, figuro ekster kiel popola korpojn labori kun la teknologio. Do se vi volas Poste, post prelego, povas ke vi venu kaj preni alian ponardopiko ĉe ĝi. Sed alie, ronda de aplaŭdoj, se ni povis, por Maria por veni supren. 

[00:04:26] MARIA: Dankon. 

[00:04:28] DAVID J. Malan: Dankon. Ni pendigu sur ĉi tio, sed ni donos you-- kiom pri streso pilkon tien? Ho, kaj- if-- yeah, dankon. Bone. Do por la scivola, se vi estus ne konas la sonon elekto ke ni faris tie antaŭe, miriga TV montri, ke vi devus absolute esti Binge-rigardante sur Netflix Estas ĉi tie. 

[00:04:51] SPEAKER 1: Sinjorinoj kaj sinjoroj, magiisto nomata Josh. 

[00:05:04] DAVID J. Malan: Kaj ŝajne, estas aferon tekston mi dum prelego nun. Mi kalkulitan ke Maria havis naskiĝtagon hieraŭ. Tiel feliĉa naskiĝtago de CS50 Maria tiel. 

[00:05:18] Do vi eble legis en la lastaj monatoj ke ĉi sinjoroj tie, Steve Ballmer, kiuj estis reale Klaso de 1977 en la universitato, ĵus retiriĝis por Microsoft. Li estis studento tie, tiam paron jaroj poste trovis sin je Stanford Business School kiam li ricevis telefono alvoki de amiko de sia kiuj vivis en la koridoro de li tie ĉe Harvard. Ke amiko nomiĝis Vilcxjo Pordegoj, kaj tiutempe, li provis varbi Steve esti la unua negoco persono, vere, je malgranda kompanio nomon Microsoft. 

[00:05:45] A longan rakonton, Steve estis finfine gajnita super, aliĝis Microsoft kiam havis nur 30 dungitojn. Kaj kiam li retiriĝis lastatempe, la kompanio havis 100.000 oficistoj dum la pasintaj kelkaj jaroj. Ktp afiŝinto konata kiel The Verge preparis ĉi omaĝon en video ke ni opiniis, ke ni dividita kiu donas vin senton de kiom da energio Steve alportas al ajna prezento donas. [VIDEO Playback] -Microsoft Estas kiel kvara infano. Infanoj fari forlasi la domon. En tiu kazo, mi supozas Mi foriros al la domo. Hej Bill, whazzap? 

[00:06:23] -Wazzap? 

[00:06:24] -Hey, Wazzap? Ni estis doninta enorma ŝanco. Kaj Bill donis al ni, ke ŝanco. Mi deziras danki al Bill por tio. Mi volas ke vi ankaŭ. La ritmo de novigo ne tuj malrapidas. 

[00:06:42] Ĝi tuj akiri pli rapide. Tie povus esti kelkaj konkurantoj kiuj bedaŭrinde forigita! 

[00:06:54] Mi amas ĉi tiu kompanio. Jes! Mi PC, kaj mi amas tiun entreprenon! 

[00:07:08] Ellaborantoj, programistoj, programistoj, programistoj, programistoj, programistoj, programistoj, programistoj. Jes! Desarrolladores retejo! 

[00:07:19] Desarrolladores retejo! Desarrolladores retejo! Aŭskultu kion ajn vi atingi neniun ekstran postenon! 

[00:07:28] MS-DOS plenuma, nomumo calandra, karto amaso, noto kuseneto, horloĝo, kontrolo panelo. Kaj, ĉu vi povas kredi tion? Reversie! 

[00:07:35] Bruligi ilin KD! Sendi ilin al MSN! Vi sendu ilin al amikoj! 

[00:07:40] Ĉiuj kun unu klako! Unu Microsoft, strategio, unu team-- enfokusigita, disciplinado, profesiaj, kaj sperta en cxio, kion ni faras. Lasu min uzi linion de malnova filmo. 

[00:07:52] Interrilatoj estas kiel ŝarkoj. Ili moviĝas antaŭen aŭ mortas. Mi vere pensas tech kompanioj estas samaj. 

[00:08:01] [END VIDEO Playback] DAVID J. Malan: Do ni estas tiom plaĉis al anonci ke Steve estos aniĝon tie en CS50 proksima merkredo je la kutima loko kaj tempo tie. Spaco probable estos limigita. Kaj tiel aliĝi al nia persono, bonvolu kapo aŭ malmulta poste al cs50.harvard.edu/register. 

[00:08:22] Kaj ni sekvos per Mardo konfirmante makuloj. Estos atentaj por ke apud Merkredo dum prelego en CS50. Nun, en aliaj novaĵoj, mi hazarde ektrovas ĉi en The Crimson simple La alia tago. 

[00:08:34] Ĝi rezultas ke unu el CS50 bastono kaj almenaŭ unu el CS50 la lernantojn Nuntempe kurante por UC prezidanto kaj vicprezidanto, kiu revenigis min al mia propra vivo reen kiam mi perdis la UC elekto mizere. Sed la arĝento kovraĵo en kiu mi ĉiam diru la rakonto estas ke unu el la mi certas multaj kialoj, mi perdis la elekto estis kompleta manko El kikaro por publika parolanto. Kaj tiel tute honeste, ĝi pelis min, tiu sperto Mi opinias, ke mia unua jaro, por fakte subskribi ĉe Harvard Computer Society, kiu estas la grupo sur campus kiu tenas diversajn teknikajn prelegoj kaj aliaj aĵoj. Kaj mi transprenis ilian instruadon seminarioj kaj sekve havis ŝanco, mirinda ŝanco, komenci labori en ĝuste ĉi. Sed ankaŭ mi havis okazon dum tiu sperto instrui min des pli HTML. Kaj tial mi procrastinated lasta nokto de rigardis tra la HTML bazita retejo Mi faris same 1997, '98, pro mia kampanjo kiu aspektas kiel ĉi tie. Mi scias. 

[00:09:29] Because-- kaj kompreneble, avizo tiu mirinda dezajno decido en 1998 aŭ whatnot. La unua afero kiun vi volas uzantoj fari sur vizitas vian retejon estas havi klaki alia ligilo ĝuste eniri vian retejon tie kun la monaĥo malantaŭ kiel vualitaj kurteno kie Ŝajne mia kampanjo platformo estis. Kaj tio estas ĉio vi ricevos hodiaŭ estas ĝuste ekrankopio. Sed mi legis tra, kiel, mia kampanjo afiŝoj lasta nokto kaj mia platformo. 

[00:09:50] Kaj mi estis tiel kolera tiutempe. Mia platformo was-- estis interesa. Do mi trankviligis tiam. Sed iun tagon, mi kuros denove kaj espereble pli bone tiu tempo. 

[00:10:03] Do HTML, tiu lingvo en kiu mi faris ke in-- vi baldaŭ fari multe more-- Estas io ni estis parolante pri jxus kaj grandparte prenante por permesite nun ke ni translogxigxis al aliaj lingvoj. Sed ni paŭzi por momento kaj meti iun el tiuj aferoj, en kunteksto. Do en la frazo, kio estas HTML? 

[00:10:18] Aŭ, kio estas uzata por? Iu? Jes. 

[00:10:20] Publiko: Markup por retejoj. DAVID J. Malan: Markup por retejo. Do ĝi estas markado lingvo ebligas strukturi retpaĝo. Header iras tien, titolo iras tien, korpo iras tien. Tio estas grasa tiparfasono, tiu estas italics-- tiaj detaloj. 

[00:10:33] OK, nu. Tiel CSS lasas you-- kaj mi prenis kelkajn liberecojn tie kun la aŭdacaj-Facing kaj kursive ĉar ke estas pli bone implementado kun ĉi tiu. CSS is-- kio? Diru en frazo. Iu ajn. Yeah. 

[00:10:46] Publiko: ornamoj kaj ŝtofo, ekzemple kiel desegni ĝin. DAVID J. Malan: Bone, vi bona. Ornamoj kiuj permesas vin desegni ĝin aŭ stylize ĝi kun aĵoj kiel grasa tiparfasono kaj kursivo kaj koloroj kaj ankaŭ pli fajna dika situado de elementoj. Ĝi ia permesas preni aĵojn la lasta mejlo tiel ke se, ekzemple, en Pset7, eble vi rimarkis en via biletujo paĝo se vi estas ĉe tiu punkto jam ke defaŭlta tablo ke vi fari por montri la uzanto stock ekspluatadoj kaj mono probable aspektas bela malbelega implicite sen blanka spaco. Ĉio speco de superplenigas kune en vicoj kaj kolumnoj. 

[00:11:18] Nu, kun iom da CSS, kiel vi eble rimarkos, Vi povas fakte tweak tio kaj fari io multe pli familiara kaj multe belaj por rigardi. Tiel CSS estas pri la estilización de retejoj. Sed tiam ni enkondukis alian lingvo, PHP, kiu ebligas al ni fari kion? 

[00:11:36] Ni nur faru kion? Neniu. Got riski preter La unua paro vicoj. Yeah. 

[00:11:40] Publiko: Krei dinamikan enhavon. DAVID J. Malan: Perfekta. Generi dinamikan enhavon. Kaj vi povas tion fari en ajna nombro da lingvoj. Ni hazarde uzas PHP ĉar estas parte tiel simila al C sintakso. 

[00:11:50] Sed PHP faras ĝuste tion. Ĝi permesas dinamike generi eligo. Kaj iom de tiu eliro povus esti HTML, kiel ni tipe estis faranta. Kaj ĝi estas ankaŭ, ĉar ĝi estas programlingvo, estas la mekanismo tra kiu ni povas paroli kun datumbazoj. 

[00:12:03] Kaj ni povas fari konsultojn al aliaj serviloj kiel Yahoos kaj programmatically fari ion vere, ke vi povus alimaniere volas devigi komputilon fari. Do PHP permesas ni starti dinamike outputting enhavo. Do, per tiu logiko, mi ne havis dinamika retejo reen en 1998. 

[00:12:16] Estis nur statika TTT-paĝo. Mia enhavo devis esti ŝanĝita per permane kun gedit aŭ ekvivalento. Sed PHP estas kion ni uzas aŭ povus esti uzitaj prefere por iu kiel la Frosh IMS retejo, kiun supozeble prenas registriĝoj kaj administri liston de users-- aferoj efektive ŝanĝanta super tempo, ecx kvankam ni okazi uzi Perl, malsama lingvo de la epoko. 

[00:12:35] Kaj poste laste, ni enkondukis SQL-- Strukturita Query Language. Do ankoraŭ alia lingvo ke estas uzata por kio? Uzata por kio? Povas aventuran slight-- OK, ni ne iros akiri multe pli malproksimen ol la orkestron tie. Publiko: Estas protokolo kutimis paroli kun datumbazoj. DAVID J. Malan: Protokolo kutimis paroli kun datumbazoj. Lasu min tweak. Ĝi estas natura lingvo uzata paroli al databases-- selektu kaj inserta kaj forigas kaj ĝisdatigoj kaj reale eĉ pli karakterizaĵoj kiuj Ni eĉ ne eniĝis en sed vi volas explore-- havas esplori por, ni diru, fina projekto. Do estas tiuj diversaj pecoj. 

[00:13:09] Kaj espereble Pset7, kvankam lia especificación estas sufiĉe longa, ĝi estas intence longe promenadi vin tra kiom tio povas ĉiuj esti tajpita kune. Nun, lunde, ni enkondukis nian lastan lingvon ke ni formale enkonduki en la course-- te Javascript. Tio, kiel PHP, estas interpretita lingvo. 

[00:13:25] Sed ŝlosila distingo Mi proponis lunde estas ke dum PHP estas ekzekuti aŭ interpreto sur la servilo, kiu en ĉi tiu kazo estas la CS50 aparaton, aŭ eble iu komerca retejo servilo sur la Interreto, Ĝavoskripto Ĝenerale estas lingvo kiu funkcias kliento flanko Ne servilo side-- tiel en la retumilo. Kiu estas, same kiel kiam mi malfermis supren Facebook fontkodo kaj trovis ĉiujn de tiuj .js-aj dosieroj, la implico estis Kiam vi vizitas Facebook aŭ pli retejoj tiuj tagoj, vi ricevas Ne nur HTML, ne nur CSS sed tutan faskon de Ĝavoskripto kodo ofte en la formo de .js-aj dosieroj. Kaj tiam ĝi estas la browser-- via propra Mac aŭ PC-- kiu ekzekutas tiu kodo. 

[00:14:03] Sed via retumilo ekzekutu lin. Vi povas pensi en varo de sandbox. Ke kodo JavaScript ne devus esti povis forviŝi dosierojn sur via komputila. Ĝi ne devus esti kapabla sendas retpoŝtojn pri vi. Via retumilo ia limiganta kion vi povas fari kun ĝi. 

[00:14:17] Do en tiu senco, estas iom malpli potencaj, eble, ol C. Sed Javascript povas, kiel flanken, uzita sur la servilo, kvankam ni emas ne paroli pri ĝi en tiu kunteksto. Do nun ni ligi tiujn kune. Semajno pli malantaŭen, ni prezentis kelkajn HTML sur la left-- súper enuiga retpaĝo. 

[00:14:34] Simple diras saluton mondo. Kaj poste mi proponis en la dekstra povas ia ŝteli ideojn el nia diskuto de datumstrukturoj en C kaj pensas pri kiel tiu hierarkia markado lingvo maldekstre povus esti desegnitaj aŭ implementado en memoro kiel reala arbo strukturo kun nodoj kaj punteros kaj tiaj detaloj. Dekstre ni nomas ke DOM-- Dokumento Kontesti Model-- justajxon ornama maniero diri arbo. 

[00:14:56] Nun, kial tiu utila pensi en alia maniero? Ĉar nun kun Ĝavoskripto, ĉar ni havas kodo kiu alvenas al ludi en ĉi medio, la efektiva HTML tio estis sendita al la retumilo Jam kaj havas jam estis ŝarĝita en memoron de la browser en arbo en via komputilo RAM kiel tion, ni povas uzi JavaScript efektive _traverse_ aŭ marŝi aŭ serĉo aŭ ŝanĝi tion DOM arbo tamen ni deziras. Do fakte, se vi opinias pri facebook.com, se vi uzas la babilejo karakterizaĵo, se vi uzo de Gmail kaj la gchat karakterizaĵo, ion kie vi havas mesaĝojn venas denove kaj denove kaj ree, tiuj mesaĝoj estas probable, kiel, LI etikedo, listeron etikedoj, eble. 

[00:15:35] Aŭ eble ili estas nur divs plenumantojn aperi ĉiufoje kiam vi ricevas momenteto mesaĝo. Kaj tial simple signifas kion Facebook aŭ Google faras Estas ajna momento vi ricevos mesaĝo de la servilo, Ili probable uzante JavaScript por simple aldonu alian nodo al ĉi tree-- alia nodo ĉi arbo kiu tiam vide simple aspektas kiel nova linio de teksto sur via ekrano. Sed ili estas enmeto en tiu datumstrukturo. 

[00:15:57] Do en klasoj kiel CS124 kaj aliaj, vi efektive skribi pli kodo kontraŭ datumstrukturoj kiel ĉi. Sed nuntempe en JavaScript, ni simple supozi ni atingos ĉion ĉi funcionalidad senpage de la lingvo mem. Do ni rigardu ekzemplon. 

[00:16:09] Lasu min malfermi dosieron nomatan form.html. Estas súper simpla. Ĝi simple aspektas kiel ĉi. 

[00:16:15] Neniu CSS forgesis estetiko. Ĝi estas pure funkcia kaj ŝajne mi estas petante email, pasvorto, Pasvorto denove, kaj tiam ĉeko konveni al kelkaj terminoj kaj kondiĉoj. Kion la fontkodon por tiu aspektas kiel verŝajne estas io vi eble diveni per iomete da pensado nun. Mi havas formon etikedo tie. 

[00:16:32] Ago estas ŝajne tuj iru al dosiero nomata register.php. La metodo mi tuj uzos estas akiri. Kaj tiam mi hvas teksto kampo kies nomo estas retpoŝto. 

[00:16:40] Mi havas pasvorton kampo kies nomo estas pasvorto. Mi havas alian Pasvorto kampo kies nomo Estas iom arbitre konfirmo. Estas nur alia HTTP parametro. 

[00:16:49] Kaj tiam ni jam ne uzas tiujn krom ekde la Frosh IMS demo en class-- ĉeko skatolo kiu estas nur tipo egalas ĉeko. Kaj Mi vokos ke interkonsento. Do mi havas specon de arbitre sed oportune nomis tiujn kampojn. Tial nun, kiam tiu formo ricevas prezentis, vidu kio okazas. Se mi faras malan@harvard.edu, Mi tion faros pasvorton de karmezina. Mi tion faros pasvorton nenion. Ni ne kunlaboras. 

[00:17:10] Mi ne kontrolu la skatolo. Lasu min klaku Register. Kaj ĝi diras, hm, vi estas registrita. Ne vere. 

[00:17:16] Sed la URL ŝanĝiĝis. Do tiu formo estis klare permesita submetiĝi al register.php. Sed supozeble, mi estus kapti kelkajn el tiuj eraroj. Nun, en Pset7 kaj iuj de nia prelego ekzemplojn, ni ĝenerale elprinti granda ruĝa erarmesaĝo tie dirante mankas nomon aŭ malaperita pasvorton. Ni faris tion antaŭe kaj ni farita servilo flanko eraro detekto. 

[00:17:37] Sed multaj retejoj tiuj tagoj fari kliento flanko eraro detekto kie la URL ne ŝanĝas. La tuta paĝo ne fortigu. Vi akiri momenteto sugestoj de la navegador. Eble iu iras ruĝa. 

[00:17:48] Eble vi ricevas popo supren. Sed vi ne malŝparu tempon sendante al La servilo datumoj kiuj estas nekompleta. Do ni vidu kiel ni povus sukcesi tiu karakterizaĵo tiel. 

[00:17:56] Permesu al mi iri al form1.html, kiu aspektas sama. Sed se tiu tempo Mi faros malan@harvard.edu kaj mi tajpas karmezina kaj mi ne plu kunlabori sed alklaki Register, rimarkis nun. Ne estas la pli sexy solvo. Mi almenaŭ kaptis tiun eraron. Kaj mi uzis la atentigo funkcio en JavaScript-- kiun ni nur uzas en klaso. Ĝenerale, oni ne devus uzi ĉi ĉar ĝi povas tre rapide eliri de kontrolo. Sed pasvortoj ne kongruas estas la eraro. 

[00:18:19] Lasu min kaj alklaku OK. Sed kio estas la ŝlosilo takeaway tie estas ke la URL ne ŝanĝis. Do mi ne tedis forvelkado La servilo tiam demandas lin demando kiu mi povis havi komprenis la respondon al mi. 

[00:18:30] Kaj la uzanto, kvankam parolis pri tio Pli longa ol la uzanto tuj pensas pri tio, tuj havos momenteto sugestoj. Mankas latencia kun La reto conectividad. Do ni rigardas tiun fontkodon. 

[00:18:40] Form1.html rigardoj strukture similaj ĝis tie. La formo estas fakte la sama. Sed ni vidu, kion mi faris tie. Kaj ekzistas malsamaj manieroj fari tion. Kaj mi faris la plej rektaj sekvanto sed ne plej eleganta maniero ankoraŭ. Mi havas skripton etikedo. Mi tiam nomita document.getElementByID ('registro'). Kaj mi stoki ke valoro en formo, ŝanĝiĝeman. 

[00:19:04] Do kion mi faris? Vi povas pensi document.getElementByID kiel estante speciala funkcio kiu Ĝavoskripto donas kiu laŭvorte manoj vin montrilon al unu el la nodoj aŭ ortanguloj en tiu arbo. Do nun jen kio, nia formo variablo en JavaScript oni efektive fingromontrante. 

[00:19:21] Do nun la sintakso estas malsama C. Sed ni faras kelkajn aferojn tie. Unu, ĉi tiu estas iom stranga rigardante, certe kontre C. Sed rigardu linio 35. Do maldekstre form.onsubmit. Memoru ke onsubmit estas kiel kampo en struct. Se vi pensas pri la formo variablo estas nur esti C struct, ĝi povus havi iujn kampojn. 

[00:19:42] Reen en la tago, ni havis studentojn nomoj IDs, domoj, tiuj speco de kampoj. Nur pensi onsubmit kiel alia kampo. Sed estas speciala kampo ĉar la retumilo estas antaŭprogramita atendi .onsubmit por ne esti valoro kiel numero aŭ ŝnuro, sed reale esti funkcio aŭ la adreson de funkcio en la komputila memoro. 

[00:20:02] Kaj efektive, jen kio tiu ŝlosilvorto tie faras. Ĉi tio diras, donu al mi novan funkcion. Sed kia estas lia nomo tuj estos, ŝajne? 

[00:20:09] Pensante reen al lundo. Kio estas la nomo de tiu funkcio bazita sur ĉi sintakso? Ne, mi volas diri, estas klare neniu nomo associated-- certe ne kion mi reliefigis tie. 

[00:20:21] Sed tio fakte OK. Tiu estas anonima funkcio, aŭ lambda funkcio kiel iu povus nomi ĝin. Kaj tio nur signifas ĝi estas ankoraŭ funkcio. Estas nur, vi ne povas nomi ŝin laŭnome. Sed tio estas bone. Ĉar denove, la navegador estis antaŭprogramita de kompanioj kiel Google aŭ Microsoft aŭ Mozilla aŭ aliuloj nur scias ke se la .onsubmit kampo ene de formo elemento havas la valoro, trakti ĝin kiel function-- funkcio montrilo, se vi volas. Kaj nomu ĝin kiam la formo estas prezentita. 

[00:20:46] Do kio kodo devus esti ekzekutita kiam la formo estas prezentita? Ŝajne, ĉiu ene de la frizita krampoj. Kaj ĉi tio estas nur stila. 

[00:20:53] Vi povus fari tion kiel ni kutimas fari en CS50. Sed en JavaScript, la plej multaj homoj emas subteni ĝin sur la sama linio nur ĉar ĝi pli klare estas asociita kun tiu ŝlosilvorto funkcio. Do nun kion mi faras? 

[00:21:03] Se form.email.value egalas egaluloj la malplena linio aŭ nenio, jen garde kie mi intencis diri, vi devas provizi vian retpoŝtadreson, kaj tiam reveni falsaj. Kaj estas kiu revenas falsa ke malhelpas la formo de esti prezentita. Dume, se la pasvorto valoro estas blank, mi tuj krias al la uzanto kaj diri: vi devas doni la pasvorton. 

[00:21:21] Dume tio estas akirantaj iom amatoro tie. Se form.password.value ne egala form.confirmation.value, la alia kampo, krias al la uzanton ke la pasvortoj ne egalas al ili ne antaŭ momento. Kaj tiam ĉi tiu estas iom sexier ĉar mi scias mi sciis koncepte ke kontrolis estas markobutono nomo. 

[00:21:40] Do mi povas nur uzi ekkrion punkto diri se la ĉeko estas ne checked-- estas la bulea valoro, vera aŭ false-- Mi krias al la uzanto por tio. Alie, se ni fi nos ĉiuj ĉi tiuj kondiĉoj, ni simple reveni vera. Lasu la formo esti proponita. Kaj ĉi tiam okazos. 

[00:21:56] Ni entajpu karmezina. Ni marku la skatoleto, alklaku Register. Kaj nun mi iras tra la celloko. Nun, ne estas datumbazo tie. Nenio interesa en register.php. Mi nur bezonis ion por vere paroli. Do lasu min paŭzi, tie. Demandojn sur kion ni ĵus faris aŭ kion iuj de ĉi nova sintakso estas? OK, jes? 

[00:22:17] Publiko: Do ​​ajna checkbox estas aŭtomate Bulea. Vi ne devas deklari gxin tiel. 

[00:22:21] DAVID J. Malan: korekta. Ajna markobutono ke estas sendita al vi de HTML formo via JavaScript kodo estos traktata, jes, kiel Buleaj value-- vera aŭ malvera. Estas bona demando. Dum la aliaj valoroj de Certe, estis teksto, AKA kordoj. 

[00:22:36] Bone, do lasu min malantaŭenigi iom plu. Kio estis la tuta punkto de ĉi? Nur por esti klara. Kiel ni jam scias, jam de Pset7 kaj eĉ de la pasinta semajno prelego ekzemploj, kiujn ni povas evidente kontroli $ _GET $ _POST Vidi se la uzanto donas al ni malplena valoro. Memoru la malplena funkcio en PHP. 

[00:22:54] Do nur por esti klara, kio estas unu kialo ni povus ankaŭ volas fari tiun eraron kontrolanta ene de la navegador? Kio estas la motivado tie? Yeah. 

[00:23:06] Publiko: Faster, kaj vi ne sendu senutila datumoj al la servilo. DAVID J. Malan: Bone. Ĝi estas rapida. Vi ne sendu senutila datumoj por la servilo. 

[00:23:12] Do vi reiri pli tujan respondon. Kaj ĝenerale, la uzanto sperto estas bona. Pensu pri la alternativo. 

[00:23:17] Se por Gmail-- kaj estis la kazo de multaj jaroj antaŭ. Supozi vi akiris novan retpoŝton via Gmail konto, sed la sola maniero per Vidi kiu estas, kiel, reŝarĝi la tuta paĝo. Aŭ hipotezu vi alklakas ligilo por legi retmesaĝon. 

[00:23:29] Ĉiu devas reŝargi tiel ke vi povas vidi la retpoŝto. Aŭ Facebook-- vi ricevas babilejo mesaĝo. Vi ne vidos, ĝis vi reŝarĝi la paĝo aŭ alklaki iun ligilon. 

[00:23:36] Kiel, tio estus terure ĝena uzanto sperto. Kaj tiu estas kio estis kiel, klare, dorso, kiam mi kuris por UC kaj la retejo estis multe malpli dinamika kaj JavaScript ne estis tiel popularigis kiel estas nun. Kaj aĵoj estas akirantaj multe pli dinamika kaj multo pli kliento flanko en tiu senco. 

[00:23:49] Sed estas catch tie, kaj tio estas ia ĝena Gotcha. Nur ĉar vi aldonas kliento flanko detekto ŝatas ĉi ne signifas Vi povas aŭ devas forlasi servilo flanko detekto. Vi esence volas meti vian eraro kontrolanta en ambaŭ lokoj. Pro kio estis unu de la leciono lernita el la artikolo mi legis kelkajn ekstraktojn el kun tiu stulta CMS system-- Enhavo Management System-- kiu estis implementar lia autenticación sistemo, lia saluto per kia mekanismo? Ĝavoskripto. 

[00:24:20] Publiko: JavaScript. DAVID J. Malan: Ĝavoskripto, ĝuste, ĉu ne? Ĝi uzas Javascript. Kaj laŭvorte, vi uloj havas ludis iomete probable kun Chrome La Inspektisto. Kaj se mi povas trovi ĝin, inspekti elemento. 

[00:24:30] Permesu al mi iri al fari ĉiuj Chrome la ebloj. Kaj jen kiel facile ĝi estas malaktivigi JavaScript en retumilo. Kontrolu, neniu pli Javascript. 

[00:24:38] Do juste multe de la retejo tiuj tagoj estas nur tuj rompos ĉar Gmail kaj aliaj sites-- Facebook-- supozi ke JavaScript estas ebligita. Sed se vi faras ion stultan kiel nur validigi uzantoj enigo kaj kontrolanta ĝin eraroj en la kliento flanko atakanto povus facile tion fari. Kaj tiam eĉ pli inteligenta kontrauxulo kiel vi infanoj nun povus uzi Telnet aŭ Curl aŭ simple komandlinio komandoj kaj fakte sendu mesaĝojn al la servilo kiuj simile ne eraro kontrolis. 

[00:25:05] Do ĉi tiu estas pli ol uzulinterfaco decido ol ĝi estas aktuala teknika improvement-- efektivigo io kliento flanko kiel tiu. Do nun rapidan rigardon, sed tiam Mi cedu al la reta promeno tra ĉi tiu unu. En formo de du, ni fakte iris tra kaj purigis la kodon iomete. Sed mi cedu unu de la videoj Ni verŝajna embed en Pset8 ke nur montras al vi simila sintakso uzante biblioteko nomita jQuery, kio estas super, super populara biblioteko en JavaScript kiuj sincere plej homoj nur uzi tiujn tagojn kaj ecx konfuzas kiel estaĵo Javascript mem. 

[00:25:37] Kaj ĝi inklinas implici iuj dolaro signoj kaj ŝlosilvortoj kiel dokumento en krampoj tie. Sed denove, lasu min cedu al kelkaj malrapidaj tutoriales linio anstataŭ get ligita en nur sintakson. Ni pluiru al iu iom pli malvarmeta en terminoj de la aplikoj de tiu. 

[00:25:50] Do en aparta, lasu min iri antaŭen kaj malfermu ĉi tie. Venu. Tie ni iras. 

[00:25:59] Lasu min malfermi tiun bildon ĉi tie. Nenecese komplika rigardi, sed priskribas teknikon nomita AJAX-- Nesinkrona JavaScript kaj XML, kie la X por XML estas reale ne vere uzita. Inklinas uzi ion alie nomita JSON. 

[00:26:13] Sed ĉi tie estas kiel iu kiel Google Maps aŭ Google Earth funkcias. Ni provu ĉi sur la muŝo, fakte. Lasu min kaj malfermu supren Chrome en mia retumilo. 

[00:26:21] Kaj mi iros en: diru maps.google.com. Kaj efektive, se vi estas maljuna sufiĉas memori kion, kiel, MapQuest estis kiel reen en la tago, kaj eble ili ankoraŭ funkcias kiel ĉi. Kiam vi uzas por serĉi something-- 33 Oxford Street, Cambridge, Mass, ni faru this-- vin efektive, se vi volis tut supren kaj sube, maldekstra kaj dekstra, Vi devus rigardi kiel granda sago sur, kaj ĝi montrus al vi alian kadro de la mapon tien. Aŭ vi klaku forlasis kaj vin irus tien aux alia klako kaj vi irus tien. Sed anstataŭe tiuj tagoj, ni kompreneble nur preni por donita ke ni povas iri ĉirkaŭ Kembriĝo bela rapide nur alklakante kaj trenante. Sed rimarki tie estas kelkaj malglataĵojn. 

[00:26:59] Se mi tion sufiĉe rapide, kio ŝajnas esti pasante kiel mi treni iom tro rapida por la komputila teni supren? Kion vi vidas? Yeah. 

[00:27:07] Publiko: La rastrumeroj ne fortigu. DAVID J. Malan: La bilderoj ne fortigu. Ekzistas actually-- kaj vi povis vidi tion, efektive, Se vi rigardas en linio kaj paŭzo tiu aŭ reale prokrastas tion malsupren por once-- vi vidos ke ne estas azuleĥoj, kvadratoj, aŭ ortanguloj kiuj mankas en la mapo ĝis fendi dua poste, pli datumoj, pli bildoj reale aperas sur la ekrano. Kaj fakte, se ni faras tion per rigardante supren Chrome's-- diru, Chrome-- ni vidu. Ni ne povas fari tion. 

[00:27:31] Ho, Whoops. Ni malfermas maps.google.com. Lasu min fari la fenestro granda denove. 

[00:27:36] Reiru al 33 Oksfordostrato. Kio estis la retejo mi estis lastatempe? Mi havis tion, kiel, privata rant al mi mem ke mi tute tiam momenteto mesaĝon iu amiko kiu estis en linio kiu volis auxskulti. Ekzistas iuj retejo. Mi kredas ke estas Comcast-- tiel tre grandan Usona ISP. Vi povas kiam subskribi supre por nova kablo modemon servo aŭ kablo TV servo, Ili havas formon tre prudente kie demandi vin pri via adreso. Kaj havi ĉi miriga karakterizaĵo nomita auto kompleta, kiel Google, kiu komencas plenigi en la respondo al via demando. 

[00:28:04] La problemo estas, ke ili faru auto kompleta la unuaj aferoj kiujn vi tajpas. Do se vi ektajpu en 33, tio montros vin laŭvorte dome en Ameriko kiu startas kun la numero 33 antaŭ daŭre atendi vin tajpi pli. Do se vi tajpas 33 Oksfordo, tiam montras al vi cxiujn strato en Ameriko kiu havas 33 Oksfordo en lia nomo, sendepende de la urbo ke vi estas en. 

[00:28:25] Kaj tiam vi daŭre tajpadon. Kaj fine, ĝi rimarkas ke ili ne oferto servon por via hejmo en Kembriĝo aŭ io simila. Sed la punkto estas, tiu estas la plej asinine efektivigo de auto kompletigi cxiam. 

[00:28:34] Kaj Mi nur pafante sur tiu tangento denove. Sed estas bonaj manieroj uzas Javascript kaj malbonaj manieroj. Kaj tio ne estas nepre la pli bona. 

[00:28:40] Sed la punkto ĉi tie, antaŭ tiu diatriba, iris malfermi iloj malsupren tie kaj malfermu programisto iloj kiel ni kuraĝigis antaŭ, kaj prigardi la Reto langeto kiam mi premas vere rapida. Kaj rimarki tutan faskon de ricevi petojn okazis. Ĉio ĉi okazis ekde mi trenis. 

[00:28:57] Kaj lin pli probabla, ja multe de tiuj vicoj nun estas bildo oblikvo JPEG MIME tipoj aŭ enhavon tipoj. Tio estas ĉar kion chrome faras ĉiu tempo mi alklaki kaj treni, klaku kaj treni, ĉu estas rimarki, ho, mi bezonas iri demandi Google por la kahelo sur la mapo kiu estas ĉi tie, rapide elŝuti ĝin pere de HTTP, kaj tiam aldoni ĝin al la tn DOM al la foliumiloj memore arbo reprezenton por ke la uzanto, mi vidas ke ĝisdatigita kahelo. Kaj tio estas pro teknikon nomita AJAX. Reen en la tago, ĝi vere estis la kazo ke se vi volis ŝanĝi kio estas sur la ekrano, Vi devus klaki supre, sube, maldekstra, dekstre. Kaj tiam nova paĝo malfermu. Sed tiuj tagoj, ĉiu estas pli dinamika. Ĝi okazas en la maniero kiel ni homoj farus esperas reale farus interage. Kaj ĝi atingas tion per vojo de tekniko nomita AJAX, kiu estas eble la pli bona klarigebla per ekzemplo. Unue, lasu min iri antaŭen kaj malfermi dosieron nomita quote.php en hodiaŭa dissendo kodo. 

[00:29:53] Kaj tiam mi faru symbol-- Whoops. Lasu min fari simbolo = GOOG por nur kelkaj stoko. Aŭ fakte, ni faru la unu el la Pset SENPAGA. Eniri. 

[00:30:05] Kaj nun rimarki kion mi revenos. Do tio estas vere mallonga PHP dosiero kiun mi skribis ke simple depruntas kodo el Pset7 la lookup funkcio kaj sputas el uzanta ĉi frizita streĉa kaj citaĵoj kaj dupunkto skribmaniero, ŝajne, la nuna valoroj de prezo por la Entrepreno kiu pasas en tra akiras. Do ĉi tiu estas malsama el plejparto de kio ni farita en tiu avizo min laŭvorte kracxi eliras kio aspektas kiel JavaScript kodo. 

[00:30:27] Fakte, ĉi tiu estas JavaScript objekto. Fakte, nur por esti pli klara, JavaScript Objekto Notation-- JSON-- estas nur fantazio maniero diri ke vi povas reprezenti datumojn en JavaScript multe kiel vi povas en PHP uzante ŝlosila valoro paroj. Do se mi volis deklari ŝanĝiĝema en JavaScript al reprezentas Zamyla, por instance-- al struct por Zamyla-- kaj ni nomas ĝin studento, tiu variablo. Ŝia ID estas unu, domo Winthrop kaj nomiĝas Zamyla. 

[00:30:53] Sed mi povas ankaŭ havi tabelo de objektoj. Do se mi efektive volis havi tabelo en JavaScript enhavanta multnombraj tiaj objektoj, ĉi fojo reprezentante bastonon Mi ne havas tiujn tri pecoj de kodo reen al malantaŭo al malantaŭo por tiuj tri eks stabanojn. Do la sintakso, belaj simila al both-- al PHP. Sed tio estas aparte Javascript. Ĝi estas objekto skribmaniero. Do kio estas tiu utila por? 

[00:31:17] Se mi skribas kodo kiu sputas el JSON-- JavaScript Objekto Notation-- taskoj aspektas kiel tiu aŭ taskoj aspektas kiel Zamyla strukturo, Mi povas reale uzi ĉi en programoj mi skribas. Permesu al mi iri al ajax0.html. Kaj ĉi too-- ne multe penso donis al estetiko. Sed viglu kio okazas. 

[00:31:34] Lasu min kaj tajpu libera tie. Klaku akiri citaĵo. Kaj rimarkas la URL ne ŝanĝis. Sed mi tamen ekhavis popo kun ŝajne hodiaŭa penny stock prezo de $ 0.15. Do ne ĉiuj kiuj malbone. Sed la diferenco estas ke iel donitaĵoj venis reen al mi rekte. Sed ni prenu pasxo al iu pli familiara. En versio de ĉi tiu, tiam mi tajpu liberaj denove, klaku Get citaĵo, kaj now-- ho, tio estis fakte la jQuery versio. Do lasu me-- mi ne rapida antaŭen tute suficxe. Permesu al mi iri al versio du, kio estas kie mi volis. Rimarku kion mi faris tie. Mi havas retejon page-- súper simpla versio de ajna retpaĝo Vi povus uzi hodiaŭ kun tekstujon tien senpage kaj tiam ŝajne simple teksto. 

[00:32:14] Tiu ne estas formo tie, ŝajne. Sed se mi klakas akiri citaĵo, rimarkos mian retpaĝon temas pri ŝanĝi kvazaux ĵus nova momenteto mesaĝon aŭ kvazaŭ mi simple kopiis la Mapo kaj bezonis atingi pli datumoj aldonita dinamike al la retpaĝo sen la URL ŝanĝas kaj la uzanto sperto akiranta interrompita. Ja, mi estas ankoraŭ ĉe la ĝusta sama place-- ajax2.html. 

[00:32:35] Do ni rigardu nur je tiu ekzemplo kaj vidi kiel tio okazas. Lasu min iri en ajax2.html. Kaj rimarki formo unue. 

[00:32:44] Cxi tie, mi turniĝadas for auto kompleta. Kelkfoje metas ĝena se la retumilo provas montri vin via tuta historio. Do vi povas fari ĝin en HTML nur diras auto kompletigi ekstere. 

[00:32:53] Mi jam donis tiun tekston kampo symbol-- prefere IRU de simbolo. Kaj nun, tiu estas interesa karakterizaĵo. Ni ne parolis pri manlargxo sed vi povas pensi pri ĝi kiel paragrafo etikedo aŭ div etikedo. Estas kio nomiĝas en-linia elemento, kiu signifas ke vi ne ricevos paragrafo rompi supre kaj sube. Estas nur restos en linio sen batante la ekvivalenta eniri. Do mi donis tiun eron de HTML por determini solan ensalutilo ke mi arbitre nomas prezo. Kaj mi havas Proponu butonon. 

[00:33:21] Ĉar nun supren here-- kaj tio estas efektive súper miriga kiom malmulte kodo Vi povas skribi al fari relative neta things-- rimarki kion mi faris ĝis tie, se mi rulumu ĝis la kapo de ĉi tiu paĝo. Mi inkludis unue en mia kapo skripto etikedo kiu fakte referencon al JavaScript dosiero aliloke. Tiu estas de la organizo kiuj skribas jQuery, kaj ĉi tio nur donis al vi la lastajn versio de ilia jQuery bibliotekon. 

[00:33:42] Do ĉi tiu estas speco de kiel akra inkluzivi en C aŭ postulas en PHP. Vi uzas la skripto etikedo kun fonto atributo. Sed nun mia propra kodo tuj estos bone tie. 

[00:33:52] Rimarku ke mi havas funkcion nomita Quotes. Kaj tio aspektas iom kamufla unuavide. Sed ni turmentus tiu diferenco. Donu min variablo nomita retadreso. Atribui ĝin laŭvorte ĉi ŝnuro. Do, apostrofoj, citiloj en Ĝavoskripto nur donas al mi kordo. Kion signifas la pli faru? Kunmeto. 

[00:34:08] Do tio nun estas la jQuery sintakso kiu prenas iom alkutimiĝi al. Sed tio simple signifas iri min la DOM nodo kies identificador sola estas simbolo. La hashtag tie signifas solan ensalutilo simbolo. 

[00:34:21] La dolaro signo en la krampoj simple signifas, envolver ĉi en jQuery ia sekreta saŭco tiel vi ricevos pliajn funkciojn. Kaj tiam .val ŝajne funkcio, aŭ kiel ni diras nun, metodon ene de tiu nodo ke nur donas la valoron. Do resume, malbela kaj konfuzanta kiel tio aspektas unuarigarde, tio simple signifas akiri la uzanto tajpita en, metis ĝin ĉe la fino de la kordo per concatenando ĝin. Tio estas ĉio. 

[00:34:43] Do nun, lasta tri linioj. Vi povas elpremi multan funcionalidad el tri linioj. Ĉi dolaro signo, kiel flanken, estas simple alnomo por speciala tutmonda variablo nomita laŭvorte jQuery. 

[00:34:55] Dolaro signo simple aspektas malvarmeta. Do la jQuery komunumo ĝuste speco el uzis ĝin kiel ilian specialan simbolon. Ĝi ne signifas kion ĝi signifas en PHP. En JavaScript, dolaro signo estas ĝuste kiel litero de la alfabeto aŭ nombro por variablo. 

[00:35:07] Vi povas simple havi ĝin kiel nomon. Nur aspektas malvarmeta. Do la komunumo adoptita kiel alnomo cxar ilia propra biblioteko nomita jQuery. 

[00:35:13] Kaj estas súper populara. Do nepre JSON estas ĝuste tio. Ĝi estas funkcio kiu la ulojn ĉe jQuery skribis kiu metas JSON el server-- JavaScript Objekto Skribmaniero. De kio URL ĝi iras por akiri tiun informon? Ŝajne de tiu URL tie. 

[00:35:27] Kaj kion faru la retumilo faru kiel Kiam ĝi atingas reen ĉi respondo? Kaj tiu estas la magio de AJAX, tiel speak-- Asynchronous JavaScript en XML. Estas malfacile vidi kun tia Simpla ekzemplo kiel ni havis ĉi tie. 

[00:35:41] Sed tiu estis nesinkrona en la senco ke mia kodo kiam ekzekutita sendis mesaĝon al la servilo iri min iom JSON. Kaj okazis super rapida ke mi ricevis respondon. Sed kio estas interesa estas kiu ĉi linio de kodo ne pendas mia komputilo. 

[00:35:55] Mi ne vidis ŝpinita ikono. Mi ne perdis la kapablo movi mian muson. Mia retumilo estis vere perfekte bone. 

[00:36:01] Se la vojo JavaScript manipulas la respondo de la servilo estas kiel sekvas. Vi registri kion vi volas alvoki oni callback funkcio, kiu simple signifas, hej, Ĝavoskripto. Tuj kiam la servilo respondas kun JSON, bonvolu voki ĉi anonima funkcio. 

[00:36:18] Kaj bonvolu pasis en tiun funkcion ajn ŝnuro la servilo kraĉis kiel argumento nomata datumoj. Do en aliaj vortoj, se Mi ariganta dinamike URL quote.php pasi en ĉi simbolon kiel FREE aŭ GOOG aŭ whatnot, Mi do rakontis Ĝavoskripto iri bonstata URL. Memoru ke la retumilo tuj revenos ion kiuj aspektas kiel ni vidis earlier-- ĉi. 

[00:36:42] Kaj kio estas la dua argumento tie akiri JSON estas diranta ĝi nomas tiun funkcion kiam la servilo ricevas reen ĉu ĝi estas 10 milisekundoj de nun aŭ 10 sekundoj de nun. Kaj kiam vi faros, aldonu la prezo al la paĝo. Tiu sintakso tie nur signifas iri preni la nodo el la arbo kies identificador sola Estas price-- ke span ni vidis antaŭe. 

[00:37:01] Tiu metodo nomata HTML simple diras, iru anstataŭi la HTML kiu estas tie kun data.price. Kio data.price? Nu, la navegador, memoras, montris al mi ĉi revenanta. Do tio estas datumoj. 

[00:37:14] Kaj tial estas iom kamufla vidi la komoj tie. Sed fakte, lasu min fari tion. Lasu min nur alglui ĉi reala rapida en gedit kaj Tiukaze kiel ni montris Zamyla strukturo antaŭe. 

[00:37:27] Kion la servilo sendas reen estas iom celo kiu aspektas kiel ĉi. Ktp data.price estas nur donante min 0,1515. Tiel multa movanta partoj tie cxiujn samtempe. 

[00:37:39] Sed la ŝlosilo takeaways estas ke ni havas tiun kapablon fari aldonan HTTP petoj uzante JavaScript sen devi reŝarĝi la paĝon. Kaj tiam ni povas reale ŝanĝi la retpaĝo sur la muŝo. Kaj ĝi rezultas ke JavaScript kaj aliaj lingvoj povas esti uzata nun, ne nur al mutate retpaĝojn, sed efektive skribi programaron en reala komputilo, ne nur limigitaj al Chrome aŭ similaj. 

[00:38:00] Fakte, if-- Colton, ĉu vi ŝatus aliĝi kaj reen supren tie kun via laboratorio kodo, kaj Chang tiel? Ni iru antaŭen, li parolis anonima funkcioj kaj callbacks kaj vere tentas sorton tie kun live demo kun sanganta rando teknologio, unu el tiuj Elite Motion mekanismoj. Nun, ĉi tiu mekanismo, recall, Estas iom mekanismo USB tiel that-- tio beautiful-- kiu ŝaltas en via USB havenoj. 

[00:38:25] Kaj tiam ĝi havigas enigo en formo de homaj gestoj detektante uzante transruĝaj radioj, esence, movadoj de via brako. Do dum kio Maria provis antauxen iris muskola, vere sentas kio ŝanĝanta via brako, tiu estas transruĝa bazita. Do ĝi serĉas movadoj ene la varo de sfero de piedo aŭ tiel de la aparato mem. 

[00:38:46] Do kial mi ne prenas ponardopiko ĉe tiu unua? Kaj ni iru antaŭen kaj forĵetu vin de la superkape tie. Do ni metu Colton la tekkomputilo tien. Ni havas Andreon sur la TV. Kaj kion vi ŝatus min fari unue? 

[00:39:00] Colton: Iru antaŭen kaj nur metu vian manon super tiu ulo kaj vi vidos iuj fabelaj scintilado. 

[00:39:04] DAVID J. Malan: Tre bele. Tiu estas ĉiuj okazas en reala tempo. OK. Bone, kaj Yep. Tiel agrabla. Bone, kion alian ni povas fari? 

[00:39:15] Colton: Iru al la sekva ekrano kaj vidu. 

[00:39:17] DAVID J. Malan: Bone. 

[00:39:19] Colton: Amuza ludeto kie vi akiris fari robotoj. 

[00:39:21] DAVID J. Malan: Bone, do ĉi estas falsaj manojn montrante al mi kion fari. Colton: Jes Do iru antaŭen kaj kroĉi unu el la blokoj kaj metis gxin sur supro de tiu roboto korpon. DAVID J. Malan: Ho, tie estas mia mano. Oh. OK, adorable. Atendu minuton, OK. Tie ni iras. 

[00:39:41] Colton: Mi faris unu akcidento. 

[00:39:43] DAVID J. Malan: Bone, mi prenos tiun knabon. Damn it! Kiam ni praktikis ĉi lasta nokton, vi scias, kio estas tiu ekhavis en? 

[00:39:51] Kiel tiu. OK. Proksima? 

[00:39:55] Colton: Certe. 

[00:39:56] DAVID J. Malan: Bone, kaj jen mia tria. Bone. Colton: Kaj en ĉi tiu, vi ricevas to-- DAVID J. Malan: Oh, ĉi onia bela. Colton: --yeah, elektu aparte tiu floro. DAVID J. Malan: Bone. Neniu? Missed. 

[00:40:14] Colton: Ho, tie vi iros. 

[00:40:15] DAVID J. Malan: Ha, Rigardu tiun. Tre agrabla. Nu, kial dont 'ni preni el unu volontulon tie kiuj volus veni supren. Kion pri pravas en la verda, ĉu? 

[00:40:27] Bone, kaj ni have-- anstataŭ fari tion, kelkaj de vi sciu ĉi ludo here-- tranĉi la ŝnuron, eble? Ni vidu. Ni havas niajn glasojn sur ĉi tien? 

[00:40:37] OK. Dankon. Kio estas via nomo? 

[00:40:39] Publiko: Laura. 

[00:40:40] DAVID J. Malan: Laura? Nice vidi. Se vi ne gravas meti Google Vitra super viaj okulvitroj. Tio estas Colton. 

[00:40:46] Colton: Saluton. Agrable renkonti vin. 

[00:40:48] DAVID J. Malan: Bone, venu sur ĉirkaŭ. Bone, do kion vi tuj do tie ĉi, ludinte antauxvidante, metas la manon sur La Leap Motion tie. Kaj nun viaj sago devus movi. Ho, Nope. 

[00:40:57] Publiko: No. 

[00:40:58] DAVID J. Malan: Ni ne volas ĉesigi ankoraŭ. OK, atendu. Super tie. Do rimarki kiel vi tenas vian Fingro super io, la muso komencas iri verda, kiu estas kiel vi klaku. 

[00:41:06] Do ŝvebi super Play. Kaj nur unu fingro estas fajna. Kaj nun klaku la eta verda ulo maldekstre. Kaj nun tenas ĝis plenigita verdo. Bonan. Nun, kiel, ebenaĵo ĝis supro. 

[00:41:16] Publiko: Yeah, ni volas ebenaĵo, tie. 

[00:41:20] DAVID J. Malan: Bone. OK, do ĉiuj vi devas fari estas tranĉi la ŝnuron. Vian kursoron estas blanka sube. 

[00:41:28] Tre agrabla. Bone, temas pri akiri malmola. Do teni fingron sur proksimaj nun. Bonan. Ĉi tiu estas malglata. 

[00:41:39] Publiko: Ho fek. OK. Ĝi volas iri tiun vojon. Ho fek, that-- 

[00:41:44] DAVID J. Malan: Jes. Malĉefa celo estas atingi ĉiujn stelojn. Bone, sekva. 

[00:41:53] Vidu se vi povas akiri ĉi trian. Bonan. OK, iru tien. 

[00:42:06] Certa. Ho, tre afablaj. Bone. 

[00:42:11] Do kial ni ne adjourn tien hodiaŭ? Estu iu trafos sur kiu volas ludi. Danke tiel por Laura nia volontulo. Kaj ni vidos vin lunde. 

[00:42:18] Publiko: Vi probable volas tiujn dorso. 

[00:42:21] SPEAKER 2: Al la sekva CS50--