>> [MIZIK jwe]
>> DAVID Malan: Sa a se CS50.
Sa a se kòmansman an nan semèn nèf.
Lè sa a se sa ki ta gen te 200th anivèsè nesans Mesye Boole a.
Se konsa, sa a se zanmi yo ki moun nou te mansyone
kèk fwa lè l sèvi avèk sou Varyab Boolean vre ak fo,
1 ak 0 ak sa yo.
Lè sa a te Google la peye lajan taks bay l 'jodi a.
Li ta te vire 200.
Se konsa, si ou ta renmen rantre nan nou pou manje midi CS50,
pran yon gade nan lyen ki sou sit entènèt kou a la.
Apre sa, ap fè fas sa yo ak zanmi kòm sa yo tann ou isit la nan Cambridge.
Ap fè fas tankou sa yo tann ou nan New Haven.
Epi, an reyalite, Ken nan New Haven dous te fè
sa k ap rele yon GIF anime nan Eli isit la nan yon ki sot pase lunch-- yon GIF se ankò
yon lòt fòma dosye grafik, ak kote ou ap familiar-- ki
sanble yon ti kras yon bagay tankou sa a.
Se konsa, jis yon sekans de- OK.
Pa gen moun ki isit la nan Cambridge se ri.
Men, nan New Haven, sa a se reyèlman komik, dwa?
Tout dwa.
>> Se konsa, rantre nan nou la.
Isit la nan Harvard, espesyalman, sa a Mèkredi,
si ou se yon sophomore oswa nevyèm ane even-- oswa menm junior-- panse a fè
yon switch nan òdinatè syans, konnen ke gen pral
dwe yon CS konsèy ki jis sa a Mèkredi, yon ti tan apre klas
nan 4:00 PM nan òdinatè a bilding syans Maxwell Dworkin.
Nou pral mete sa a sou la nan kou sit pa demen, kòm byen.
Donuts, mwen te di, yo pral sèvi.
>> Tout dwa.
Se konsa, komik story-- mwen te poking alantou sou entènèt la,
ak mwen jwenn kèk achiv fin vye granmoun nan sit entènèt ansyen m 'yo.
Epi li vire out-- alantou sa a tan, li sanble trè alè
depi m 'ranmase ke eleksyon yo UC se sou Kovèti pou moute ankò.
Se konsa, mwen kouri pou UC, pèdi miserable.
E petèt sa a te nan pati poukisa.
Se konsa, sa a te sit entènèt mwen an nan moman an.
Pou kèk rezon, mwen te panse li te yon bon lide, anvan di moun
sa platfòm m 'te ak poukisa yo ta dwe vote pou mwen, pou yo gen
klike sou antre nan yo chèche konnen ki enfòmasyon, ki nan retrospective se
kalite grenpe.
Mwen pa vrèman konnen ki sa ki te ye a.
>> Men, li sètènman pa t ' ede kanpay mwen.
Mwen menm mwen te te jwenn ke pa ansyen year-- mwen te gen sa a kalandriye Muppet.
Mupe yo te kalite nan lamòd tounen lè sa a.
Oswa petèt yo pa t '.
Mwen te gen yon kalandriye Muppet tounen lè sa a.
Apre sa, mwen te panse li ta dwe fre nan non òdinatè mwen an sou rezo Harvard la
frogman.student.harvard.edu.
Nan moman sa a, nou tout te gen inikman non lame idantifye.
Epi ou te kapab chwazi kèk vo anyen non olye pou yo pwòp non ou yo.
Apre sa, mwen te ale ak frogman pou kèk rezon.
>> Lè sa a, mwen started-- Mwen te pase yon anpil nan tan klike nan lyen sa yo
sa a maten.
Lè sa a te paj sou mwen, ki kounye a kalite sanble adorabl.
Men, li tou temwaye nan jis ki jan lwen teknoloji te vini.
Mwen vle di, li tounen nan jou a, yon 486 te yon bagay.
Jou sa yo, li nan super, super, super dousman ak byen mwens
pase ou ta ka gen nan ou pwòp pòch jou sa yo.
Genyen plis sou deyò ki te menm plis anbarasan.
Se konsa, mwen pral kite li nan sa.
Men sa ki te premye fwa mwen plonge nan web-- oh, pa gen okenn.
Sa pa t '.
Premye plonge reyèl mwen an Programmation Web te sit sa a, ki mwen jis bliye.
Nan kèk pwen, mwen te aprann ki jan yo fè imaj background repetisyon.
Se konsa, mwen te jwenn sa a twil efikas, tankou jwè Hockey, foutbòl, ak gòlf
boul, oswa kèlkeswa sa ki se pou sit entènèt la Frosh IMS.
Lè sa a te aktyèlman, vrèman nan premye pwojè ki baze sou wèb mwen te pran on--
Mwen panse ke petèt sophomore ane, jinyò year--
apre w pran CS50 ak CS51, yon sèl nan klas yo komen swiv-sou.
Mwen remake nan kap a achiv yo
ke youn nan m 'ak siksesè zanmi, Lee, kalite chanje
copyright an nan kè l '.
Men, sa a te depoze yon bagay ki Mwen ta dwe posede anbarasman nan.
Men, nan moman an, sa a te sit entènèt la premye,
jan mwen te di yon kèk semèn de sa, pa ki te kapab nevyèm ane
enskri pou espò anndan kay isit la.
Se konsa, li vire soti ke imaj background
tankou sa yo pa tankou yon bon lide.
Men, entènèt la te nouvo, ak nou te fè eksperyans tout.
Lè sa a se sa m ' aparamman te fè nan moman an.
Tout dwa.
Se konsa, san yo pa plis tarde, nou chanje angrenaj jounen jodi a pral ban nou an, reyèlman,
moso nan final la ke ou ta ka jwenn itil espesyalman pou pwojè final
men tou, ki pral kòmanse fè World Wide Web la antye
santi yon ti jan ti kras pi plis konprann.
Vreman vre, nou ap ale nan entwodui yon sèl plis lang programmation
rele JavaScript sa a, se menm jan an ak diferan nan diferan fason
soti nan lang nou te gade konsa byen lwen.
>> Se konsa, C, sonje, se sa a ak lang konpile.
Ou te gen nan kouri li nan yon du.
Ou jwenn kòd sous fè objeksyon Kòd, oswa zero ak moun yo.
Ak sa yo se zero ak moun yo ki CPU ou, Central otomatik Inite,
aktyèlman konprann.
PHP, pa kontra, se pa yon lang konpile.
Li se yon ki sa?
Se yon lang entèprete.
Se konsa, gen nan kèk pwogram rele yon entèprèt ki
te li tèt l-- anba, gòch a regleman
ak figi konnen ki sa ki tout nan sentaks ou fè ak vle di,
si li nan yon bouk oswa yon kondisyon oswa nenpòt ki lòt nimewo nan pwogram
konstwi.
Se konsa, sa a, se yon lang entèprete.
>> Lè sa a, nou prezante HTML.
Apre sa, HTML a pa menm yon lang programmation.
Nou ta rele l 'ki sa?
Yon lang markeup, ki se jis yon sòt de anpenpan fason pou li di li
pa gen pwogramasyon konstwi tankou nou te wè menm tounen nan jou a nan grafonyen moun.
Pa gen okenn pasan.
Pa gen okenn kondisyon.
Li reyèlman se yon lang sou regilye nèf semenn klas moute done ou
ak fòma li oswa structuration l 'nan kèk fason.
>> CSS, pandan se tan, Menm jan an tou pa yon lang programmation.
Li nan menm plis estetik oryante.
Apre sa, li pèmèt ou sòt nan amann-melodi bagay sa yo tankou font size ak koulè
ak plasman ak nan tout sa.
Lè sa a, nou te gen
>> SQL.
Se konsa, SQL se vre yon pwogram ak lang nan kèk sans,
kwake pwepare espesyalman nan baz done.
Men, menm si nou sèlman entwodui ou nan chwazi ak insert ak efase epi mete ajou
ak yon koup la lòt moun, vire soti ou kapab aktyèlman
ekri fonksyon oswa pwosedi, menm jan yo ap
rele, nan SQL ki gade ak aji byen tankou PHP ak C fonksyon.
Se konsa, konnen ke moun egziste.
Men, nou pa menm bezwen deranje avèk yo kòm nou jis grate sifas la isit la.
Lè sa a, JavaScript, dènye a nan lang nou an fòmèlman prezante.
Se konsa, JavaScript, tou, se yon lang entèprete.
Ak moun ki yo konnen yo, fè ou vle yo fè distenksyon ant li
ak kèk karakteristik soti nan tou de C ak PHP?
Ki sa ki fè li diferan?
>> ODYANS: Li pa nan konpile.
>> DAVID Malan: Di ankò?
>> ODYANS: Li pa nan konpile.
>> DAVID Malan: Li pa nan konpile.
Se konsa, li, tou, se entèprete.
Se konsa, li pa nan konpile.
Men, ki fè li yon ti kras tankou PHP.
Men, li la toujou diferan de PHP nan kèk fason travyè,
omwen nan chemen an nou pral sèvi ak li.
Yeah?
>> ODYANS: Li kouri kliyan-kòt.
>> DAVID Malan: Li kouri kliyan-kòt, anjeneral.
Sa a tout bon distenktif nan karakteristik pou nou kounye a.
C te sèvè-bò nan sans ke nou te fè tout bagay nan CS50 IDE.
PHP konsa byen lwen te gen sèvè-bò tèl degre
kòm li, tou, vin interpreted-- pa konpile, men interpreted--
andedan CS50 IDE, ki nan kou se jis yon sèvè oswa serveurs nan nwaj la.
>> Men, JavaScript, menm si ou w ap ale
yo kòmanse ekri li pou, di, pset uit e petèt final projects-- w ap
ale nan dwat li nan CS50 IDE ak sove li
nan dosye ki nan CS50 IDE, CS50 IDE ak, nan vire, serveurs yo nwaj
ki te sou li a anime, yo pa pral ka esplike nou rèv oswa egzekite kòd ou a.
Olye de sa, li k ap pase yo dwe voye nan inaltere fòm desann nan navigatè a.
Apre sa, li nan Lè sa a, pral fè IE oswa Chrome oswa Firefox oswa Safari
oswa kèlkeswa sa ki aktyèlman entèprete li, anwo jouk anba, gòch a dwat.
Se konsa, distenktif nan kle karakteristik pou jodi a
se ke JavaScript se kliyan-kòt ak PHP, pou egzanp,
gen te sèvè-bò.
Koulye a, sa a gen enplikasyon enteresan pou, tankou, pwopriyete entelektyèl
ak ki moun ki ka aktyèlman wè kòd ou a.
Ak tout bon, ou ka ale sou entènèt la ak wè ki pi
nenpòt kòd ki yon moun gen ekri nan JavaScript.
Pafwa li nan lizib, pafwa li nan obfuscated.
Men, plis sou sa nan tan garanti dwa moun.
>> Se konsa, JavaScript, joliman ase, se super ki similè yo, syntactically, nan C.
Apre sa, anpil tankou PHP, gen nan pa gen fonksyon prensipal la.
Si ou vle kòmanse ekri JavaScript kòd, jan ou pral wè jodi a,
ou jis kòmanse ekri li.
Men, li se, ou ap wè, patikilyèman itil nan yon kontèks navigatè entènèt.
Sepandan, ti kras mwen disclaimer-- anjeneral earlier--
te yo di ke ou kapab de pli zan pli jodi a itilize JavaScript sèvè-bò
lè l sèvi avèk yon fondasyon anpenpan rele Node.js ke kèk nan pwòp aplikasyon CS50 nan
sa ekri nan.
Tcheke 50 aktyèlman sèvi ak Node.js.
Men, nou ap ale nan konsantre sou JavaScript kliyan-kòt isit la sou deyò.
>> Se konsa, isit la se yon seri kondisyon yo nan PHP.
Padon, in-- aktyèlman, ki deklarasyon, tou se kòrèk.
Isit la se tou yon seri kondisyon yo nan JavaScript.
Syntactically, li se ki idantik ak C ak PHP.
Ekspresyon Mesye Boole a yo, Menm jan an tou, syntactically
ki idantik nan tou de C ak PHP.
Nou genyen tou switch nan JavaScript ki gade idantik.
Nou gen pou pasan ki estriktire idantik,
pandan y ap pasan, fè pandan y ap pasan.
>> Yon sèl sa a se yon ti kras diferan.
PHP te gen a pou chak konstwi ke ou ta ka lè l sèvi avèk
oswa ou pral sèvi ak nan pset sèt, petèt.
JavaScript gen sa a vèsyon espesyal nan pou kote ou literalman di yon bagay
tankou pou varyab kle nan objè, ki se yon fason trè somèr nan li di:
si mwen te gen yon object-- ak nou pral pale sou sa yo ankò nan yon moment--
e mwen vle repekte sou tout ki gen valè kle pè yo andedan,
Mwen pa gen figi konnen kouman ou kapab numériquement endèks yo ak zewo, yon sèl,
de, twa.
>> Mwen kapab literalman di sa a.
Yo, epi sou chak iterasyon, JavaScript pou m 'pral mete ajou kle nan varyab
yo dwe kle a an premye, Lè sa a, kle a kap vini an, Lè sa a, kle a kap vini an, Lè sa a, kle a kap vini an,
ak pou fè.
Apre sa, mwen ka jwenn nan valè li yo pa trete yon objè nan JavaScript, menm jan nou pral wè,
tankou si li nan yon asosyatif etalaj nan PHP.
Vreman vre, si ou finalman vlope ou lide alantou ki sa yon etalaj asosyatif se
nan PHP, ou ka panse a li pou kounye a kòm ki idantik ak yon objè nan JavaScript.
Men, sa a yon ti jan nan yon Senplifikasyon.
>> Ranje gade, joliman ase, ki idantik to PHP eksepte pou yon sèl karaktè.
Genyen yon sèl bagay manke isit la ke nou te fè wè semèn pase a ak PHP.
Ki sa ki nan omisyon?
Yeah?
Pa gen siy dola.
Se konsa, nou ap tounen nan yon plis mond nòmal kote
varyab pa gen siy dola.
Men, ou fè prefiks yo ak var, tipikman.
Apre sa, var vle di varyab.
Apre sa, anpil tankou PHP se blesi typed-- kijan gen kalite,
gen nimewo ak strings ak flote ak sa forth--
JavaScript Menm jan an tou gen kalite.
Men, li la blesi tape nan ke nou nan pwogramasyon pa bezwen presize yo.
Nou jis gen yo dwe okouran ki diferan egziste.
>> Varyab, meanwhile-- isit la nan ki jan nou ta ka deklare "hello, mond"
kòm yon fisèl.
Avi li nan ki idantik ak PHP men pa siy dola.
Lè sa a se yon bagay nou pral kòmanse wè plis jodi a,
kijan ou gen yon objè ak kle ak valè.
Men, si ou vle eseye dégager soti nan dènye week--
sentaks la se yon ti kras diferan.
Men, yon ti kras saniti check-- konbyen kle sa a objè sanble yo genyen?
Se konsa, mwen wè kat.
Mwen wè de.
>> Se konsa, li la aktyèlman de.
Se konsa, sa a se yon koleksyon nan de pè kle-valè.
Kle a se senbòl ki gen valè FB.
Kle a se pri ki gen valè 101,53.
Se konsa, sa yo se de pè kle-valè.
Epi sonje, PHP-- ak sa a se ankò jis sòt de Massachusetts Institute of Technology diferans.
Li pa tout sa ki entelektyèlman enteresan.
PHP ta ka te ekri sa a menm bagay tankou follows-- quote, egal.
Apre sa, mwen chanje sa yo parantèz kare.
Lè sa a, mwen chanje sa a yo yon mo te site, "pri."
Lè sa a, mwen pa sèvi ak yon kolon.
Ki sa mwen sèvi ak semèn pase a?
Yeah, siy ki egal arrow notasyon Funky.
>> Lè sa a, mwen te fè menm bagay la isit la.
Menm bagay isit la.
Epi sa a, tout moun.
Se konsa, li nan amann si sa a pa gen anyen reyèlman koule nan nan memwa jis
ankò paske li vrèman entelektyèlman entérésan.
Li nan diferans ki genyen jis Massachusetts Institute of Technology.
Men, lide yo yo se egzakteman menm bagay la.
Anndan nan varyab sa a quote nan JavaScript
se yon koleksyon pè kle-valè, youn nan ki se senbòl, youn nan ki
se pri.
Apre sa, mwen ka jwenn nan sa yo valè ak sentaks ki anba la a.
Jis tankou nan PHP, mwen te kapab fè yon bagay like-- kite
m 'fè bwat sa a yon ti kras pi gran.
Jis tankou nan PHP, mwen te kapab fè sa a men oh, dammit.
Vini non sou.
>> Jis tankou nan PHP-- OK, nou pral jis itilize nòt yo prezantateur.
Jis tankou nan PHP, mwen kapab fè quote $ quote ["senbòl"] $,
ak sa a pral jwenn m ' valè a nan "senbòl."
Nan JavaScript, li pral yo dwe ki idantik, annakò ak sa mwen ka jis fè sa.
Bagay la sèlman ki nan manke se siy a an dola.
>> Se konsa, joliman ase, lè sa a, gen nan pa tout sa ki anpil nouvo sentaks.
Se konsa, sa jodi a nou konsantre sou, reyèlman, se kèk nan lide yo ak aplikasyon pou yo.
Ak premye a sa yo aplikasyon ki ou ta ka
te wè si ou plonje nan pset sèt deja se sentaks sa a.
Se konsa, nan pset sèt, si ou te wè oswa pa t 'wè li ankò,
konnen ke gen nan yon dosye ke nou bay ou rele config.json-- JavaScript
Objè Notasyon.
Poukisa?
Nou te vle pou kapab ofri ou ak yon modèl ak kèk pè kle-valè.
Nou te vle pou kapab ba ou yon lis nan lame a, non an nan sèvè a.
Nou te vle ba ou yon kontneur pou non itilizatè ou an
ak yon kontneur pou modpas ou.
Si ou pa ap wè sa a ankò, nou pa enkyete.
Plis sou sa a nan pset sèt [? espèk. ?] Lè sa a,,
evidamman, nou vle ou ranpli nan a-dos nan
paske lè ou ale nan CS50 IDE, chak nan nou
gen non itilizatè pwòp ou yo epi modpas.
>> Se konsa, nou te kapab te itilize yon mwatye yon douzèn oswa plis diferan fòma dosye-a.
Nou te kapab te itilize yon dosye .txt.
Nou te kapab itilize yon dosye CSV.
Nou te kapab te itilize yon INI ranpli, yon dosye XML,
yon pakèt tout plis akwonim ki ou pa ta ka te janm tande.
Li nan kalite abitrè nan fen a nan jounen an.
Men, super popilè jou sa yo se yon tèks fòma rele JSON-- JavaScript objè
Notasyon ki sanble tankou sa a.
Li se yon ti kras skre, men remake modèl yo.
Ou kòmanse ak yon Curly louvri atèl, epi ou fini ak menm bagay la.
Anndan nan ki se yon bagay.
Li se yon pè kle-valè.
Se konsa, sa a se yon bagay ki mwen se gade nan sou ekran an isit la
ki gen yon sèl kle yo, ki te gen yon sèl valè.
Epi jis èksklamasyon ki baze sou la modèl anvan yo, sa ki nan kle a isit la?
Database, bagay la kite nan kolon an.
>> Koulye a, valè a k ap pase yo yon liy miltip tan sa a.
Men, valè a kòmanse ak yon Curly mete sipò epi li fini ak yon atèl Curly.
Se konsa, sa ou ta pwopoze se nan di ki kalite valè nan nan baz done?
A diksyonè oswa, jis plis suksen, yon objè.
Dwa?
Sa a se kalite yon estrikti done ki ka itilize lòt estrikti nan tèt li.
Se konsa, si sa a tout antye bagay nou ap rele yon object-- ak yon objè
se jis yon pakèt moun sou kle-valè pairs-- nan valè de baz done li menm se yon objè.
Valè a nan baz done a gen yon pakèt antye ki gen valè kle pè, premye a nan yo ki
se lame, lè sa a non, lè sa a non itilizatè, lè sa a modpas,
chak nan ki gen valè, pandan se tan, li nan jis yon fisèl raz nan quotes doub.
>> Se konsa, menm si sa a pa super klè jis ankò,
konnen ke sa a se jis yon estanda, san patipri raz fason
a estoke done nan yon fòma estanda.
Men, erè sa yo komen ou ta ka fè, menm nan pset sèt,
se ti kras bagay sa yo estipid, tankou si ou aksidantèlman retire okenn pati vigil a la.
Sa k ap pase yo rezilta nan dosye a pa nesesèman ke yo te lizib.
Si ou aksidantèlman retire okenn pati bagay sa yo tankou nan quotes, li pa k ap pase yo dwe lizib.
Se konsa, li nan yon fòma dosye bèl nitpicky, men li la yon sèl sa a, se super komen.
Apre sa, nou rive yo sèvi ak li, menm si ou pa sèvi ak nenpòt JavaScript otreman,
nan pset sèt.
>> Tout dwa.
Se konsa, sonje foto sa a.
Nou te pale de, nan HTML, ki kòd a ta ka gade tankou sa a.
Sa a se ipèrtèkst markeup lang nan [Fèbl] pou jis "hello, nan lemonn."
Men, lè sa a nou pwopoze yon pandan y ap tounen ke si li te ede,
ou ta ka vle kòmanse panse sou sa a deja kòm yon pye bwa.
An reyalite, dekoupaj an ke nou itilize jis pou dedomajman pou lizibilite nan
oswa pou dedomajman pou style la sou bò gòch la kapab kalite
dwe tradui nan pye bwa sa a, kote ou gen kèk ne rasin espesyal ki nou pral
generic rele dokiman, anba a ki se eleman ki HTML rasin oswa tag, HTML,
ki Lè sa a te gen de timoun, tèt ak kò.
>> Lè sa a, nan vire, ki an tèt te gen yon tit.
Ak tit te gen yon valè tèks.
Ansanm ak tout kò Menm jan an tou te gen yon valè tèks.
Se konsa, si w ap konfòtab pawòl ki repons lan se wi, ou ta ka pran HTML sa a
epi trase yon foto tankou sa a, bò lanmè a men dwat-ou
se yon modèl mantal bèl paske kounye a ke nou gen JavaScript, se yon pwogram
lang ki navigatè kapab egzekite ak entèprete pou ou,
li vire soti ke sa nou ap pral fè nan kòd
se kòmanse manipile sa a estrikti pyebwa ki nan memwa.
Nou pa gen bati pye bwa a nan memwa.
Nou pa dwe fè sòt de pset-senk-style estrikti done
konpleksite.
Navigatè a, joliman ase, sou entèprete HTML anwo jouk anba,
gòch la oswa dwa, se literalman ale nan men nou ekivalan a nan yon konsèy
ak sa yo ki tout antye pye bwa pou gratis.
Li fè sa ki tout travay la difisil.
Sa a ki sa Mozilla ak Apple ak lòt moun te fè pou nou.
>> Se avèk JavaScript nou pral kapab kontwole ak chanje ak fè
bagay enteresan yo ki pye bwa, otreman li te ye
kòm yon Dom oswa Dokiman objè ki gen konpòtman egzanplè.
Ki kalite bagay sa yo?
Oke, li sanble ke nan JavaScript, gen nan
lis sa a nan lesiv evènman ki ka pran plas li.
Epi nou pa te reyèlman itilize ki mo depi semèn zewo ak pset
zewo lè nou te pale osijè de grafouyen.
Pifò nan pwobableman ou pa t 'sèvi ak yon evènman nan pwojè Grafouyen ou yo.
Men, ou ta ka sonje senp Marco Polo nan
egzanp, kote nou te gen de sprites, youn nan moun te di, Marco.
Lòt la nan moun lè sa a, sou tande ak tande ke evènman, di konsa, Polo.
Si ou pa, santi yo lib yo tounen gade dèyè ki lwen tounen.
>> Men, sa a se jis di, epi ou ka kalite
dégager soti nan non yo nan sa yo bagay sa yo, JavaScript, li vire soti,
ki pral ban nou yon fason yo koute pou sourit pral desann oswa sourit moute
oswa kle pral desann oswa kle ale monte oswa onselect onsubmit
oswa onresizing yon bagay.
Nan lòt mo, nenpòt ki aksyon fizik ke yon moun ka pran avèk yon navigatè
ke ou fè chak jou, ou ka ekri Kòd pou sa koute pou evènman sa yo
ak Lè sa a fè yon bagay ki apwopriye yo.
>> Pou egzanp, si ou itilize Google Maps, sa k ap pase si ou klike yo epi li deplase
sourit la, tipikman?
Si ou Sur Et faites?
Yeah?
Egzakteman.
Nan kat la, kòmanse pou avanse pou pi.
Se konsa, ou ka sòt de wè sa ki nan sou isit la, sa ki nan lòt bò a.
Ak ki jan Google aplike sa?
Oke, prezimableman, yo ap lè l sèvi avèk yon koup nan sa yo evènman
koute, youn ki di, koute pou sou sourit
down-- Se konsa, lè itilizatè a fizikman pouse trakpad li oswa li oswa sourit l '
desann.
Lè sa a, nou ap chèche pou yon bagay tankou mouvman
oswa kèk lòt evènman ki pèmèt nou pran trennen.
Ak an reyalite, trennen se Menm jan an tou nan sa a dot dot dot lis nan opsyon posib.
>> Se konsa, sa a se pral yo dwe yon pwisan fason yo kòmanse reponn a itilizatè a
menm anvan menm yo li oswa li te aktyèlman klik yon bagay tankou eksplisit soumèt.
Men, nou ap ale nan entwodui yon sijè koup yo ka resevwa gen.
Tranzisyon Men, anvan, se pou yo nan kèk Kòd vrè.
Se konsa, mwen pral ale pi devan epi louvri moute Dom-0,
ki se yon egzanp trè senp isit la ke si mwen rale nan tou senpleman
gen opinyon sa a isit la pou mwen.
Apre sa, mwen pral ale pi devan epi tape nan "David" pou non mwen, epi klike soumèt.
>> Lè sa a,, kwake sòt de chèr, mwen gen sa a èd memwa ki Pops leve ki di,
"hello, David!"
Se konsa, sa a se kalite tankou nou an "hello, mond"
nou te fè yon ti moman ki tounen nan C ak menm nan PHP paske mwen te dynamique
outputted non mwen.
Mwen kapab fè Non yon lòt moun nan isit la.
Mwen te kapab tou senpleman chanje sa a nan, tankou, Hannah, klike sou soumèt.
Ak tout bon, nou menm ti pop-up chanjman yo.
>> Koulye a, pop-ups yo se youn nan la pi karakteristik viktim abi nan entènèt la.
Lè an reyalite, li tounen nan jou pop-up blockers yo
te antre nan lamòd paske ou ta ale nan kèk website--
petèt yon place-- dout ki ta Lè sa a, toudenkou
kòmanse peppering ekran ou ak yon pakèt antye nan pop-ups.
Se konsa, kapasite sa a yo pòp moute fenèt nan devan itilizatè a
pa te patikilyèman ki byen resevwa pa limanite.
Se konsa, Se poutèt sa ou wè sa a anpeche bagay,
ki jis fè sa a tout bagay lèd.
Se konsa, nou ap ale nan bezwen yon pi bon fason yo pouse itilizatè a.
Men, pou kounye a, ki sanble nan travay.
Se konsa, jis entwitif, ki sa sanble yo dwe ap pase isit la?
Mwen ale pi devan epi klike sou soumèt, ak Lè sa a, yon bagay k ap pase, byen klè.
Men, sa ki pa nan k ap pase ki t 'rive semèn pase a nenpòt ki lè mwen klike soumèt?
Ki sa ki pa t 'rive sou ekran an?
Padon?
Recharger.
URL la pa t 'chanje nan tout.
M 'te di sa a te Dom-0, ak mwen se toujou nan Dom-0.
Nòmalman, nou ta jwenn chanje a kèk lòt URL, tankou register.php oswa renmen an.
>> Men, menm lè m 'rejte bagay sa a pa klike OK,
remake ke URL la rete konplètman mete.
Epi, an reyalite, si mwen se yon ti kras ensèten, kite m 'louvri moute Chrome.
Kite m 'louvri moute tab la Network.
Apre sa, remake li nan vid nan moman sa a.
Kite m 'ale pi devan epi ranvwaye Maria.
Gen nan pa gen rezo trafik tou.
Se konsa, gen nan pa gen HTTP.
>> Se konsa, tout bon, si mwen gade nan kòd la sous pou sa a men, kite m 'fèmen fenèt sa a
epi ale nan View Sous.
Enteresan.
Li sanble ke gen nan kèk nouvo Tags, nan mitan yo script.
Se konsa, kite a pran yon gade nan CS50 IDE ekzakteman ki sa m 'te voye nan itilizatè a.
>> Se konsa, isit is-- kite nan konsantre sou HTML a sèlman.
Isit la nan mwatye a anba nan Dom-0.html.
Apre sa, remake ke li nan te resevwa yon tit, yon tag tèt, yon tag kò, yon tag fòm.
Men, sa ki sote soti nan ou kòm diferan, espesyalman si ou te pa janm
ekri nenpòt JavaScript tèt ou.
Kite m 'woulo liv yon ti kras a dwat a isit la.
Mwen te gen yon D ', yon lòt D 'pou soumèt.
Mwen te gen yon ID, ki se kalite nouvo.
Men, nou t 'wè sa a ak CSS.
Ki lòt bagay se definitivman nouvo?
Yeah?
Nice.
>> Tout dwa.
Se konsa, kote li di onsubmit, remake sa ki sanble yo swiv.
Sa a se yon atribi nan HTML nomanklatur.
Valè li yo se sa a fisèl te site isit la.
Lè sa a sanble yon ti kras etranj nan premye gade.
Li pa HTML.
Li pa CSS.
Sa a se, kòm ou ta ka devine, JavaScript.
Se konsa, li sanble ke bati nan sa a paj entènèt se yon fonksyon rele Di.
Apre sa, mwen èksklamasyon ki jis paske li nan yon mo, voye bonjou pou.
Li nan te resevwa yon paren louvri, paren pre, virgules.
Sanble yon fonksyon C, sanble yon fonksyon PHP.
>> Ak tout bon, li k ap pase yo gen yon fonksyon JavaScript.
Lè sa a, m ap retounen fo.
Nou pral tounen vin jwenn ki nan jis yon moman.
Men, kote se defini fonksyon sa a?
Oke, kite m 'woulo liv moute nan tèt la nan dosye a.
E menm si li nan yon liy long, li nan relativman senp.
Kite m 'rale soti isit la ak konsantre sou kat liy sa yo.
>> Se konsa, nan JavaScript, jis tankou PHP, ou jis
di, literalman, pawòl Bondye a "fonksyon," non an nan fonksyon an,
ak Lè sa a parantèz ak nenpòt arguments-- pa gen okenn agiman nan ka sa a.
Apre sa, gen nan pa gen di ki retounen nan JavaScript, jis renmen PHP.
Se konsa, li nan yon ti kras lach pase C. Louvri atèl Curly, fèmen atèl Curly.
Bati nan JavaScript se yon fonksyon- pa yon fonksyon-rekòmande
men yon fonksyon rele alèt ki gen rezon sèl nan lavi
se rale moute ki bèl lèd pouse ke nou te wè yon ti moman de sa.
>> Koulye a, sa a se kalite yon gren.
Ki sa ki k ap pase sou isit la?
Se konsa nou kòmanse mete aksan sou tout bagay isit la.
Sa a agiman an menm nan alèt.
Ak sa ki k ap pase sou?
Sa a jis sanble yon fisèl.
Epi li vire soti, kontrèman ak PHP ak kontrèman ak C, li pa gen pwoblèm nan JavaScript
si ou quotes yon selibatè oubyen quotes doub.
Yo pral ekivalan.
Apre sa, franchman, li nan jis popilè jou sa yo
pou JavaScript pwogramasyon toujou itilize quotes sèl pou kèk rezon.
Se jis bagay la fè.
Men, nou ta ka itilize quotes doub, kòm byen.
>> Se konsa, plis se yon nouvo karaktè.
Men, moun nan nou ki te fè sa a anvan, ki sa plis vle di?
Yeah.
Anchene.
Se konsa, nou te wè sa a nan PHP.
Genyen sèlman dot nan operatè nan PHP ki
pral anchene de strings yo ansanm.
C te yon doulè nan kou a fè sa.
Rapèl soti nan pset sis, ki te yon doulè espesyalman nan kou a,
ou ta gen yo sèvi ak yon bagay tankou strka
apre allocation memwa sou chemine a oswa pil wòch la.
Ou te gen so nan sèrkl jis yo anchene de strings.
Nan JavaScript, li nan super senp.
Jis itilize operatè a plis ant yo.
>> Se konsa, konplèks la-kap bagay sanble ap sa a
paske nan fen fisèl sa a tout antye, mwen jis
anchene sou yon pwen esklamasyon.
Se konsa, si sa ki te eklate moute te "hello, David," "hello, Hannah,"
"hello, Maria," ak pou fè, byen klè ke bagay presegondè nan ant de la
pluses dwe ban m 'aksè nan ki sa?
Ki sa ki nan nan gen pou asire w?
Yeah.
Se konsa, mwen pral pretann isit la nan reponn non yo, dwa?
Se konsa, non yo déja moute nan final la rezilta. Se konsa, sa sa vle di?
Bon, mwen pwopoze pi bonè nan ki foto ki sa yo rele nan Dom
gen sa a eleman rasin espesyal fason moute tèt rele dokiman.
Epi, koulye a, li vire soti, ki k ap pase yo dwe yon varyab mondyal espesyal
nan JavaScript, bati nan ki se yon pakèt antye nan itil fonctionnalités.
Pami fonksyonalite a itil se nan kapasite yo ka resevwa nan nenpòt ki ne pitit.
Moun sa yo ki kare oswa rektang oswa elips yo se jis nœuds nan yon pye bwa, se konsa pale.
>> Se konsa, li sanble ke bati nan JavaScript nan dokiman objè
se yon fonksyon, ki te rekonèt kòm yon metòd, ki nan rele getElementById.
Sentaks la pou rele yon fonksyon nan JavaScript
ki se andedan nan yon objè oswa yon varyab se jis ak notasyon an dot.
E nou wè sa nan C sa sentaks la struct.
Ou wè sa a nan pset sèt, kalite, sòt de, lè n'a wè CS50 :: query.
Kolon an kolon nan PHP se yon lòt fason pou rele yon fonksyon sa a, se
andedan nan kèk objè.
>> Men, pou kounye a nan JavaScript, li nan jis yon dot.
Se konsa, fonksyon sa a, joliman ase, kalite
di ki sa li does-- jwenn eleman pa ID.
Yon eleman se jis yon lòt non pou yon tag oswa ne nan Dom la.
Se konsa, jwenn eleman pa ID "non" vle di sa a men isit la nan HTML m 'yo.
Ak ki baze sou HTML sa a, ki ne oswa sa ki HTML tag mwen
ale nan pwogramasyon gen men lè w rele document.getElementById?
>> Yeah, egzakteman.
Mwen pral jwenn D 'a eleman gen ki gen ID se "Non."
Se konsa, espesyalman, ou kapab panse a fonksyon sa a,
getElementById, kòm yon fason pou bay do yon konsèy ak sa yo ki ne espesifik
nan pye bwa an.
Nou pa t 'trase sa a pye bwa, men li la yon fason
pou trape aksè a ki rektang oswa ki rektang
pa inikman idantifye li atravè ID li yo.
>> Koulye a, poukisa se sa a itil?
Oke, li vire soti ke yon fwa ou te vinn
ki ne, ki rektang ki soti nan foto, ki ne andedan nan li,
nan vire, te gen yon pakèt antye nan properties-- pè kle-valè
oswa done, youn nan ki te rele valè.
Se konsa, literalman, li nan kalite yon gren yo eksplike tout bagay la.
Men, nan fen jounen an, tout bagay sa a fè se ba ou
yon afè ki itilizatè a tape nan nan mòd sa a yerarchize.
Men, mwen pa renmen yon koup la bagay sa yo.
Oswa olye, gen nan kèk kiryozite toujou.
Tout moun nan ki te sanble nan travay.
Poukisa ou panse ke mwen tounen fo apre rele voye bonjou pou?
Sa a sanble yon ti kras lèd, ki Mwen gen de deklarasyon gen
separe pa virgules.
Pran yon devine.
Si m 'retire retounen fo, ki sa ka rive, jis enstenktiv?
Padon, di ankò?
>> Louvri yon pakèt moun sou fenèt yo.
Se konsa, ki kapab petèt yon bagay tankou sa ta rive.
Kisa ankò?
Ta ka soumèt yon demann ki kote?
Nan paj la menm.
Se konsa, an reyalite, sa a, se ki , la pi pre reponn isit la
menm si, kontrèman ak nan tan lontan an, mwen pa te gen
espesifye atribi nan aksyon, ki nòmalman nou dwe fè.
Vire soti gen nan yon defo. Si ou pa presize aksyon,
li a tankou li di quote, unquote oswa non an nan dosye a tèt li,
ki nan ka sa a ta fè tankou Dom-0.html.
Li nan jis kalite dedwi, ou pito enplisit.
>> Se konsa, si mwen pa fè sa, se pou yo remake.
Kite m 'sove sa a.
Apre sa, mwen te retire retounen fo.
Kite m 'ale tounen nan sa a egzanp ak fòs Reload li.
Epi ou ta ka yo te wè m 'sijere sa a sou CS50 Diskite sou yon pakèt moun sou fwa.
Si anyen nan tout tan tout tan aji ak nan fenki navigatè pa nan konpòte menm jan ou atann,
souvan ou pral vle yo kenbe Shift Et puis cliquez Reload.
Ki pral fòse chak dosye Reload epi yo pa itilize kachèt lokal navigatè ou a
oswa kopi se konsa ke kounye a, kite m 'ale pi devan epi louvri moute Enspektè mwen, tab la Network.
Mwen pral klike Prezève Log paske mwen
pa vle li yo efase ranje yo yon fwa mwen jwenn whisked lwen yon lòt kote.
>> Kite m 'ale pi devan isit la ak kalite nan Andi, klike sou soumèt.
Tout dwa.
Ki sanble jan yo espere.
Li di "hello, Andi."
Kite m 'klike sou OK.
Enteresan.
Remake paj an chanje, kwake nan paj orijinal la.
Avi kalite a URL nan chanje.
Li te ajoute yon mak kesyon, ki se nòmalman yon endikatè
ki nou te eseye soumèt yon bagay.
Lè sa a, nan pati anba a, menm plis klèman,
isit la se demann lan HTTP aktyèl, ki te resevwa yon repons nan 200 ki
mennen m 'tounen isit la.
>> Se konsa, sa a se pa sa nou vle fè, dwa?
Paske mwen pa vle Reload paj la tout antye.
Mwen olye pou te vle retounen fo konsa tankou kous kout
konpòtman default navigatè a, ki te, nan kou, yo soumèt paj la.
>> Se konsa, kite a pran yon gade nan yon très pi bon egzanp.
Sa a se vèsyon Dom yon sèl.
Apre sa, remake sa ki annapre yo.
Li nan OK si ou pa grok tout nan liy yo nan kòd.
Men, sa ki se fondamantalman diferan sou aplikasyon sa a?
Mwen pral ladann li konpòte li nan menm, fè sa ki menm bagay la.
-Kisa M 'evidamman fè yon fason diferan?
Yeah?
>> ODYANS: [fèbl].
DAVID Malan: Yeah.
Se konsa, se fonksyon an defini differently-- nan lòt mo, absan nan fòm nan,
'kanpe sou liy 7-- oswa olye, liy 8-- pa
mwen gen atribi nan onsubmit.
Nan egzanp lan anvan yo, mwen te gen sa a.
Lè sa a, mwen literalman te ekri kòd m 'isit la.
Lè sa a, m 'te di retounen fo.
Men, si li pa t 'fwote w fason an mal ankò,
li ta dwe kòmanse tèl degre kòm, jis tankou nan HTML,
lè nou te kòmanse ko-melanje li ak CSS nan atribi style,
li jis te kòmanse jwenn yon ti kras sal oswa santi yon ti kras mal.
>> Menm jan an tou isit la, si ou kòmanse pran HTML,
ak Lè sa a ou otomatikman plok kèk kòd JavaScript
nan mitan an nan yon fisèl te site, li nan pa ale nan dwe pran anpil soutnabl.
Dwa?
Li pa menm evidan nan premye mete kote kòd la JavaScript se.
Se konsa, li ta dwe reyèlman bon kòm yon prensip nan pi bon konsepsyon,
se pou yo kenbe HTML nou an konplètman separe soti nan JavaScript nou an.
>> Se konsa, fè sa, ki sa nou te fè isit la se annapre a
nou tou senpleman itilize HTML pou baliz sèlman.
Se konsa, nan vèsyon youn nan sa a, tout M 'genyen se yon fòm ak yon ID inik.
Lè sa a, desann isit la, mwen pran avantaj a yon karakteristik espesyal nan JavaScript
kijan mwen ka gen sa ki nan rele yon fonksyon anonim.
Se konsa, li vire soti ke si mwen rele document.getElementById nan 'Demo'
sa a, se tankou bay m 'yon konsèy nan ne sa a nan pye bwa mwen, eleman nan fòm,
se konsa pale.
>> Koulye a, mwen jis konnen soti nan konnen yon ti jan nan HTML
kounye a nou ap li te gen li kèk sou entènèt referans, ki yon eleman fòm sipòte
yon pakèt antye nan evènman an listeners-- lòt mo, lis la lesiv nan evènman
koute ke nou te wè yon ti moman de sa.
Mwen konnen soti nan lekti dokiman an ki onsubmit se yon evènman ki valab
koute pou yon eleman fòm.
>> Se konsa, yon fwa mwen konnen ke, li nan san danje pou m 'fè
annapre jwenn nan ki ne soti nan pye bwa a, eleman nan fòm,
ak aksè li yo sa yo rele onsubmit pwopriyete.
Se konsa, dot a jis vle di sa a se yon pwopriyete,
tankou se yon valè espesyal andedan nan li.
Ak sa ki kalite done ou yé plase, aparamman,
onsubmit, ki se efektivman yon varyab andedan
nan ki ne nan pye bwa a?
Li se yon jaden andedan nan struct ki.
Ki sa ki nan kalite la done?
>> Yon fonksyon, yeah.
Se konsa, li sanble ke PHP gen sa a.
E menm si nou pa t 'di ou sou li,
C tou te gen fonksyon endikasyon yo, kapasite yo pase epi bay fonksyon
kòm valè varyab 'tèt yo.
Epi nou pa ap ale regrese tounen nan C.
Men, pou kounye a, li sanble ke sou bò men dwat-ou isit la,
menm si li sanble yon ti kras Funky, sa a vle di, hey navigatè,
ban m 'yon fonksyon.
Mwen pa ale nan menm bezwen deranje bay li yon non paske mwen se literalman
ale nan bay se pou yo rele l ' adrès ki nan fonksyon sa a
imedyatman nan onsubmit.
Nan lòt mo, navigatè, ou pa bezwen konnen sa k ap fonksyon sa a rele.
Ou jis bezwen konnen kote li se nan memwa.
Se konsa, li sifizan jis gen yon siy egal a
epi yo pa bezwen deranje nonmen sa a, tankou foo oswa voye bonjou pou ou nenpòt lòt mo.
Epi, koulye a sa a se jis yon bagay stylistic.
Mwen te kapab avanse pou pi sa a atèl Curly sou the-- sorry-- liy pwochen
tankou nou Anjeneral, nou fè CS50.
Men, nan JavaScript, li nan aktyèlman estilitikman komen
jis kenbe atèl a Curly, nan premye yon sèl, sou sa liy premye.
>> Men, apre sa, gen nan pa gen anyen ki enteresan.
Sa louvri atèl Curly jis demarcates kòmansman an nan fonksyon m 'yo.
Fonksyon an se kounye a ki idantik, eksepte mwen te
enkli fo a retounen andedan nan fonksyon sa a.
Paske li vire out-- epi ou ta sèlman
konnen sa a soti nan lekti documentation-- nan
ke si fonksyon an ke ou bay kap okipe-a onsubmit retounen fo,
navigatè a jis konnen epi li dakò pa yo soumèt fòm lan nan yon sèvè.
Si li retounen vre, li pral soumèt li nan yon sèvè pou rezon nou pral wè
yo itil yo nan jis yon moman.
>> Lè sa a, virgules la apre atèl a Curly gen jis
vle di mwen fè defini fonksyon an.
Ou konnen ki sa yo rele pi vit jan ou tande yon soumèt.
Tout dwa.
Sa a se toujou joui kalite lèd.
Se konsa, sa plis nou kapab fè?
>> Oke, li vire soti lè sa a nan vèsyon de, ki se last-- nan
ak nou pral jis gade nan sa a.
Nan risk pou yo fè li uglier, li vire soti
ke gen nan yon bibliyotèk nan mond lan rele jQuery.
Apre sa, jQuery se yon super popilè bibliyotèk JavaScript
sa a, se tèlman popilè ke pi nenpòt JavaScript li nan pa
estraòdinè pou moun yo konfonn jQuery ak JavaScript.
Poukisa?
JavaScript kont li genyen anpil fason sil pou fè things--
document.getElementById, dadadadadada.
Ou fini gen anpil liy long nan kòd.
>> Se konsa, yon parèy yo te rele Jan rezid, ki aktyèlman ap travay pou yon demaraj
moute jou sa yo, te soti ak sa a bibliyotèk ane
Anons sa pibliye depi ke anpil moun te kontribye rele jQuery ki chanje
sentaks la nan fason ki anba la a.
Apre sa, jis pou ou te wè sa a, paske ou pral toujours
wè sa a si fè yon ki baze sou wèb final pwojè,
sa a ta ka wout la ekivalan nan mete ann aplikasyon ki fonksyon menm lè l sèvi avèk
bibliyotèk espesyal sa a.
>> Koulye a, olye ke toumante l 'apa nan antye li yo,
kite yo jis gade nan kèk modèl.
Sentaks sa a sanble li gen konbyen fonksyon anonim
oswa fonksyon nameless oswa AKA LAMBDA fonksyon?
De, dwa?
Epi ou konnen ke, menm si ou pa super confortable ak sa a,
jis pa lefèt ke li di fonksyon () de fwa.
>> Apre sa, li vire soti ki sa Kòd sa a se doing--
epi n ap gade nan referans sou entènèt, finalman, pou kèk èd ak sa.
Sa a jis vle di ke lè dokiman an se pare,
ale pi devan epi enskri fonksyon ki anba la a
kòm kap okipe-a soumèt pou HTML a eleman ki gen inik lide se Demo.
Lè sa a,, lè sa rive, rele de liy sa yo nan kòd.
Lè sa a se, trajik, yon pi plis sil fason pou li di retounen fo.
Apre sa, nou mansyone sa a jis paske ou pral wè kòd tankou sa a sou entènèt.
Apre sa, li pa gen anyen yo dwe daunted pa.
Men pito, kenbe nan tèt ou ke sa ki nan pral fè komen nan JavaScript
se paradigm sa a.
Se konsa, Se poutèt sa nou montre li pou kounye a.
Tout dwa.
Se konsa, san yo pa rete twò anpil sou ki sentaks,
yo gen nenpòt ki kesyon sou egzanp ide sa yo konsa byen lwen?
Tout dwa.
Se konsa an n itilize sa a pou yon bagay itil.
Fè yon paj entènèt ki jis di hello, sa ak pou se pa tout sa ki enteresan,
pa underwhelm.
Yon sèl sa a pa nan pral yo dwe bèl, men li ki pral fè yon bagay itil.
Kite m 'ale tounen nan anyè m' isit la ak louvri moute, di, fòm-0.html.
>> Se konsa, ta kwè sa a se nevyèm ane a espò anndan kay paj enskripsyon
san yo pa nenpòt CSS oswa nenpòt sans de konsepsyon.
Apre sa, mwen vle ale pi devan epi enskri isit la ak yon modpas.
Apre sa, mwen pral dakò pou al nan kondisyon ki ak kondisyon, epi klike Rejis.
Epi, koulye a sou sit wèb la di, "Ou se anrejistre! (Oke, pa vrèman.) "
Sa sanble tankou li te travay, men kite m 'ale pi devan epi fòse recharger.
>> Se pou m 'di, pa gen okenn, ou pa fè sa bezwen adrès aktyèl imel mwen.
Oswa petèt nou pral jis di lapòs nan la.
Modpas yo pral, tankou, 12345.
Lè sa a,, jis paske mwen se yon moun sòt, kounye a li a 123456789.
Apre sa, mwen pa pwal yo tcheke bwat ou.
>> Hmm.
Tout dwa.
Se konsa, gen nan plizyè opòtinite pou amelyorasyon isit la.
E ou konnen, oswa pral wè nan pset sèt, ki ou ka ekri code--
epi ou pral gen yo ekri kòd nan PHP-- defann
kont sa yo kalite itilizatè erè paske itilizatè a klèman
pa te kolabore.
Apre sa, li oswa li te pa te bay nou tout nan valè ou te vle oswa menm nan fòma a
ke ou te vle yo.
Se konsa, ou pral wè nan pset sèt ki nou te ka sètènman gen kèk
si kondisyon ki di si adrès imel la
se pa yon username@something.edu, nou te kapab jis
di regrèt ak eskize nan itilizatè a anpil, tankou ou ta ka nan pset sèt.
Oswa si yo pa gen tcheke ki bwat postal, vire soti nan PHP, ou ka detekte ke,
tou.
Epi sètènman si modpas yo pa matche ak tankou nan register.php
pou pset sèt, ou kapab detekte sa.
Men, sa a yon doulè nan la kou nan ki kounye a yo mande
nou ale tout wout la nan sèvè a.
Se Itilizatè a enfòme sou erè a.
Ak omwen sof si ou sèvi ak kèk teknik amateur,
kounye a yo gen yo klike sou flèch la tounen.
Pa li ta dwe nice, tankou yon anpil nan sit entènèt jodi a,
si ou te gen plis imedya fidbak, imedyatman?
>> Nan lòt mo, kite m 'ale nan vèsyon yon sèl, ki se ale nan gen okenn bèl pase.
Men, li fè sa yo gen karakteristik sa a.
Malan, 12345, 123456789, pa ale nan tcheke bwat la, Rejis.
Modpas pa matche ak.
Se konsa, menm menm si sa a pop-up se ugly-- nou ka ranplase sa a evantyèlman
ak yon bagay tankou demaraj, ki ou pral wè nan pset sèt
se yon library-- trè popilè m 'te fè detekte ke modpas yo pa matche ak.
Tout dwa.
Oke, kite m 'repare ke kòm itilizatè a.
Kite m 'ale pi devan epi di 12345, 12345.
Toujou pa tcheke akò a.
Ou dwe dakò ak nan tèm ak kondisyon.
Se konsa, poukisa?
>> Si nou te deja poze ke gen nan yon fason,
e nou te mande ou nan pset sèt yo detekte erè
kondisyon tankou sa a sèvè-bò, poukisa m 'bezwen rete
deranje tou fè sa nan JavaScript?
Ki sa ki nan yon diskisyon an favè ajoute sa
w ap sou yo wè kòm some-- gen nan plis konpleksite.
>> Petèt pa gen okenn tèt.
Ki sa ki li te kapab fè?
ODYANS: [fèbl].
DAVID Malan: Oh, ki enteresan.
Èksplwatasyon potansyèl yo.
Se konsa, asire w, si ou pa ap manyen inègza opinyon itilizatè ki gwo,
petèt li nan tout pi bon an si li pa menm rive nan sèvè ou.
Mwen ta pouse tounen gen ak di, ou ta dwe pwobableman
ranje tou de nan pwoblèm sa yo.
Men, sa a san patipri.
Kisa ankò?
>> ODYANS: [fèbl].
>> DAVID Malan: Yeah.
Kòd sa a, menm jan nou te di anvan, se entèprete sou kliyan-kòt la.
Li pa anmède sèvè a, ki vle di li pa fè sa
impact chaj sèvè a oswa kapasite.
Epi, koulye a, pou m 'ti kras fin vye granmoun, sa a pa gen okenn efè siyifikatif
paske mwen gen yon sèl itilizatè kounye a.
>> Men, si w ap nenpòt sit nan gwosè desan,
espesyalman pi gwo a, tankou Facebook, plis la ou kapab kenbe moun nan
a sèvè ou pi bon an paske yon sèvè, nan kou,
sèlman gen yon kantite lajan fini nan RAM, yon PO fini nan jigaèrts,
yon PO fini de bagay sa yo li ka fè pou chak inite de tan.
Se konsa, si gen plis moun nan mond lan frape sèvè ou,
aksidantèlman antre mal, jis kòm byen si ou
kapab kenbe ki chay la sèvè ou.
Plus, espesyalman sou yon mobil device-- si ou te janm
ale nan my.harvard oswa Netid Yale a oswa renmen an,
gen nan sa a latansi a ak yon anpil nan sit tankou sa kijan li pran,
tankou, yon modi dezyèm oswa de pafwa.
Lè sa a,, Bondye mwen, si ou mistype, Lè sa a, ou gen frape retounen lakay yo epi refè li.
Se konsa, gen nan latansi, espesyalman sou pi dousman koneksyon rezo-a.
Men, JavaScript, paske li kouri sou kliyan an
epi yo pa bezwen ale retounen ak lide atravè yon entènèt ki kapab ralanti
koneksyon, ou kapab jwenn prèske Enstantane fidbak.
>> Se konsa, kite pou yo gade nan sa a.
Kite m 'louvri moute fòm-0 ak gade nan HTML a isit la.
Li kite yo jis wè sa k ap pase sou.
Sa a se yon fòm ki gen aksyon se register.php.
Mwen jis lè l sèvi avèk jwenn se konsa ke mwen te kapab wè URL la.
Men, pou modpas, nou ta siman vle chanje sa a yo pati nan reyalite.
Isit la nan yon jaden D 'nan tèks kalite.
Isit la nan yon lòt D ' jaden nan modpas kalite.
Isit la se, si ou pa janm te wè, yon D 'nan kalite toulède kaz.
>> Men, gen nan pa gen JavaScript isit la tou.
Sa a se jis HTML ki ale nan register.php.
Men, nan vèsyon youn, kote mwen te kòmanse jwenn moun pop-ups,
kite a wè sa ki aktyèlman k ap pase isit la.
Nan vèsyon yon sèl, ki sa Mwen pral see-- mwen
te panse mwen te kapab nòmal ase ak ase mo, men mwen kouri soti.
>> Nan vèsyon yonn-gen nou ale.
Nan vèsyon yon sèl, remake annapre a epi se pa aplikasyon an pi bon,
men li la premye fwa mwen.
Remake anba a nan fòm, mwen gen yon tag script.
Ak yon tag script vle di, hey, navigatè, isit la
vini kèk kòd nan, tipikman, JavaScript.
Epi, koulye a, remake sa m ap fè a.
Sou mwen kapab apèn line-- li l-- liy 32, li di,
var form-- konsa ban m ' yon varyab rele fòm.
Lè sa a, jwenn document.getElementId nan "enskripsyon an."
Kisa sa ye?
Oke, kite m 'remonte moute isit la.
Apre sa, avi, ah, mwen te bay eleman nan fòm yon lide abitrè men deskriptif
fè enskripsyon an.
Se konsa, sa ban m 'yon varyab ki pèmèt m 'gen tan pwan ki ne,
ki rektang nan pye bwa a yo rele fòm.
vle di form.onsubmit, hey navigatè, enskri yon koute evènman
sou fòm sa a.
Nan lòt mo, lè fòm sa a se soumèt, egzekite Kòd sa a.
Li pa bezwen yon non paske poukisa ou bezwen konnen non an?
Ou jis bezwen konnen sa yo dwe egzekite, èrgo
li nan yon fonksyon anonim oswa LAMBDA.
Epi sa fonksyon se tout nan liy sa yo isit la.
Koulye a, yo dwe onèt, menm si ou pa ta ka te janm ekri JavaScript
anvan, li nan jis C ak PHP lojik.
Se konsa, si form.email.value == "" - Se konsa, si jaden an imel se vid,
rele nan itilizatè a ak "Ou dwe bay adrès imel ou. "
Lòt Bagay si form.password.value se vid rele nan itilizatè a,
"Ou dwe bay modpas ou."
>> Plis enteresan lojikman, si form.password.value pa fè sa
egal form.confirmation.value-- kote konfimasyon t 'soti?
Kite m 'remonte.
Oke, mwen te rele D 'sa a jaden isit la modpas.
Apre sa, mwen rele yon sèl sa a isit la konfimasyon.
Mwen te kapab rele l ' modpas de oswa nenpòt lòt bagay.
Mwen jis tcheke lojikman ke de sa yo, se menm bagay la.
Else-- li vire soti sa a se Mesye Boole again-- se yon valè Boolean, ti bwat la chèk la.
Se konsa, si mwen vle di, esklamasyon point-- si se pa form.agreement.checked,
rele nan itilizatè a kòm byen.
>> Se konsa, sentaks sa a ou pral wè se trè komen nan JavaScript,
ki kote ou gen notasyon sa a pwentiye an.
Ou kòmanse ak yon objè isit la.
Ou plonje nan pi fon nan yon yon pwopriyete tankou modpas.
Lè sa a, ou jwenn nan valè aktyèl li yo.
Epi ankò, isit la se D 'a.
Isit la se modpas la non.
Ak valè li yo se tou sa a te imen aktyèlman tape nan.
>> Se konsa, nan tout moun sa yo ka, mwen tounen tounen fo.
Men, si se pa, mwen retounen vre.
Se konsa, kounye a nou wè yon irezistib pou sèvi ak lè
ou ta retounen fo sispann sa a nan itilizatè fè
, epi fè l 'oswa li chwazi ankò oswa tape ankò.
Sinon, nou retounen vre.
>> Se pou m 'entwodui yon sèl lòt Variant nan sa a jis
tout pitit pitit kèk konpreyansyon ladan l '.
Oke, nan vèsyon 2 nan sa a, fòm-2-- Mwen pral fè l 'ak yon vag nan yon men.
Sa a se, pou moun kirye, vèsyon an jQuery,
moun nan nou ki ta ka vle travayèz nan ki bibliyotèk patikilye.
Men, kite a start-- ak nenpòt kesyon?
Kite m 'pran yon poz pou moman sa paske sa ki te vit ak yon anpil.
>> Men, bagay la bèl isit la se ke tout nan kòd la se bèl anpil menm bagay la.
Bagay nan nouvo se ki sa ki Dom a?
Ki sa ki rektang sa yo?
Ki sa ki nœuds sa yo?
Ki sa ki nan yon fonksyon anonim?
Ki sa ki nan yon kap okipe-evènman?
Men, Erezman, pi fò nan ki se jis sèk plen soti nan, di, semèn zewo.
Tout dwa.
Se konsa, yon bagay yon ti kras plis enteresan?
Oke, premye nan tout, kite m 'ale pi devan epi louvri moute Google Maps.
Apre sa, ou pral avi ke pou yon moman, sou dezyèm lan fann,
remake sa ki pase lè Mwen klike vit ase.
Apre sa, koneksyon sa a nan Harvard se konsa vit ke ou pa reyèlman avi li.
Men, sa ou kalite sòt de wè si mwen Sur Et faites reyèlman vit?
Moun sa yo ki nan nou ap gade sou entènèt, si ou ralanti sa a nan vitès 0.5x,
ou ka wè sa a pi byen.
>> Sa ki te pase jis anvan m 'klike ak trennen?
Kite m 'eseye isit lan-- kite m' fè yon lòt bagay, tankou 90210.
Ann al byen lwen yo.
Sa ki te reyèlman vit, tou.
Kouman sou Disney World?
Gen nou ale.
OK.
Ki sa ou te wè pou yon dezyèm fann?
Jis, tankou, kare, dwa?
Placeholders pou mozayik?
>> Oke, sa k ap pase sou isit la?
Google Maps se yon egzanp bèl nan teknoloji sa a ki nan rele Ajax.
Lè sa a se kote nou pral kòmanse itilize JavaScript a nan yon patikilyèman
Hatian fason.
Retounen nan jou a, te gen sit entènèt sa a yo rele MapQuest.
Apre sa, mwen ta dwe te pran yon D nan sa a soti nan ane 1990 yo,
kote si ou te vle gade moute isit la sou kat jeyografik la,
ou ta literalman klike yon flèch moute nan tèt la ki te montre ou
yon kare diferan nan kat la.
Si ou te vle fè bò gòch, ou klike yon flèch ki te montre ou
yon kare diferan nan kat la.
Se konsa, kèk sit toujou fè sa jodi a.
Men, menm MapQuest te vinn pi bon, tankou Google Maps.
>> Olye de sa, sa ki nan pi bon sa yo jou se sit ki itilize Ajax.
AJAX-- ki te rekonèt kòm Asynchrone JavaScript ak XML,
ki se jis yon fason anpenpan nan di yon teknoloji oswa teknik ki
pèmèt yon navigatè lè l sèvi avèk JavaScript fè demann HTTP adisyonèl
apre yo Paj la te chaje.
Se konsa, sa sa vle di?
Oke, li ta kalite a anmèdan nan Gmail
si chak fwa ou te vle tcheke mail ou,
ou te literalman frape kontwòl-R oswa Kòmandman-R oswa klike sou bouton an Reload
ak paj la reprize antye ta recharger.
Dwa?
Li ta flash blan pwobableman pou dezyèm fwa.
Ou ta renmen wè ba a pwogrè estipid.
Epi jis yo wè si ou gen nouvo mail, paj wèb la antye ak URL la
w ap nan ta gen yo recharger.
>> Men, sa a pa sa k ap pase nan Gmail.
Dwa?
Lè ou jwenn yon nouvo imel nan Gmail, sa k ap pase sou ekran an?
Li jis montre moute, dwa?
Li jis maji parèt kòm yon nouvo ranje nan tablo a.
Ki aktyèlman enplike nan yon desan kantite lajan pou konpleksite.
An reyalite, si ou panse sou pye bwa sa a, ki menm si se yon yon sèl ki senp isit la,
Gmail-- ak mwen ta gen gade a kòd a yo dwe sure--
pwobableman gen yon tab HTML oswa petèt yon lis unordered ke li rann
chak nan inboxes Imèl ou kòm.
>> Se konsa, si ou imajine sa a gen se yon pye bwa nan memwa lè w ap
lè l sèvi avèk Gmail ki sanble kalite sòt de tankou sa a, lè Google reyalize, Ooh,
ou gen yon nouvo imel, li pa fè sa vle rebati pyebwa a tout antye.
Olye de sa, li vle jwenn ne a nan pye bwa a ki reprezante bwat resepsyon ou
ak jis insert yon nouvo ne.
>> Se konsa, trè menm jan ak pset senk, kote ou te gen insert nœuds nan yon tab regle,
Menm jan an tou fè Google, via JavaScript kòd ki li te ekri nan Liv la
Traverse pye bwa sa a, konnen ki kote se ke pati bwat resepsyon nan fennèt la,
ak Lè sa a insert yon nouvo ranje.
Ak yon nouvo ranje jis vle di yon sèl oswa plis nœuds nouvo nan yon pye bwa.
>> Se konsa, Ajax se teknik sa a ki pèmèt pou egzakteman sa.
Yon fwa ou te te vizite yon URL, sepandan fou lontan li ye,
epi yon fwa paj lan gen te chaje, ou ka toujou
gen tan pwan plis done ki sòti nan la internet-- si li nan
yon imèl oswa yon mozayik nan yon map-- gen tan pwan li dèyè sèn nan
ak Lè sa a insert l 'nan paj la se konsa ke moun nan pa fè sa vrèman
oblije rete tann pou li.
>> Facebook mesaje travay menm jan an.
Nenpòt kantite lòt websites-- oh, aktyèlman, menm sa a.
Mwen vle di, sa a se, franchman, kalite yon anmèdan prezante jou sa yo.
Si m 'kòmanse pou chèche cats-- sa a se kalite yon eksperyans itilizatè efreyan ankò.
Li jis kòmanse chèche pou mwen.
Oke ki sa ki li ap fè?
URL la pa te reyèlman chanje depi mwen te kòmanse sezisman.
Men, sa ki k ap pase nan tout nan wire-- OK, hmm enteresan.
Sa k ap pase nan tout nan fil isit la jis vin weirder.
>> OK.
Se pou m 'ale pi devan epi enspekte eleman epi ale nan tab la Rezo
epi eseye fè sa-a teknik ak mwens sou chat.
Jan nou konnen mwen tape, literalman, chat and-- sa k ap pase
per-- Mwen pa pwal klike sa.
Tout dwa.
Se konsa, desann isit la, sa k ap pase chak fwa mwen tape yon karaktè, aparamman?
Tankou, ki ba nivo?
Ki sa ki pase ak chak nan sa yo karaktè mwen sezisman nan klavye mwen an?
Yeah?
ODYANS: [fèbl].
>> DAVID Malan: Egzakteman.
Chak nan karaktè sa yo se ale nan Google, youn nan yon tan.
Yo bati yon fisèl sou sèvè yo ki reprezante
tout bagay mwen te tape nan konsa byen lwen.
Apre sa, chak fwa mwen tape yon lòt karaktè, yo
itilize sòs sekrè yo nan yon rechèch algorithm ak figi soti,
li vle di paj sa a chat oswa paj sa a chat oswa tankou an?
Se konsa, nan kèk sans, li bay m 'ak yon pi bon eksperyans nan ke mwen pa fè sa menm
bezwen ranpli te panse m 'yo.
Ak tout bon, li nan yon itil bagay, otokonple an jeneral.
Si algoritm yo se moun ki bon ase epi si fouy m ', se evidan ase,
Mwen pa gen tape pawòl Bondye a tout antye.
Yo ap ale nan di m 'sa li se mwen aktyèlman pou chèche.
Se konsa, sa Google rele enstantane rechèch se jis lè l sèvi avèk Ajax,
lè l sèvi avèk kòd ki pèmèt yo mande plis kontni via yon navigatè entènèt
dèyè sèn nan lè l sèvi avèk sa a nouvo lang, JavaScript.
Se konsa, nou gen yon minit koup kite.
Ak kite m 'rele moute zanmi m' Colton moute sou sèn nan,
depi li te sanble patikilyèman plezi dènye fwa
prezante yon teknoloji ke kèk nan nou
yo te eksprime yon enterè nan pou pwojè final la.
Nou te panse ke li ta dwe plezi yo pote moute yon volontè, menm si, jodi a
montre w yon adisyon a sa a ki pèmèt you-- yeah,
Mwen te wè sa a men premye.
Vini non sou yo.
Trè byen fè.
Bon travay.
Mwen pral pwojè sa a sou ekran an nan jis yon moman.
Ki sa ki nan non ou pou tout moun?
>> EFA: Mwen EFA.
>> DAVID Malan: Etha?
>> EFA: EFA.
>> DAVID Malan: EFA?
>> EFA: Yeah.
>> DAVID Malan: Nice yo wè ou.
Tout dwa.
Kite m 'jwenn sa a pare.
Vini non sou sou nan an mitan ak Colton isit la.
Ki sa ki Colton gen nan men l ' jodi a se yon kontwòl remote.
Se konsa, olye ke sèlman kanpe la nan yon mond ki genyen twa dimansyon kap alantou
kòm Colton te fè, kounye a EFA kapab aktyèlman mache nan pa ale leve,
desann, agoch, e yo gen dwa tankou yon Nintendo oswa Xbox kontwolè.
EFA: mwen pral tonbe sèn nan.
DAVID Malan: mwen vle kanpe apeprè sou isit la.
Men sa se yon risk.
OK.
Se konsa, ale pi devan epi mete sa ki sou.
Kite m 'ale pi devan epi chanje nan ekran an isit la.
Kite m 'bese limyè yo.
Apre sa, Colton, kite m ' vini kanpe kap vini jwenn ou.
>> Ou vle yo eksplike isit la ak MIC la sa n ap fè?
La a ou ale.
>> COLTON: Asire w.
Se konsa, kounye a nou ap loading moute Oculus a,
Mwen devine operating-- pa opere sistèm, men pwogram nan prensipal yo, ki kote
ou kapab jwenn aksè tout jwèt yo ak apps yo ki nan bibliyotèk ou.
Se konsa, kounye a, li ta dwe di tiyo touchpad a yo kòmanse.
Touchpad k ap pase yo dwe sou nan dwat bò nan headset la.
Se konsa, ale pi devan epi tap--
EFA: Oh, moun.
DAVID Malan: Yeah, gen ou ale.
Bon jan kalite a EFA se wè se pi wo bon jan kalite.
Sa a se jis Wi-Fi a isit la.
COLTON: Se konsa, sa w ap ale nan vle fè
se gade nan direksyon pou tèt la dwat Bondye ki gen ekran an.
Oui, ke jwèt sou bò dwat la trè tèt.
Lè sa a, lè w ap chwazi li, tiyo touchpad a ankò.
Mwen panse ke Dreadhalls li yo.
Lè sa a, isit la se a-- isit la, se pou m 'kenbe linèt ou pou ou.
>> Se konsa, mwen jis te ba l 'yon kontwolè.
Se konsa, koulye a, li ka kontwole jwèt lan.
Li ka deplase nan ak lòt bagay tankou sa.
Se konsa, ale pi devan epi gade moute nan tèt la.
Ou dwe wè Nouvo jwèt.
Se konsa, ale pi devan epi ou ka fè sa.
Koulye a, ou ta dwe kapab kontwole tèt ou ak kontwolè a,
kòm byen, le pli vit ke jwèt la charj moute isit la.
Sa a ta kapab yon ti jan pè.
>> EFA: Koulye a, ou fè m 'konnen.
OK.
>> COLTON: Tout dwat.
Se konsa, konfime ke ou kapab deplase alantou.
OK.
Ou ka deplase alantou.
Pafè.
Se konsa, si ou gade desann, ou gen yon kat jeyografik.
Map montre ou kote ou ye a.
Ou ka gade toutotou sal la.
Ou ka konplètman vire alantou.
Yeah, egzakteman.
Vire alantou.
>> Se konsa, gade sou bò goch ou yo.
Mwen panse ke gen nan yon bagay ou ka ranmase sou yon barik nan sal la.
>> EFA: Kouman pou mwen jwenn la kat jeyografik soti nan fason an?
COLTON: Gade yo.
Jis gade yo.
Tout dwa.
Gen ou ale.
Koulye a, ale pi devan epi jis vire alantou.
Se konsa, gade pi lwen sou bò goch ou yo.
Kenbe k ap deplase kite.
Kenbe kap kite.
Kontinye.
Yeah.
>> EFA: Oh, ki fason.
>> COLTON: Yeah.
Mache nan direksyon pou l 'ak kontwolè a.
Gen ou ale.
Koulye a, li ta dwe di chwazi li.
Gen ou ale.
Chwazi li.
Tout dwa.
Koulye a, se pou yo jwenn soti nan sal sa a.
Ale pi devan epi mache ale nan ki pòt.
Se konsa, w ap ale nan hold-- li di kenbe bouton an fòse li louvri.
Se konsa, ale pi devan epi kenbe bouton an.
Oui, fòse li louvri.
Tout dwa.
Bon travay.
Koulye a, nou ap mache soti nan chanm lan.
Se konsa, mwen pral kite rès la moute pou ou ak pou wè sa ou jwenn deyò.
EFA: Mwen pa pwal nan sal la fè nwa.
Oh, rete tann.
Koulye a, mwen gen yo ale desann sal la fè nwa?
OK, mwen pral tounen [fèbl].
COLTON: Tout dwat.
Gen kèk atik plis nan ranmase.
Sanble kèk pyès monnen.
Sa se yon chwazi fèmen.
Se konsa, si ou jwenn yon fèmen pòt, ou ka itilize sa.
Èske ou pè?
>> EFA: Pa ankò.
COLTON: OK.
>> Pretend-- yeah.
Jis pretann w ap aktyèlman kanpe la.
Men, si ou vire around-- ou te gen jwenn itilize li.
Men, li fè sans.
DAVID Malan: Epi pandan ke y ap kontinye EFA jwe, depi nou te kapab fè sa tout jounen,
nou kapab tout pwent-zòtèy soti isit la.
Men, nou fè gen de lòt pè, si ou ta renmen vini ak jwe.
Sinon, nou pral wè ou pwochen nan Mèkredi.
Mèsi poutèt ou nan volontè nou an jodi a.
[Aplodisman]
>> [MIZIK - "Seinfeld Tèm"]
Oratè 1: Oke, mwen se mete yon nouvo PL mòn sou.
Mwen jis chanje OLPF-- nan
>> Oratè 2: Se konsa, sa egzakteman ou ap fè?
>> Oratè 1: Oke, chak youn nan these-- isit la, mwen pral montre w yon sèl sa a nan isit la.
Ou ka wè li dwa isit la.
>> Oratè 3: Mwen panse ke mwen se bon ak sa yo.
Ou vle kèk plis?
>> Oratè 4: Non, mwen se bon. [Fèbl].
>> Oratè 3: Non, [fèbl].
Gen kèk.
Oratè 1: Diferan koulè.
Oratè 2: OK.
Oratè 1: Se konsa, finalman sa li fè se li ajiste koulè a ​​de-