>> Rregull.
Pra, JavaScript.
Pothuajse të gjithë në këtë dhomë ndoshta ka një shkallë
e rehati me të nëse kjo ishte mënyrë mbrapa kur në SC50
ose ajo është personale Projektet web apo edhe
në qoftë se keni kryer një grimë të saj me ky projekt kaluara bazë PHP,
por për më pjesë, shumë prej jush,
edhe në qoftë se ju keni disa rehati
me JavaScript ndoshta nuk janë marrë
për të dhënë si Punimet gjuhësore dhe atë që shkon
në nën kapuç dhe ajo që ne do të përpiqemi
të bëni sot është zhvishem mbrapa disa shtresa teknike
e asaj JavaScript është, se si ajo ndryshon nga një gjuhë
si PHP, si mund të jetë përdoret jo vetëm anën e klientit
por edhe anë server dhe pastaj të përqëndrohet shumë në mënyrë specifike
në këtë kuadër, nuk ka njoftim JS e cila është në thelb një kohë e drejtuar,
një program me të cilin ju mund të ekzekutojë kodin JavaScript,
anë server dhe është duke u bërë lloj gjithnjë e më popullore
e mbi të njëjtin shtat ky Ditët e ndoshta Ruby dhe PHP
dhe Python dhe ju do të shihni
se ajo ka disa mjaft të Karakteristika të fuqishme me anë të disa
e ndërtuar në gjuhën ndërton.
Por së pari, disa prej të lehtë gjëra vetëm për të ju kujtoj
se si punon kjo gjuhë dhe në qoftë se ju keni probleme duke parë ndonjë
i kësaj, vetëm britme jashtë dhe ne do të rregullojë.
Pra, e si në PHP ka asnjë nocion i një funksioni kryesor,
ju vetëm të filloni të shkruani kodin
dhe ju mund të për këtë interpretojnë atë lart poshtë.
Në kontekstin e një shfletues
ose në anën diçka server ne do të shohim disa shembuj
në një grimë.
Kushtet, syntactically ekuivalente te PHP si C,
C + + dhe disa gjuhë të tjera kështu që vetëm të ju jap një kuptim
e se si ne mund të strukturojnë atë,
ka vetëm një kanonik kusht.
Shprehjet Boolean, saktë të njëjtën syntactically si ju kam parë
në ato të njëjtë të tjera gjuhë, si për oring
dhe duke i dhënë fund për gjërat së bashku.
JavaScript është çelsin, bëjë shumë si PHP dhe-tjetrit
dhe ju nuk jeni të kufizuar, si në C të primitives integrale
si karaktere dhe ints mund të vërtetë bëjnë lloje të tjera të vlerave.
Unazore. Pra, kjo është të njëjtë
dhe ndoshta një duzinë gjuhë, ndërsa sythe, bëni ndërsa sythe
dhe pastaj ky mashtrim këtu.
Pra, kjo është lloj i i njohur si numërimit të shpejtë
dhe kjo është një mënyrë shumë të zgjuar e ashtu si në PHP bërë
për çdo FU si bar ju mund të në mënyrë të ngjashme,
në një objekt JavaScript, ku objekti është emri
e ndryshueshme këtu, të themi, i var në objekt dhe në çdo ripërsëritje
i këtij lak, i është do të jetë një
nga çelësat nga ai objekt.
Pra, nëse ju keni një objekt për një student, dhe një student ka një ID
dhe një emër dhe një shtëpi, iteratively unë do të marrë
të vlerës së identifikimit dhe emrin dhe shtëpi dhe ju mund të për këtë indeks
në objekt sikur ajo e një grup duke përdorur kllapa katrore
simbol për të marrë vlerën i ID kyçe ose emrin e
ose shtëpi, dhe kështu me radhë.
Dhe në kundërshtim me të përbashkët supozim, JavaScript objekteve,
prona nuk janë të domosdoshmërisht të garantuara të jenë
në të njëjtën mënyrë, kjo është edhe e vërtetë për PHP kështu që nuk do të marrë
se gjërat do të qëndrojë në të njëjtën mënyrë
që ju vënë ato kyç palë të tjera me vlerë në një objekt.
Si rreth vargjeve?
Ka disa mënyra për të shkruar atë syntactically
por kjo është ndoshta më e katror zakonshme tani vetëm duke përdorur
simbol kllapa.
Pra, kjo është një variabël të telefononi numrave që përmbajnë rrjet
nga gjashtë numrave të plotë atje, këtu është një varg i thjeshtë
dhe vini re çfarë është e munguar nga këta shembuj,
çfarë është JavaScript me sa duket mungon.
Po. Pra, nuk ka asnjë nocion i shtypur, me siguri nuk
në këtë kontekst këtu, por kjo është me të vërtetë një varg.
Pra, JavaScript ka lloje të dhe se ishte me të vërtetë një grup
e cila është në vetvete një lloj dhe secili prej elementeve
në atë grup ishin të tipit Numri i quan ato si JavaScript.
Pra, kjo është një shtypur lirshëm Gjuha dhe ne do të shohim
se si të aktivizoni Java PHP ka një operator identiteti
dhe mekanizma të tjera për në të vërtetë duke kontrolluar se çfarë llojin
e disa variabël është si për error checking
dhe për aplikacionet e tjera.
Dhe këtu është një objekt mostër përmban vetëm një ID dhe një emër.
Dhe tani, vini re se ne jemi duke përdorur simbol kaçurrel kllapa,
vulë dhe e bardhë hapësirë ​​është lloj i pakuptimtë
dhe kjo deklaron një ndryshueshme emri i të cilit është Rob
dhe ID cilit eshte 1 dhe Data lloj është këtu numri ynë
dhe string respektivisht.
Dhe atëherë kjo është diçka pak më të ndryshme
në qoftë se ju keni bërë ndonjëherë ndonjë gjë me Ajax këto ditë?
Ju ndoshta e përdorur një objekt si ky
por ajo që vlen të përmendet këtu?
Çfarë është syntactically kurrë aq të ndryshme, vetëm disa
i gjërave në mes këtë shembull e cila është pa dyshim më i vogël
dhe ky shembull më të mëdha.
Pra, së pari në laik afat, çfarë është kjo?
Cili është lloji i Stafi do të thoni?
OK, kjo është një grup, kjo është një koleksion të çfarë?
Objektet >>.
>> OK, kjo është një koleksion të objekteve.
Dhe tani, të përqëndrohet në vetëm një - çdo një prej këtyre objekteve,
çfarë është e ndryshme mes kësaj dhe kjo?
>> Çelësat janë vargjet.
Po >>. Pra, çelësat janë vargjet,
dhe çelësat janë në të vërtetë vargjet në të dyja rastet
dhe kjo është lloj i një idiot
në hartimin e opinionit tim historik Vendimi sa herë që ju jeni duke përdorur
JSON, JavaScript Simbol objekt,
cila është në thelb një format transporti
për dërgimin e të dhënave zakonisht të gjithë rrjetin
në mes të klientit dhe serverit, ju duhet të mbani mend
se kjo nuk është në të vërtetë JSON vlefshme dhe kjo është një
nga këto FYIs nëse nuk ndonjëherë zhurmë kokën tuaj kundër murit
për disa minuta për jo të mirë arsye, nuk është e vlefshme JSON
sepse çelësat janë nuk cituar në të vërtetë.
JSON kërkon idiotically që çelësat të cituar jo vetëm,
por që ata të jenë cituar dy herë, Kuotat e vetme nuk mjaftojnë.
Pra, gjë e trashë pak dhe më i një fakti fun
për qëllime të sotme, por kjo shumë do të jetë e vlefshme JavaScript
kjo nuk është vetëm - bisedoj nuk është e vërtetë.
Dakord.
Pra, ne do të shohim shumë më shumë se.
Dakord.
Pra, kjo është JavaScript syntactically ndoshta shumë e
njohur, ndonjë nga ju të cilët kanë kurrë nuk e përdorur JavaScript më parë
kjo nuk është një hap i madh nga PHP ose më ndonjë gjuhë procedurale
që ju mund të keni përdorur.
Pra, sot ne do të përqëndrohet në aspektet interesante
i JavaScript veçanërisht në kontekstin e asnjë JS
por jo vetëm për shkak se deri tani ju keni ndoshta,
nëse keni përdorur Javascript, përdorur atë brenda një shfletues.
Pra, nuk ka JS është një mjedis pastaj në pak do
që të na lejojë të hyni në JavaScript klient Kodi -
server side por së pari, le të marrin një vështrim
në diçka që është një pak më shumë anën e klientit.
Pra, unë kam shkuar në dhe kjo është të lidhura në faqen e internetit kurse,
në qoftë se ju doni të luajnë së bashku, ka dy subdirectories
në Zip sotëm të quajtur studs burimi zip në faqen e internetit
dhe këto janë vetëm Disa shembuj reminiscing
të gjërave që ju mund të keni parë para dhe unë lloj i ndërtuar ato
nga më e thjeshtë për pak më të komplikuar të vë në lojë
disa nga karakteristikat i JavaScript.
Pra, le të shkojnë përpara dhe të marrë shikoni për një shembull në këtë.
Pra, fatkeqësisht tag blink ishte vrarë jashtë disa vjet më parë
si mënyrë e kanë marrë prettier dhe prettier
dhe tag blink ishte fjalë për fjalë kllapa e hapur injoroj kllapë të mbyllur
dhe kjo lloj nuk më të gjatë me ne.
Por, ne ende mund të ringjallë kjo ideja e një tag nga vetëm lloji
e të menduarit në lidhje me të logjikisht, si do ju shkoj
për të bërë diçka si kjo injoroj intuitive?
Duke supozuar që ju dini pak bit e JavaScript dhe CSS ose
në këtë pikë, është e OK, nëse ju nuk e bëni.
>> Cakto një kohë jashtë dhe të fshehin ajo pastaj pas unë do të tag atë
jashtë dhe të tregojnë atë përsëri.
>> Po, të përsosur.
Kjo është lloj i programimit 101,
si do të arrihet një Efekti vizual si kjo?
E pra, ju disi duhet të tregoni diçka
dhe pastaj fshehin diçka, show diçka, fshehin diçka
dhe si Jonathan propozon duke përdorur një lloj kohe jashtë,
një lloj orari ju mund të bëni kjo mënyrë të përsëritur pa nevojë
për të përdorur një lak ose diçka të tillë.
Pra, më lejoni të shkoj në të pulsimit-0.html
dhe më lejoni të tkurret font pak
në mënyrë që më shumë i përshtatet kësaj.
Dhe le të marrin një vështrim se çfarë po ndodh këtu.
Pra, para së gjithash, vini re se trupi
i kësaj faqe është super thjeshtë, brenda trupit
i faqes është vetëm një div.
Unë e kam dhënë në mënyrë arbitrare një ID i përshëndetjes
dhe që mund të jetë çdo gjë aq kohë sa është e veçantë
dhe pastaj unë vetëm duhet disa tekst i thjeshtë, përshëndetje botë.
Pra, nëse unë tani lëviz lart, vini re disa styling me gëzof.
Kështu që, unë them, të mprehtë përshëndetje, e cila siç e dini
në CSS thjesht do të thotë në mënyrë unike identifikojnë elementin
me një ide e përshëndetje,
font size është duke shkuar në mënyrë arbitrare të jetë kjo, diferencë dhe align text.
Pra, jointeresant Detajet estetike
të qendrës afërsisht tekstin.
Pra, pjesa interesante është në shkrimin tag deri këtu
që unë të ndodhë për të vënë brenda e kokës së faqes.
Pra, we'll - ju mund të bëni këtë në çdo disa mënyra
dhe ne do të shohim disa iterations e këtij programi të njëjtë
por le të fillojë nga lartë.
Pra, unë kam deklaruar një funksion të quajtur blink
dhe me sa duket ai përdor këtë ndërtuar në metodën DOM quajtur
getElementById e cila është ndoshta një prej metodave më fuqishme
që ju të merrni nga kutia me JavaScript në kërkim të
"Përshëndetje" nuk ka për të Kuotat e dyfishtë të jetë si ajo ishte
në HTML është ose është e mirë për aq kohë
si ju jeni stilistikisht këto ditë unë guxojnë në përputhje them
shumë njerëz përdorin Java, Kuotat e vetme në JavaScript,
Kuotat e dyfishtë në HTML, por kjo nuk ka rëndësi
aq kohë sa ju jeni në përputhje.
Pra, këtu në qoftë se ju nuk jeni të njohur, në të vërtetë ju mund të hyni
me JavaScript CSS pronat në elemente.
Pra, të vëreni se unë kam deklaruar një ndryshore të quajtur div
dhe ruajtur brenda e asaj variabël,
një referencë për çdo gjë se element DOM është.
Pra, në qoftë se ju mendoni përsëri në CS50 ose çdo klasë në të cilën keni menduar
rreth strukturave pemë dhe DOM, Object Model Dokumenti,
kjo është vetëm një referencë në një nyje në një pemë,
që përfaqëson këtë faqe
dhe në qoftë se div.style.visibility prona është e barabartë, e barabartë, e barabartë,
fshehur, atëherë unë vetëm duan një këmbe atë
si Jonathan propozuar përndryshe unë dua
të toggle atë mbi të fshehur.
Tani, si në anën e, pse trefishtë barabartë atje?
Apo çfarë është që kundrejt barabartë të dyfishtë?
>> Ekuivalente strikte.
Na vjen keq >>.
>> Ekuivalente strikte.
Pra, kjo është operatorët identitetit
ku jeni duke mos kontrolluar vetëm vlera e variablit
si një kuptim të barabartë, të barabartë por edhe llojin e tij.
Pra, edhe pse ne nuk kemi specifikuar deri tani çdo të dhënë
Llojet për çdo ndryshore në ky ose ndonjë nga slides,
ekziston një lloji të lidhur me se string fshehur
me këtë vlerë, fshehur dhe që është i vargut natyrisht.
Pra, në këtë rast, ajo nuk ka rëndësi
sepse nuk ka asnjë mënyrë që ne jemi duke shkuar për të shkrirë në një varg
e "fshehur" me disa vlera të tjera
por kjo është shpesh një e mirë zakon Unë do të thoja për të marrë
në përdorimin e barabartë, të barabartë,
shenja e barazimit në përgjithësi është një gjë e mirë.
Kjo do të bëjë kodin tuaj më të fuqishme si në PHP, por
dhe në JavaScript sepse ju do të kandidojë
herë pas here në rastet qoshe ku vlera mund të jetë zero
që ju jeni duke kontrolluar për dhe zero mund të ngatërrohet me të rreme
apo mund të ketë dhe si në PHP,
Javascript gjithashtu mund të ketë të shumta Vlerat në mënyrë të gabuar, ku nga zero
dhe të rreme dhe të pavlefshme dhe të pa definuar të gjithë mund të zgjidhë në mënyrë implicite
të rreme.
Por nëse ju jeni të vërtetë duan për të kontrolluar për vlera të veçanta
si zero, numri, ose false Boolean atëherë ju keni
për të përdorur këtë operator të identitetit.
Pra, kjo mund të ndodhë për të marrë në gjithsesi edhe pse këtu,
kjo është lloj i pakuptimtë sepse ne e dimë që ne jemi duke kontrolluar
për një vlerë string dhe është e nuk do të jetë çdo gjë tjetër.
Pra, këtu është magji atëherë, në qoftë se unë lëviz nëpër këtë linjë këtu,
me sa duket, e ndërtuar në dritare të objektit
dhe kjo është një tipar i një shfletues që ju mund të hyni në
në këtë super globale objekt i quajtur Dritare,
brenda e që është disa funksionalitetin,
qoftë pjesë e cila është vendosur interval
dhe ai merr me sa duket çfarë lloj i argumenteve?
Po.
Funksioni >> thirrje dhe një kohë.
Mirë >>. Pra, një funksion telefononi dhe një kohë
dhe kështu sidomos një referencë në një funksion,
një tregues për një funksion në një kuptim
dhe kjo është funksioni që po ndodh
për të ekzekutuar çdo numër të milliseconds dhe në këtë rast,
kjo është çdo 500 milliseconds.
Pra, kjo është një mënyrë e inducing mënyrë efektive dhe loop pafund
pa përdorur përsëritje por në vend të kësaj duke u thënë JavaScript
të motorit brenda i shfletuesit
për të bërë këtë çdo 500 milliseconds ose është i afërt
në 500 milisekonda si ajo mund,
rezulton se nën kapuç,
nuk ka atë që quhet një ngjarje loop dhe ne do të kthehen në këtë
në kontekstin e nyjeve JS që vetëm vazhdimisht lloji
e ulur atje, tjerrje, duke pritur për punë për të bërë
dhe sa më shpejt që të kuptojë,
500 milliseconds kanë kaluar blink do të merrni thirrje përsëri
dhe përsëri dhe përsëri është së bashku e çdo punë të tjera
që ka nevojë për të marrë bërë.
Pra, çfarë mund të përmirësohet këtu?
E pra, më lejoni të hapur up blink-1.html
dhe të demonstrojnë injoroj-1.html
si aesthetically të përkryer identike.
Pra, çfarë mund të përmirësojmë këtu?
E pra, të vëreni se ajo ishte lloj i kotë
për të përcaktuar një funksion të quajtur Blink sepse sa
në sa vende nuk kam telefononi injoroj funksion?
Vetëm >> herë.
>> Pra, e.
Pra, kjo nuk ishte e keqe, në Fakti është ndoshta shumë e
drejtë përpara.
I përcaktuar një injoroj funksion, unë thërrasë një injoroj funksion përmes
i këtij parametri, por teknikisht,
nuk ka pasur arsye për ajo dhe një paradigmë të përbashkët
në JavaScript është që në fakt e bëjnë përdorimin e funksioneve lambda
si ju mund të kujtojnë nga 51 ose funksionet anonim
ku në qoftë se ju nuk keni nevojë një emër për një funksion,
në qoftë se ju jeni duke e quajtur atë vetëm me siguri në një vend,
pse mërzit cluttering kodin tuaj, cluttering mendjen programuesit
dhe emri juaj hapësirë me të vërtetë me simbolet
se ju nuk bëni me të vërtetë duhet të kujdesen për.
Dhe kështu, në këtë version këtu,
vëreni se unë jam duke e quajtur window.SetInterval direkt
në krye të mia tag script atëherë unë jam duke kaluar
në një funksion paemër që nuk merr argumente
dhe kjo është e përkryer fine dhe pastaj trupi
e atë funksion duket është identike me atë që ishte më parë
dhe e vetmja sintaktik Dallimi tani është
këtu poshtë e ardhshme për të 500.
Unë jam duke mbyllur trupin e funksionit
dhe atëherë unë jam duke thënë ekzekutuar atë kod të mëparshme,
çdo 500 milliseconds.
Ndryshimi Pra, shumë margjinale
por një hap drejt asaj që është ndoshta një më elegante
zbatimin e kësaj.
Pra, le të marrë këtë një të tillë hap më tej, nëse unë shkoj tani
në injoroj dy, ju do të shohin një bibliotekë të përbashkët,
efekti i cili do
të jetë plotësisht i parëndësishëm aesthetically por nëse ne do të shkojmë
në version dy here, njoftimi që në krye të kokës sime,
Unë e kam përfshirë Versioni i fundit i jQuery.
Dhe pastaj, poshtë këtu, Unë vetëm pastruar
deri kodit pak, është e nuk do të jetë një botë fun
të vazhdojnë të përdorin Funksionet amtare DOM
dhe lloj të para JavaScript.
Në fakt, jQuery si ju mund të e di se është bërë kaq popullore
se shumica e njerëzve vetëm jQuery konflikt me JavaScript
por me të vërtetë vetëm një darkë Biblioteka e dobishme me shkrim
nga bota një njeri të quajtur John Resig dhe që nga të tjerët
që vetëm të ketë e bën një shumë gjëra të lodhshme
në JavaScript më të lehtë dhe më shumë i ngjeshur.
Pra, në këtë rast këtu çfarë po ndodh?
Pra, unë kam këtë pamjen e një shenjë dollar, më shumë se
në vetëm një moment, pastaj kjo është një përzgjedhës CSS.
Pra, kjo është shumë e ngjashme në shpirt për atë që kam bërë më parë,
por këtë herë, unë jam fjalë për fjalë duke përdorur tag hash
për të treguar një të veçantë Identifikuesi i quajtur përshëndetje
dhe pastaj me sa duket . Css është një metodë e ndërtuar
në të çfarëdo objekti është se unë vetëm krijuar
dhe unë jam duke kontrolluar vlerën i kyç shikimit.
Dhe në qoftë se vlera e atij kyçe është e barabartë, e barabartë, e barabartë, e fshehur,
atëherë unë jam duke shkuar për të toggle atë dhe Unë jam duke shkuar për të toggle atë këtë kohë
duke përdorur të njëjtën metodë e cila me sa duket është e mbingarkuar
në kuptimin që ajo ka dy firma të ndryshme,
një me një argument dhe një me dy argumente,
dytë e cila është kujunxhi,
mëparshëm i cili është një marrës në mënyrë që të flasin.
Dhe në qoftë se kurioz dhe në qoftë se ju do të kurrë nuk të vërtetë shikuar në këtë,
nëse ne do të shkojmë për të jquery.css shpresë hit i lartë është me të vërtetë kjo
dhe ju mund të shihni një shumë shpjegim formal
që ne vetëm të përdorur këtë, . Css me emrin e pronës
dhe pastaj argjendar është dot CSS
me një emër të pronës dhe një vlerë.
Pra, pak më të pastër, por njoftim lloj model këtu
me çdo ripërsëritje të këtij kodi,
ne jemi duke e bërë atë lloj forta dhe të forta dhe të forta
dhe nuk thonë harton më të mirë
pasi ne jemi duke përdorur dikë Kodi tjetër që është eliminuar
disa prej kompleksitetit.
Pra, tani le të bëjmë kjo edhe më të thjeshta.
Dhe në fakt, në qoftë se unë heq të gjitha Kuotat e ju do të shihni vetëm të gjitha
kjo video ju do të shihni se si thjeshtë kjo ka marrë.
Një ndryshim i këtu natyrisht është
që unë jam duke përdorur një këmbe metodë e cila gjithashtu vjen e ndërtuar
në të jQuery dhe kjo është vetëm
për shkak se dikush tjetër shkroi kodin
që në fakt toggles vendosjen shikimit
e çdo element DOM që ju të dërgoni atë.
Pra, më mirë dhe më të mirë.
Dhe kështu, kjo është një model,
edhe pse kjo është një darkë shembull i thjeshtë dhe lloj
e efektit budallaqe neto të cilat është një pjesë e tekstit keq,
kjo është lloj i mendimit se proces që ju duhet të mendoni -
të të menduarit për të mos domosdoshmërisht e parë
Shkrim pasiv diçka për projektin e ardhshëm
por me siguri si ju iterate me këshilltar tuaj ose me mua
dhe takimet e ekipit tuaj apo ju vetëm të shqyrtojë shokët kodin tuaj
për forcimin gjërat, apo jo?
Në fund të fundit, ata janë më pak -
a pak rreshta të kodit ju në fund të fundit kanë
në teori e më pak mete ju ka të ngjarë të jenë të ftuar
sepse ka thjesht më pak kod të bela deri me.
Dakord.
Pra, disa takeaways.
Funksionet Lambda, Funksionet anonime,
shumë nga të cilat ju kanë parë më parë
dhe pastaj edhe vetëm forcimin gjërat me një bibliotekë
si jQuery në këtë rast i veçantë.
Dakord.
Ndonjë pyetje?
Le të bëjmë një tjetër Klienti anë aspekt këtu,
në formë zero ne kemi ky efekt neto.
Super formë të thjeshtë dhe me sa duket në qoftë se unë të përpiqet të klikoni regjistrohen këtu,
fillimisht ajo tregon mua ju jeni regjistruar, mirë, jo të vërtetë.
E pra, pse është kjo?
E pra, këtu është formë-0.html shumë pak kod,
asnjë JavaScript gjëje dhe kjo është krejtësisht një lloj të rreme
të formës sepse veprimi vlerë është registered.html
që do të thotë pa marrë parasysh çfarë Unë lloji në këtë formë,
ku është ajo do të dërgohet në server?
Po. Pra, për të registered.html e cila është qartë një skedar HTML
i cili për këtë arsye është statike skedar i cili nuk ka mjete
të marrë të dhëna përdoruesi duke supozuar nuk ka asnjë kod JavaScript
ngulitur në të që është duke kërkuar në URL
kështu që kjo është krejtësisht një NOOP dhe se asgjë nuk do të ndodhë
me një të dhënave të parashtruara, por ju mund të shihni strukturën
e një formë mjaft e thjeshtë HTML5
që ka një fjalëkalim pak, disa lloje të dhëna.
Pra, le të vërtetë tani shtoni disa kontrolluar gabim
dhe të shohim se si ne mund përmirësuar këtë.
Pra, këtu është lloj i një të varfër Mënyra e njeriut e zbatimit të kësaj
dhe kjo është lloj i një copë keqe e kodit.
Scroll Pra, së pari le të poshtë në fund
për të parë se çfarë është e njëjtë dhe çfarë është e ndryshme.
E vetmja gjë të ndryshme tani mes kësaj
dhe versioni i mëparshëm është që unë e kam dhënë formën dhe ID
e "regjistrimit" mund të të ketë qenë ndonjë gjë që unë dua
por e saj për qëllim të jetë unike identifikueshme edhe kjo nuk është e
shumë e nevojshme, sepse nëse një Faqja ka vetëm një formë, unë e
mund të gjeni atë me një nga Metodat jQuery së përzgjedhës.
Por në këtë mënyrë vetëm ka atë më të determinist.
Pra, kur të shkoj deri tani për të shkrimit tim tag, vini re në vijim,
barabartë window.onload një funksion anonim.
Pra, çfarë është kjo duke bërë?
Pra, ju mund të kujtojnë se në programimi klient-side -
JavaScript vend faqet HTML kanë ngjarje të ndryshme lidhur
me elemente, duke klikuar dhe dorëzimin dhe duke u fokusuar
dhe blurring dhe të tjera të tilla Ngjarjet që mund të ndodhë
si një përdorues në mënyrë tipike ndërvepron me faqen,
window.onload bën atë që thotë.
Nga dritaret gjithë ngarkimit
kështu që një herë të gjitha imazhet kanë qenë shkarkohet një herë të gjitha dosjet kanë
është shkarkuar dhe një herë faqe është ngarkuar,
të bëjë kodin e mëposhtëm, dhe vëreni në qoftë se unë të kaluar në pjesën e poshtme
e kësaj metode, vëreni se nuk ka kllapa
pas Brace kaçurrel që do të thotë
se unë nuk jam ekzekutimin ky funksion deri këtu tani,
shfletuesi do të ekzekutojë ajo për mua kur ai ka përcaktuar
se faqe ka ngarkuar.
Pra, le të shohim se çfarë kemi bërë,
document.getElementById regjistrim
kështu që vetëm më jep një referencë për nyje
në pemë që është e ka një ID të regjistrimit.
Dhe tani, unë jam duke shkuar për të regjistrojnë një tjetër mbajtës ngjarje
duke bërë form.onsubmit merr ky funksion anonim
që do të thotë në vijim Kodi duhet ekzekutuar sa herë që
se forma është dorëzuar.
Tani, shumica e kjo është vetëm lloj i mërzitshëm logjikën.
Pra, në qoftë se vlera e fushë email në formë është
"Asgjë", atëherë ju duhet të sigurojë adresën tuaj e-mail,
ju bërtas në përdorues me një vigjilent dhe më pas kthimit të rreme.
Dhe atëherë unë kam një bandë e kontrolleve të tjera,
kontrollet për fjalëkalim,
kontrollon nëse fjalëkalimet janë të njëjta,
kontrollon nëse marrëveshja kontrolloni kutinë eshte i zgjedhur ose jo
dhe unë vetëm bërtas në përdorues nëse ka ndonjë
e këtyre testeve të vërtetë dështojnë.
Dhe kështu, këtu është një shembull edhe edhe pse është pak contrived
këtu fakti që unë jam duke përdorur është e barabartë, e barabartë, e barabartë,
nënkupton që përdoruesi nuk mund të përpiqen ta gënjejnë mua
nga shtypja në atë vlerë.
Ose më mirë unë jam me të vërtetë kontrolluar për praninë
e varg bosh, përdoruesi nuk ka shtypur ende asgjë.
Nëse shfrytëzuesi shtypur fjalë për fjalë në zero,
"Zero" mund të jetë potencialisht ngatërrohet me varg bosh.
Dhe unë them se është lloj e pakuptimtë këtu
sepse padyshim edhe zero nuk është një adresë e-mail.
Por në qoftë se kjo ishte një më fushë generic si një fushë teksti
ose një emër ose një përshkrim apo diçka që ju doni të vlerë për
dhe kjo nuk është domosdoshmërisht syntactically kanë
të jetë një adresë e-mail, përdoruesi mund të shkruani diçka si zero
dhe përsëri rast këndi, por kjo është pse zakonisht është e kontrolluar llojet
një gjë e dobishme.
Ju jeni me të vërtetë duke kontrolluar për përdoruesi ka shtypur asgjë
në atë fushë.
Pra, çfarë ndodh në qoftë se asnjë e këto teste dështojnë, mirë,
kthimin e vërtetë brenda i një mbajtësin e ngjarjeve
si onsubmit thjesht do të thotë Lë sjellja origjinal të vërtetë
të përhapur dhe për këtë arsye formë do të merrni dorëzuar.
Dhe kjo është arsyeja pse kur më në fund klikuar paraqesin para se të marrë
përmes të register.html dhe në qoftë se unë bëj që tani, njoftim,
I merrni yelled në qoftë se unë nuk e bëj të sigurojë një adresë e-mail
dhe unë mund të shtypni në malan@harvard.edu,
kuq [fonetik], kuqe flakë kontrolluar kutinë,
dhe tani regjistrohen dhe ajo më thotë, përsëri,
ju jeni të regjistruar apo jo të vërtetë.
Dakord.
Pra, le të pastruar këtë ide vetëm një pak dhe më pas tranzicionit
të ri më të reja sende anë server.
Pra, kur të shkoj në formë-2.html, vini re disa gjëra.
Pra, e, kam sjellë jQuery përsëri në përzierje
kështu që përsëri është kjo shenjë dollar
dhe tani unë jam duke përdorur disa metoda jQuery.
Pra, së pari, çfarë është ajo në lidhje shenja dollar kjo është
në mënyrë të veçantë këtu?
Cila është shenja dollari laced të gjithë më të çdo kodi jQuery?
Po.
[Padëgjueshëm Vërejtje]
OK. Pra, funksioni shenjë dollar shkon përmes DOM kërkim
për diçka me këtë veçanti përzgjedhës CSS.
Pra, e vërtetë, por pothuajse shumë e saktë.
Kjo është ajo që ndodh kur ju të kalojë në një varg
si në këtë rast, por ju nuk e bëni gjithmonë duhet të kalojnë në një varg.
Në fakt, rast i tillë, shumë Linja e parë këtu është kjo nuk është një
Përzgjedhës CSS, unë jam duke kaluar në një funksion Lambda.
Pra, në përgjithësi - kështu, Përgjigja mirë, por shumë të saktë.
Më në përgjithësi, ajo që është shenjë dollar përfaqësojnë?
Vetëm >> jQuery.
Po >>. Pra, vetëm të jQuery ose kjo është vetëm një funksion
se disa vite më parë guy shkroi dhe njerëzit e tjerë kanë
përmirësuar që nga ajo fjalë për fjalë nga parazgjedhur është quajtur -
oops, quhet jQuery.
Ajo vetëm - kjo rezulton nga ndryshe nga shumë
i shenjës gjuhë dollarit është një simbol të përkryer të vlefshme për t'u përdorur
në emër të një variabël e ndërsa
në PHP shenjë e dollarit padyshim ka domethënie të veçantë
por në JavaScript si në disa gjuhë, shenja dollar
dhe të theksuar dhe të tjera të tilla karaktere speciale krejtësisht legit
për të përdorur në simbol tuaj emra për variablave.
Pra, dikush vendosi vetëm se, ju e dini se çfarë?
Ajo do të jetë shumë e lodhshme
për të bërë të gjithë botën shkruani jQuery gjithë kohës,
më lejoni lloj të mbjellë një të aksioneve në terren dhe të thonë,
"Kjo bibliotekë do të përdorin shenjën e dollarit. "
Dhe në fakt, kjo nuk rrisin rrezikun
që dikush tjetër të veprojë me mendjemadhësi do të përdorin shenjën e dollarit
për bibliotekën e tij ose të saj, por ka mënyra për të lloj sigurojnë
se kur ju përdorni dollarit nënshkruajë ajo harta për jQuery
sepse ju mund ta provoni nëse ajo tashmë i është caktuar
për diçka tjetër në thelb.
Dakord.
Pra, kjo është e gjitha që është, nuk ka magji.
Është vetëm një sexy në kërkim pjesë e sintaksës që është e bukur
dhe të shpejtë dhe të lehtë për të tipit.
Pra, çfarë ndodh kur ju shkruani shenjë dollar Paren hapura
dhe pastaj një funksion anonim.
E pra, rezulton se ky është simbol të vërtetë stenografi
për dokument dot Paren gati hapur.
Pra, si Cynthia vënë re më parë ne kemi gjetur tashmë një
rast qoshe.
Nëse ju vetëm të kalojë në funksion lambda,
efekti i dollarit shenjë është pak më ndryshe.
Në fakt, çfarë po ndodh me të vërtetë është se është e barabartë me këtë,
duke kaluar në një referencë për objekt dokumenti globale
që është globale vetëm si dritare objekti është
që ju jep disa funksionalitet të veçantë
që ndikon në tërë faqen ose shfletues dhe kjo rezulton
jashtë atë dokument kur ju të përfundojë atë me jQuery,
jQuery thelb realizon, oh, kjo është një referencë
në atë objekt të veçantë dokument,
më lejoni tani të regjistruar një Mbajtësi i ngjarjeve quajtur gati
e cila nuk është vendas JavaScript ose DOM lidhura.
Gati është një jQuery gjë që thotë
kur faqe ka ngarkuar gjitha elementet e HTML
por jo domosdoshmërisht të ngarkuar, të gjitha të CSS dhe imazhet
dhe fotografi JavaScript dhe flash fotografi dhe i pëlqen.
Pra, kjo është një hap para më ngarkesës pastaj të shkojnë përpara
dhe ekzekutuar në vijim.
Dhe kokë e përdorimit të gatshëm do të thotë është se ju mund të, ju e dini,
se të gjithë elementët në DOM tuaj,
të gjitha të identifikohet në mënyrë unike gjëra me kartat e identitetit, ato ekzistojnë edhe
nëse faqja, përmbajtja e saj janë ende të ngarkimit dhe ngarkimit
dhe ju keni disa icons thyer për një moment
ose faqe të bardhë në sfond.
Po.
Çfarë do të ndodhte >> në qoftë se [e padëgjueshme]?
Shembull >> Perfect, një pyetje të përsosur.
Pra, le të shohim nëse ne mund të të simuluar kjo e drejtë tani.
Pra, më lejoni të shkoj përpara dhe të fshini këtë dy linjat deri këtu dhe pastaj
pa mërzit për të rregulluar vulë, më lejoni të shkoj përpara
dhe fshini këtë poshtë këtu - oops, kjo këtu poshtë.
Dhe tani, më lejoni të shkoj për të faqe, shkoni në formë-2.html dhe lloji
në Regjistrin, asgjë nuk duket se të ndodhë, le të themi, pse ishte se,
le të shkojnë përpara dhe të hapur up inspektor Chrome,
hapur deri Console vetëm për të parë nëse diçka ndodh këtu, tani,
regjistroheni, ende asgjë.
Pra, kodi është syntactically gjobë
kështu që unë nuk jam duke parë ndonjë mesazhet e gabimit të kuqe,
por ajo në mënyrë të qartë nuk po ndodh?
Asnjë nga kodin tim është e drejtë, ajo nuk është duke punuar kështu që asnjë
i kodeve mi duket të jetë ekzekutimin, kështu që pse është kjo?
E pra, JavaScript dhe shfletues më të përgjithshme të ekzekutuar
përmbajtjen e një web faqe, krye në fund, e majta në të djathtë.
Dhe problemi është se për shkak të lartë
të kësaj faqe është HTML pastaj kreu pastaj script pastaj një tjetër skenar,
kjo do të marrë të ekzekutuar para se ajo është edhe më e gatshme,
apo edhe ekziston në pemë përfaqësimin e faqes.
Forma e vetë, as edhe Trupi ekziston në këtë pikë.
Pra, jQuery është mjaft i zgjuar me të ai e kontrolluar gabim
që nëse nuk ka element me ID unike të regjistrimit,
ajo nuk do të dorëzani nga mbi ju
dhe vetëm të shkaktojë disa konsol gabim dhe thyejnë faqen e tërë,
ajo do të injorojë heshtje ju, por arsyeja se asnjë
e ky kod kurrë ekzekuton është
sepse kur ju keni regjistruar këtë submit mbajtës,
nuk kishte asnjë element për të bashkëngjitni atë për të.
Pra, kjo është lloj i një jo op atje.
Pra, duke specifikuar në vend të kësaj, prisni deri sa mosha ka ngarkuar
në qoftë se ne e bëmë të window.onload gjë e cila është lloj
nga mënyra e vjetër e shkollës të bërë ai ose sexier mënyrë jQuery
si kjo, ne mund të them të prisni deri sa të gjithë
nga këto HTML tags kanë janë parsed në mënyrë që edhe
në qoftë se imazhet nuk janë ngarkuar, në paktën kjo nyjë është në pemë,
pastaj jQuery mund të sigurojnë se çdo gjë është atje.
Po.
[Padëgjueshëm Vërejtje]
Po, mirë, po absolutisht.
Pra, zgjidhje tjetër për të këtë, në qoftë se ju nuk e përdorni këtë
ose nuk e mbani mend kjo ekzistuar,
ju mund të lëvizin absolutisht të gjithë nga kjo te poshtme
të web faqes, brenda Trupi ende por nën formën
dhe se do të të zgjidhur këtë problem.
Është vetëm në mënyrë tipike konsiderohet si praktikë e keqe.
Kjo është një çrregullt pak dhe i lëngshëm posaçërisht
në qoftë se ju mbani zhurma gjithçka në pjesën e poshtme të faqes,
sidomos kur unë jam duke mbajtur gjëra të thjeshta duke vënë të gjithë
e kodin tim brenda e faqe HTML
kur natyrisht ju mund të me siguri të marrë në zakonin
i factoring atë në një file të veçantë
në të cilën pikë është vetëm e bukur
për të centralizuar fotografi në kokë.
Përveç ka një çmim që ju paguani
duke vënë JavaScript një tjetër Asetet si fotografi CSS
në krye të faqes, çfarë është një rrezik që ju të drejtuar?
>> Ngadaltë faqe ngarkimit.
>> Ngadaltë faqe ngarkimit, pse?
>> Sepse ne jemi duke u përpjekur të ngarkesës të gjitha bibliotekat
para se të [padëgjueshme].
>> Pikërisht sepse shfletues lexoni kodin e sipërme dhe të poshtme,
majta në të djathtë, nëse Google analytics janë të ngadalta
ose jQuery CDN është i ngadalshëm ose API Facebook është i ngadalshëm
dhe se vetëm varet fotografi potencialisht në varësi
se si ju ngarkuar këtë dosje, Faqja e tërë mund të duket për të ul receptorin e telefonit.
Dhe në qoftë se ju shihni këtë shumë sinqerisht
në faqet e internetit që kanë shumë reklama cilësia e ulët
mbi ta, ne jemi vetëm një ngadalshëm ose website Downed mund të ul receptorin e telefonit një faqe
për disa pacaktuar Numri i sekondave
deri në fund shfletuesi shpresojmë herë nga më se
dhe pastaj ju tregon pjesa tjetër e faqes.
Pra, nëse ju keni përdorur ndonjëherë si Facebook, si buton,
në faqen tuaj të internetit, le të më të parë nëse unë mund të gjeni këtë
pa pasur nevojë të hyni këtu.
Pra, në qoftë se ju shkoni në Button si Facebook-ut
dhe kliko një kod të marrë, mallkonte atë,
lejon të shohim nëse ne mund të gjeni shembullin,
me siguri dikush kishte postuar këtë.
[Pushim]
Unë do të heqë dorë në disa sekonda në qoftë se ne nuk e shohim këtë.
Facebook asynch - OK.
Pra, ky është kodi dhe nëse nuk ata kanë ndryshuar atë kohët e fundit
se Facebook vërtetë ju rekomandon të përdorni
të ngarkesës bibliotekën e tyre dhe në fakt të propozojë
që të vendosni këtë në trupi e faqes tuaj.
Pra, Facebook ju këshillon krijuar një lloj budallaqe DIV
që sapo ka ID unike si kjo, atëherë kemi një tag script
dhe gjithë këtë kompleksitet në thelb e bën në vijim
dhe ata nuk përdorin ndonjë jQuery sepse ata nuk duan
për të marrë ndonjë tjetër varësi,
më lejoni të lëvizë këtë mbi vetëm një grimë.
Pra, vini re se ata kanë një funksion anonim këtu,
më shumë se në një moment,
ata pastaj të përdorin document.createElement,
ata janë duke krijuar një element DOM, kjo është si malloc mënyrë që të flasin
ku tag është i tipit script, është e pastaj specifikuar
se atribut Async e atij kodi do
që të jetë e vërtetë, atëherë ju shkoni përpara dhe të kuptoj se çfarë URL
e Facebook JavaScript duhet të jenë të
dhe kjo është vetëm mënyrë e sofistikuar
e kontrollit duhet të të jetë HGP ose HDPS.
Dhe pastaj në fund, ju vini re çfarë bën Facebook,
ata marrin nyjen DOM që ka një ID e rrënjë Facebook
e cila është ajo që ata thanë ju për të vënë në faqen
dhe pastaj ata append fëmijën kështu që efekti i gjithë kësaj është
të lloj dinamike të injektuar një tag të ri skenar në faqen tuaj
si një fëmijë i DIV që ju futur aty në mënyrë që pjesa tjetër
nga ngarkesat faqe për fat të mirë
dhe më pas ky kod të vërtetë merr ngarkuar asynchronously.
Pra, në thelb pas fakt dhe kam shtyrë përmendur
e funksionit anonime
çfarë është kjo shokuar Sintaksa duke iu referuar këtu
kur unë kemi jo vetëm funksionin e hapur Paren, Paren ngushta
dhe pastaj formatimin e teksteve kaçurrel, pse Paren hapur këtu
dhe pastaj të ngushtë të hapur, të ngushtë Paren atje, çfarë është se duke bërë?
>> [Padëgjueshëm] përcaktimin dhe më pas ekzekutimin?
>> Saktësisht, është e përcaktimit të një funksion i cili është anonim
por thjesht përcaktuar një funksion,
sigurisht nuk zbaton një funksion deri sa ju e quani atë
me emër, por sigurisht kjo është një funksion anonim
kështu që ju nuk mund të telefononi atë me emër, por ju mund të
në JavaScript ekzekutuar një funksion anonim vetëm
duke encapsulating të gjithë gjë në kllapa si ne kemi bërë
me këtë Paren dhe kjo Paren këtu dhe më pas një fiksim
në fund të funksionit Paren hapur, Paren të ngushtë,
në qoftë se ju nuk doni të kalojë atë argumente.
Por kjo duket lloj i trashë,
si pse këtë shtesë Kompleksiteti sintaktik
se shumica e njerëzve nuk duket për të njohur, çfarë është vlera
e mbështjellës atyre tre rreshta të kodit
në një funksion anonim në këtë mënyrë.
Po.
Për të shmangur >> overwriting një vlefshme në [padëgjueshme].
>> Pikërisht, për të shmangur overwriting një ndryshore
në faqen ekzistuese, apo jo?
Facebook është disi vendosur me qëllim,
ata do të përdorin E ndryshueshme, është mjaft e mundshme
se ju apo dikush duke përdorur Facebook si buton
apo çfarëdo plug tjera sociale
në ka një variabël quajtur diku E. Pra,
nga encapsulating të gjithë e kodit të tyre brenda
e këtij funksioni anonime, ata në thelb kanë qëllimin e tyre
që nuk rrezikojnë clobbering çdo variablat.
Pra, edhe kjo është në të vërtetë një paradigmë shumë të zakonshme,
sidomos kur shkrim një kod bibliotekë
ose kur ju vetë nuk e bëni doni të rrëmujë hapësirë ​​emrin tuaj
me variablat e tjerë që doni vlera të jetojnë
dhe vdesin pasi të dilni se bllok i kodit,
kjo është një teknikë e bukur në JavaScript.
Dakord.
Pra, më pas përsëri në këtë shembull këtu, të gjithë ne kemi bërë në fund
me këtë shembull është pastrohen vetëm deri kodin.
Pra, kjo është ende mori një të tërë bandë e ndizet, një bandë e tërë
i kushteve këtu, por njoftim pak e sintaksës,
kjo accesses nyjen DOM me regjistrimi unik ID,
mjetet hapësirë ​​shikoni tani për një pasardhës i kësaj nyje,
gjeni atë nëse është e tipit input dhe pastaj edhe
në qoftë se ju nuk e keni parë këtë para, ju mund të dini
se kjo vetëm do të thotë të gjetur ai me tag input,
elementet të dhëna se ka një atribut i emrit me vlerë
e-mail, dhe pastaj le të Më të lëvizë dorën time në disa
i pjesës tjetër nuk është të gjitha që stimuluese
por me të vërtetë vetëm sintakse jQuery për të njëjtat operacione.
Dakord.
Por ajo nuk është aq e rëndësishme këtu është një temë shfletuesi pala
por fakti që ne kishte mënyra të pastër dhe të pastër
të vërtetë duke e bërë se puna code.
Dakord.
Ndonjë pyetje?
[Padëgjueshëm Vërejtje]
OK. Tani pjesa fun.
Pra, node.js Pse?
Kush kujdeset?
Çfarë dini për këtë sot?
Node.js, pse?
Henry [supozuar drejtshkrimin].
[Padëgjueshëm Vërejtje]
Rivendosur bateri?
Çfarë - kjo është një hallkë të përsosur shkëmb
për gjysmën e dytë të sotme.
Pse nuk shkoni dhe të marrë një pushim 5 minuta këtu,
ka një karamele gjysmë makinë atje, nëse ju do të
si disa karamele pa vënë një e katërta in