Allison BUCHHOLTZ-AU: Ang lahat ng mga karapatan ng lahat. Maligayang pagbabalik sa seksyon. Ito ay ang aming malumay seksyon. Ito ay kaya malungkot. Hindi ko alam kung ano ako ng pagpunta sa gawin nang hindi nakikita mo guys tuwing Lunes. Sa tingin ko dapat naming just-- siguro maaari naming lamang matugunan dito at may hapunan o isang bagay. Hindi ko alam. Kukunin ko dalhin ang pagkain sa halip. Susubukan naming makipag-usap lamang. Ngunit oo, sa susunod na linggo habilin maging ang aming huling seksyon. Sa na tala, mayroon kang isang pagsusulit sa susunod na linggo. Alam ko Nakalimutan ko na gawin ang aking, tulad ng, dalawang linggo sa paunang abiso noong nakaraang linggo, ngunit sana ka guys Alam ito ay darating. Sana ito ay isa sa mga huling midterms para sa iyo guys para sa semestre. Ngunit ito ay pagpunta upang masakop ang lahat ng materyal na na-nawala namin sa paglipas. Kaya ito ay hindi nagkagusto maaari mong makalimutan lamang tungkol sa apat na mga loop o variable. Dahil nalaman namin mga nasa unahan, mga ito ay malinaw naman patas na laro para sa iyong pagsusulit. Ito ay magiging ang parehong format, parehong haba, kaya ka na ay ginagamit upang ito. May pupuntahan maging coding sa pamamagitan ng mga problema sa kamay, siguro ilang tunay na hindi totoo, siguro ilang maiikling sagot. Kaya dapat kang maging pamilyar sa format, lalo na kung gagawin mo ang mga pagsubok na kasanayan. Ngunit bilang sinasabi ko dito, ito ay pinagsama-samang, ngunit kami ay tiyak pagpunta sa ay nagbibigay-diin sa bagay mula sa linggo ng anim na pasulong. Kaya, kami ay marahil hindi pagpunta upang hilingin sa iyo ang tungkol sa kung gaano karaming mga byte ang nasa bawat uri o mga uri ng mga bagay, ngunit marahil kami ay magiging interesado sa mga bagay tulad ng naka-link na mga listahan, o ibang mga istraktura ng data, o iba't ibang mga algorithm na-usapan natin ang tungkol. Kaya tiyaking ikaw talaga hanggang sa iyon, at kung Kailangan ng anumang mga mapagkukunan, narito ang maraming mga mapagkukunan. Ko lang ang ibinigay sa iyo uri ng isang mabilis na listahan doon. Sa susunod na linggo ay magiging quiz suriin sa panahong ito. Kaya kung mayroon kang anumang mga katanungan o tukoy na paksa, mga tukoy na bagay sa pagsusulit na Gusto mo bang pumunta sa ibabaw, mangyaring ipadala sila sa maagang ng panahon nang sa gayon maaari kong uri ng maghanda ng ilang materyal para doon. At bukod sa ito pagsusuri ng seksyon, kami ay ring hinahawakan ang kurso-wide suriin tulad ng ginawa namin huling beses. At ito ay magiging tapos na sa pamamagitan ng parehong mga tao. Hindi ko alam kung na Ginagawang mas mahusay o mas masahol pa, ngunit ito ay magiging akin, Hannah, Davan, at Gabe muli. Kaya kung nais mong makabuo makita amin ang lahat ng tukso sa isa't isa at ituturo sa iyo quiz pagsusuri, dapat mong tiyak Napag-na sa susunod na Lunes din. Kaya mo makikita na lang ay Lunes jam naka-pack ng pagsusuri pagsusulit, na mahusay dahil pagkatapos ay mayroon kang Martes i-proseso sa pamamagitan ng lahat ng bagay. Ngunit gawin Siguradong suriin ang mga mapagkukunang ito. Study.csv.net ay sa pamamagitan ng malayo, ako Sa tingin, isa sa mga pinaka-kapaki-pakinabang, karamihan ay dahil ito ay ng maraming sample code, mayroon itong lahat ng mga Power Mga Puntos kasama ang lahat ng mga tala sa ito, na kung saan ay talagang kung ano ako gumuhit ng karamihan ng aking mga materyales mula sa seksyon. Kung mayroong anumang bagay sa nakaraang mga seksyon na maaaring ko bang ipadala out na hindi ka maaaring magkaroon nakuha, ipaalam lamang sa akin. Tulad ng sample code huling linggo, kung ang sinuman ay hindi nakuha, -email lamang sa akin o dumating talk sa akin, at kukunin ko na tiyakin na iyong nakuha. Kaya may na, ngayon kami ay pagpunta na pinag-uusapan ng JavaScript. Kaya dito namin Tommy, na ako ay pakikipag-usap lamang sa iyo kagabi. Gustung-gusto ko Tommy. Ang JavaScript ay kanyang paboritong wika, tulad ng sabi niya dito. Makikita nila subukan at sabihin sa iyo na ito hindi ang pinakamahusay na, at sila ay magiging mali. Kaya Tommy ay isang master JavaScript. Hindi ako masyadong sa kanyang antas, ngunit ako ay tulad, "Tommy, paano ko magturo mga bata JavaScript? " Kaya Mayroon akong ilang mga tip, kaya sana ay gumagana ang mga ito out. Kaya ng ilang mga bagay upang malaman ay ang JavaScript ay isang client-side scripting wika, kaya kung saan ang PHP ay isang bagay na isinasaalang-alang namin ang higit pang mga server-side, ito ay i-upload sa server, Pinagsama-sama at isagawa doon. Isa na ito ay pinaandar sa iyong sariling machine. OK? Kaya nag-load ka ng ilang pahina ng JavaScript, at ito executes sa iyong machine. Syntax ay halos kapareho sa C at PHP. Kami ay pagpunta sa pumunta sa pamamagitan ng ilang mga halimbawa ng JavaScript, at iyong pupuntahan upang makita na ang paraan makipag-usap namin tungkol sa mga variable, loop, at kundisyon ay lahat na halos kapareho. OK? Ang katotohanan na ang mga ito ay kaya katulad ay marahil pagpunta sa Trip ilan sa inyo up, sa ilang kaso, dahil lang makikita mo isama ng kaunting C kung saan mayroong hindi dapat. Siguro mong subukan at i-type ang isang bagay kapag ito ay hindi dapat na-type. At sa iyon, isang bagay na Alam ay ang JavaScript ay isang dynamic na-type wika, tulad ng PHP. Kaya kung guys tandaan mula sa seksyon noong nakaraang linggo, kapag kami ay uri ng paggawa ang aming PHP pag-crash kurso, Nakita namin kung gaano maaaring maging isang string isa naging isang int isa, at iba pa. Ang uri ng iyong mga variable Natutukoy sa pagtakbo ng panahon, kaya maaaring sila ay magbabago sa paglipas ng kurso ng programa, at sa parehong paraan na aming kailanman talaga ipinahahayag uri para sa mga variable na PHP, kami ay pagpunta sa ay paggawa nito bagay dito, kung saan kami ay hindi talaga pagkontrol sa uri ng aming mga variable, kaya upang magsalita, tulad ng ginagawa namin sa C. At pagkatapos ay isang bagay na iyon ay medyo cool ay na maaari mong error suriin sa pamamagitan ng console, na may ganitong dakilang pag-andar console.log, na ay nagbibigay-daan sa iyo upang i-print ang iba't ibang variable o mga bagay na kami ay pag-usapan. Tulad ng nakaraang linggo kapag ako ay tulad ng, "gamitin ang function na ito," na may dump mula sa iyong pset na ito ay isang function na gusto mong gamitin, console.log. Ako ay kaya magulat kung gaano karaming mag-aaral sa oras ng opisina Hindi malaman tungkol sa dump function. At ako ay tulad ng, "guys, kalooban ito gawin ang iyong buhay upang mas madali. " Ang lahat ng mga karapatan, sa gayon ay uri ng lamang ng isang maikling bagay, gaya ng lagi, mayroon kaming mga halimbawa. Alam ko na gusto mo guys na iyon. Kaya narito ang isang halimbawa ng isang napaka simpleng JavaScript maghain dito. Kaya lang pagpunta sa gumawa ito ang mga pop-up na nagsasabing, "Hello mundo," kapag pumasok sa pahina, ngunit sabihin subukan at maglakad sa pamamagitan ng ilang sandali. Kaya malinaw naman na ito ay isa lamang tulad ng iyong normal na index.html. Kaya, lamang ang aming normal na template dito, at mayroon kaming HTML, mayroon kaming aming ulo, at tulad lamang ng sa CSS, kung paano namin Kasama ang ilan sa labas ng file, i-right? Mayroon kaming ilang mga uri ng script teksto na JavaScript. At sa mapagkukunan ay hello.js, na kung saan ay down na dito. Ito ang buong file ng hello.js. At pagkatapos ay mayroon kaming ilang mga pamagat at ilang mga body ng HTML na hindi talaga namin na nagmamalasakit sa. Ano ang mangyayari ay, kapag nag-load namin ang pahinang ito, ito ay awtomatikong executes ang script na ito. OK? Kaya habilin JavaScript awtomatikong isagawa. Kaya kung ano ang pagpunta sa gawin, ito ay pagpunta upang agad na pumunta at isagawa ito. At ito ang nangyayari upang sabihin, "alerto. Kamusta mundo. " Aling mga alerto ay ang pag-andar na talagang bumubuo sa kahon na ito. OK? Kaya uri ng lahat mapaligiran. Wala ang extrang namin ay may gawin bukod sa alerto lang, at pagkatapos ay kahit anong nais namin sa loob ng aming kahon Alert. OK? Kaya ito lamang ay isang napaka-simpleng halimbawa ng kung ano ang maaaring gawin ang JavaScript. Isa sa mga talagang cool na bagay, bilang namin makita, ay nagpapahintulot sa iyong JavaScript upang manipulahin sa iyong mga web page, nang hindi na kinakailangang -reload ang mga ito sa bawat oras. Kaya kung want-- mo halimbawa, kung ikaw ay pagpasada sa isang bagay, kung ka guys na ba mayroon Nakita tulad ng Menu bar, o kapag hover ka sa ilang paksa, lilitaw ang isang Drop-down na menu, na dahil sa ang JavaScript. OK? Kaya hindi ka nagre-reload ang buong pahina upang makakuha ng menu na ito upang lumitaw, lamang na iyong hinahanap para sa ilang partikular na pagkilos na ang gumagamit ay kinuha, na kung saan ay tinatawag na mga kaganapan na susuriin namin sa, at sa sandaling makita mo na, sabihin mo, "OK, i-edit ang isang bagay sa pahina at bigyan ng iba't ibang mga anyo, pero i-edit lamang ang mga tukoy na bagay. Huwag i-reload ang buong bagay. " Kaya ito talaga ay mas nicer, at Hindi mo na kailangang i-reload ang iyong mga pahina, at ito ay talagang cool. Kaya variable na pahayag, upang maaari mong uri ng makita, Naglagay ako sa tuktok dito, maluwag na-type. Kaya ito ay napaka tulad ng PHP. Hindi namin kailangang sabihin JavaScript anong uri kami umaasa sa bawat isa sa mga variable na ito upang maging. Maaari silang maging kahit anong uri gusto naming. Kaya napansin mo sa kasong ito, ipinahahayag namin ang mga ito napaka-simple, sa pamamagitan lamang ng "var" at pagkatapos ay anumang gusto namin ang aming mga pangalan ng variable na. Ang isang bagay na dapat tandaan ay na kapag ilagay var sa harap ng isang pangalan ng variable, ito lokal na saklaw nito. OK? Ito ay lubos na makatwirang para sa iyo upang tuluyang burahin lamang ang var at mayroon lamang mga katumbas CS50, at na hindi lamang isang pandaigdigang variable. OK? Kaya maaari mong simulan ito sa parehong paraan, Depende lang kung paano mo ito gusto. Kaya kung gumagamit ka Sinisimulan ito sa loob ng isang function, at gusto mo na variable sa manatili sa loob ng scoped na function, ka ng pagpunta sa nais na gawin isang bagay tulad ng var pangalanan ang isang variable, kumpara sa kung nais mong sa buong mundo scoped, mo Maaari lamang gawin ang mga pangalan ng ang variable at pagkatapos ay kahit anong gusto mo itong itakda katumbas ng. OK? Ito ay uri ng mga cool na bagay down na dito, dahil kung napansin namin ang aming mga variable b ay nagsisimula out bilang totoo. At kung ano ang maaari does-- sinuman sabihin sa akin kung ano ang ginagawa? Kaya mayroon kaming ilang mga alerto. Ano ang gusto nagta-type ng b maging sa umpisa? Madla: Boolean. Allison BUCHHOLTZ-AU: Boolean. I-right. At pagkatapos reassign namin b upang ang string na ito, i-right? Kaya pagkatapos dito, kung anong uri ng b maging? Gusto ito ay isang string, i-right? Kaya kung ano ang mahalaga sa paunawa ay na sa c, namin maaaring halos hindi kailanman gawin isang bagay tulad na. Nais naming magkaroon upang magkaroon ng isang variable, cast ito bilang ng iba pang bagay, siguro gawin ang ilang mga pag-andar na may dalawang i, pumunta mula sa isang pagsingil sa isang integer. Ngunit kung napansin namin dito, b napaka madaling nagbabago type. Madla: Maghintay, kaya maaari mo lamang na tulad ng, "gawin b isang integer?" Allison BUCHHOLTZ-AU: Oo. Maaari mo lang reassign b sa isang integer. Madla: talaga? Allison BUCHHOLTZ-AU: Oo. At pagkatapos ay magiging isang int. Sa gayon ang iyong mga variable na maaari magbabago sa paglipas ng kurso ng programa masyadong. Hindi sila ay mahigpit na nai-type. Ito ay napaka maluwag na-type. OK? Isa lamang ang iyong mga variable na maaari gawin ang anumang gusto nila, bilang uri ng namin nakita sa PHP. Maaari silang gumawa ng ilang nakatutuwang bagay, kaya mahalaga ito upang maging medyo maingat. Pangalanan ang iyong mga variable na rin. Kung wala ka, biglang-bigla ka ng pagpunta sa maging tulad ng, "Maghintay, naisip ko na ito ay isang string, at ngayon ito ay isang int, at hindi ako talagang sigurado kung ano ang nangyayari sa dito. " Kaya ito ay lamang ng isang simpleng halimbawa ng na nagpapakita kung paano ang isang variable na maaari madali baguhin ang uri nito sa paglipas ng kurso ng isang programa. OK. Kaya ito ay dapat magmukhang sobrang, sobrang pamilyar. Kaya ito ay ang aming mga loop sa JavaScript. Ang mga ito ay eksaktong pareho, maliban sa sa halip ng apat int i ay katumbas ng zero, maaari naming lamang sabihin var i ay katumbas ng zero. At pagkatapos ay maaari naming magkaroon ang aming mga parehong pag-uuri ng kondisyon, parehong uri ng pag-update, i plus plus gumagana lamang fine. Kaya fours ay pareho, panahon ay pareho, at gawin panahon ay eksaktong kapareho. Parehong uri ng pangkalahatang format. Napansin namin, apat, panaklong, bracket, ang lahat ay ang parehong. Gayundin magkakaroon ng semicolon kapag makuha namin sa halimbawa code. Makikita mo itong Kahanga halos parehong bilang c. Para sa pag-andar na pahayag, muli, na halos kapareho. Mayroon kaming ilang mga function na lamang Sinasabi na ito ay isang function, at pagkatapos ay ang pangalan ng ating function, at ang input. At muli kung napansin namin, namin walang mga uri dito kung ano pa man. Mag-right? Mayroon kaming walang sinasabi mo na ang kailangang maging ints o doubles, o sa kamay. Maaaring maging kahit anong gusto nila. Ano ang mahalaga ay halata na kailangan namin upang isulat ang function na sa simula pa upang ipaalam sa JavaScript na ito ay talagang isang function. Kaya ito ay lamang ng ilang simpleng mga halagang function na ay nagbabalik x o y, at pagkatapos ay kung ano ang cool na rin ay na maaari mong aktwal na magtalaga ng isang function sa isang variable. Kaya sa kasong ito, suma ngayon ay -andar na aktwal na ginagawa kabuuan. Kaya kung napansin mo dito, mayroon kaming function, pangalan ng function, mga input. Mag-right? Narito mayroon lamang namin ang function at input. Kaya ito ay tinatawag na isang hindi nakikilalang function. At ito ay isang bagay na dapat ay bagong sa karamihan ng sa iyo guys, kung hindi lahat ng iyo. Kaya talaga kung ano na paraan ay gagawin namin ang hindi Kailangan ng pangalan ng ating function na sa kasong ito. Maaari lang namin sabihin, "OK, pupunta ako sa Mayroon function na ito na executes, dito mga input nito, at narito kung ano ang pagpunta sa gawin. " At lalo na kapag naka-nagtatalaga isang function sa ilang mga variable na iyong pupuntahan upang manipulahin, hindi mo kinakailangang Kailangan upang pangalanan ito dahil na iyong pupuntahan ay nagre-refer na dito sa pamamagitan ng variable na ito pangalan, hindi ng kahit anong ang function ay aktwal na tinatawag. OK? Kaya kung makita natin dito, namin mayroon na ngayong ilang mga variable sum iyon ay katumbas ng kabuuan ng tatlong at limang. At gusto namin ito. At ito ay magkakaroon lamang ng ilang mga alerto, tatlong plus limang ay katumbas ng bilang. Plus ito lamang pagdugtungin kahit anong aming sagot ay papunta sa string. Gayundin cool, plus maaari pagdugtungin mga string. Para sa mga JavaScript, tulad sa PHP, HTML, at CSS tulad ng sinabi namin, Marami itong Kami ay uri ng pagkuha ng ang mga gulong ng pagsasanay off dito at mayroon kang guys ng maraming mga alam kung paano talaga maintindihan ang mga bagay. Ang mga ito ay bahagyang naiiba, ngunit ang mga ito ay hindi kaya sa ibang bansa at na hindi ka maaaring Google bagay o tumingin up ang mga ito online gamit ang w3 paaralan. At talagang kami ay umaasa sa iyo guys sa, uri ng, eksperimento at matuto sa inyong sarili. Kaya, alam ko maaaring ito ay tila ng kaunti mas masinsinang kaysa sa ilang ng mga bagay c ginagawa namin, ngunit iyan ay para sa isang dahilan talaga. Ngunit sana ay hindi ito masyadong ibang, at ito ay hindi napakalaki. Kaya array sa JavaScript, muli napaka, na halos kapareho. Mag-right? Mayroon kaming ilang mga array variable na katumbas ng laman bracket, at ito lamang ay isang walang laman na array. Ito ay madalas na tinatawag na literal array pagtatanda. Ito lamang ay isang bagay na tinatawag namin itong. Kapag nakita namin array dalawang dito, mayroon kaming ilang mga literal array na may tatlong elemento, tama? At pagkatapos ay mayroon kaming ilang mga var ikatlong elemento na ang ilang mga variable na ito lamang pagpunta upang i-hold ang string na ito, JS. Ang mga elemento, handa na upang mapansin, ay pinaghihiwalay ng mga kuwit, gaya ng gusto namin inaasahan. At maaari ka ring ma-access ang mga ito, tulad ng ginawa namin sa C, na index ng pagtatanda na ito, i-right? Kaya iba mula sa PHP ngayon, kami ay bumalik sa makatarungan uri ng nagre-refer na sa mga bagay sa pamamagitan ng index. Tulad ng C, ito ay din zero index. Nararamdaman kong magiging talagang malupit kung biglang nila ginawa JavaScript isa index, at kailangan mong i-ganap umisip na muli kung paano mo isipin ang tungkol sa array. Isang cool na bagay ay na sa halip ng pagkakaroon upang do-- kung sakaling Nais ang haba ng isang array, siguro umulit ka sa pamamagitan nito hanggang kang makahanap ng mga dulo, o Gusto mong malaman kung ano ito ay. Dahil JavaScript ay napaka hindi kabit-kabit sa higit pang paraan kaysa uri lamang, tulad ng nakikita namin dito, Maaari lamang kami gawin ang array Mas malaki dahil nagpasya na. Kung napansin namin na hanay ng tatlong May tatlong bagay na dapat magsimula, ngunit pagkatapos ang lahat ng isang biglaang, Ikinalulungkot namin tulad ng, "oh, lamang kidding. Talaga kami ng pagpunta upang gawin itong 101 mga bagay. " Kaya kung nais mo mang malaman ang aktwal na haba ng iyong array, gawin mo ito tulad nito. At kami ay pagpunta sa makita ang marami ng pagtatanda sa mga halimbawa, ngunit sa JavaScript ito ay karaniwang sa kahit anong sa bagay na pinag-uusapan tungkol sa tuldok ang anumang uri ng pag-andar na nais mong ilapat sa ito. OK? Kaya sa kasong ito, ang aming object ay array dalawa, at sabihin natin na gusto natin ang haba ng array dalawa. Kaya ito na tawag lamang tulad ng haba sa iyon. At na ay magbabalik ng iyong haba. Gayundin isang bagay na dapat tandaan ay na kung napansin namin ang aming array, hindi tulad ng C, wala silang maging lahat ng parehong uri. Ito ay higit pa tulad ng PHP. JavaScript ay isa lamang tulad ng ginagawa ito kagiliw-giliw na ipakita ang kombinasyon ng C at PHP. Kaya susuriin namin sa iyon. Sa ngayon, sabihin ipinapalagay lamang na ang iyong mga array ay isa lamang tulad ng C array, sa na ang mga ito ay zero-index. OK, kaya na ang lahat. Maaari mo ring palawigin lamang ng isang array sa anumang index na gusto mo. Sapagkat ito ay malamang na seg pagkukulang sa iyo o bigyan ka ng ilang mga error, JavaScript ay tulad ng, "nah, ito ay multa. Mayroon akong na ito. Susubukan naming pumunta lamang tuwid kung saan nais mong i-. " OK, kaya bagay ay napakahalaga. Ikaw guys ay gumagamit ng maraming mga sa iyong P set, kung natatandaan ko nang tama. Kaya ang bagay na ito ay katulad ng sa C ay structs. Kaya maaari mong isipin kapag about-- pumunta kami sa isang halimbawa karapatan pagkatapos nito ako sa tingin idedetalye ito gawing mas sense-- ng maraming ngunit isa lamang namin ang mga bagay sa -ayos ng impormasyon na may kaugnayan kurso. Kapag usapan natin ang tungkol structs sa C, namin madalas makipag-usap tungkol sa isang mag-aaral na may ilang pangalan, ID ng, bahay, alam mo, na konsentrasyon. At iyon ang uri ng ang parehong bagay na namin ang mga bagay para dito. Ito ay lamang upang ayusin katulad na impormasyon. Maaari ka ring mag-isip ng mga ito bilang higit pa katulad ng nag-uugnay array sa PHP. Kaya ito ay magiging uri ng mga bagay kung saan mayroon kaming ilang mga pangunahing may ilang mga halaga, na halos kapareho sa PHP. Kaya maaari mong simulan ang ilang mga Walang laman ang bagay na ito, tulad ng nakikita natin dito, lamang na may kulot tirante. Kaya array ay mga square bracket. Walang laman na mga bagay ay kulot tirante. Magandang pagkakaiba na magkaroon. At ang mga ito ay lamang ng dalawang magkaibang mga paraan upang i-set ari-arian. Kaya ito ay uri ng magkano ang higit pa sa isang paraan na ay katulad sa PHP, gamit ang aming nag-uugnay array, sa aming mga key, at ang aming halaga, samantalang ang ang isang ito is-- ikaw makita ito ng maraming higit pa sa JavaScript. Ito ay may gawi na maging ang convention. At sa parehong paraan na aming ginawa array dalawang tuldok haba, ito ay nagsasabi, "OK, ninyo akong bigyan ito katangian ng bagay na ito. " Mag-right? Kaya sa parehong paraan ito ay tulad ng, "ako ang haba na katangian ng array dalawa, " ito ay nagsasabi, "magbigay sa akin ang ilang ari-arian ng aming mga walang laman na bagay. " O sa kasong ito, hindi namin nagtatalaga ito sa ilang mga halaga dito. Ngunit maaari mo ring i-access ito na paraan. At pagkatapos ay narito ito lamang na nagpapakita ng dalawang magkaibang mga alerto. Kaya ito ay magpapakita ng mga alerto ay ang eksaktong parehong, ito ay dalawang lamang iba't ibang paraan ng -access ang elemento na gusto naming. Ba na magkaroon ng kahulugan sa lahat? Pakiramdam ko ay tulad ng isang ito Marahil ay ginagawang higit pang kahulugan, dahil lamang kami darating off ng PHP. Ngunit tulad ng ginagawa namin ng higit pang mga halimbawa, ito ay literal na eksaktong kapareho. Marami sa mga ito ay baguhin lamang sa syntax. OK, kaya halimbawa. Gustung-gusto ko ang mga halimbawa. Kaya dito ay ilang mga CS50 variable na iyon ay isang bagay, at iniimbak namin ang lahat ng ito impormasyon tungkol dito. Kaya mayroon kaming kurso, titser, tfs, psets, at tape. Kaya napansin namin ang mga ito ay halos lahat ng iba't ibang uri. Mag-right? Kaya maaaring iimbak ng mga bagay mga katangian ng iba't ibang mga uri. Maaari naming isipin this-- ay masyadong katulad sa aming nag-uugnay array sa PHP. Kaya key, halaga, key, halaga, susi, halaga, kaya sa at iba pa. Ano ang mga kawili-wiling sa parehong paraan din magkaroon kami ng mga array sa loob ng array, Maaari rin naming magkaroon ng bagay sa loob bagay, o array sa loob ng mga bagay. Hindi ka talagang limitado sa lamang ng isang solong isa sa mga bagay. Maaari naming makakuha ng napaka Inceptionesque, lamang panatilihin ang pagpunta down ang kuneho butas doon. Kaya kung napansin namin, namin May ilang mga kurso na ay isang string, magtuturo na isang string, at array, isang int, at isang Boolean. Kaya lahat ng mga iba't ibang mga bagay. Ang lahat ng mga karapatan, sa gayon, mayroon kaming ng isa pa. Kaya sa kasong ito, mayroon kaming isang hanay ng mga bagay. Kaya gusto lamang sa isang bagay ay maaaring magkaroon ng isang array sa loob nito. Maaari din naming magkaroon ng isang hanay ng mga bagay. Ito ay maaaring kapaki-pakinabang sa isipin ang tungkol na katulad ng uri kung paano nagkaroon kami ng hash talahanayan, nagkaroon kami ng isang array ng lahat ng mga iba't-ibang mga uri ng structs na mga mungkahi ukol sa iba't ibang nodes at watnat. Ngunit sa kasong ito, kami magkaroon ng isang hanay ng mga bagay. Kaya ito ay tulad ng isang array ng nag-uugnay array. Kaya mayroon kaming ilang mga unang elemento ay maging ang mga bagay na may pangalan na James at paglagyan ng Winthrop. Maaaring naaalala guys isang bagay na halos kapareho sa ito sa iyong huling pset, kung saan kung na nakuha ng isang bagay mula sa iyong database, ang unang uri ng bagay sa iyong array ay ang lahat ng mga impormasyon tungkol sa ang unang user na natugunan nito, at pagkatapos ay kailangan mong i-index sa na upang makuha ang kanilang mga stock o ang kanilang mga cache o watnat. Kaya ito ay talaga ang parehong bagay, isang maliit na pagbabago sa syntax, kaunti pagbabago sa ang mga salita na ginagamit namin upang ilarawan ang mga ito. Kaya kung gusto naming, maaari sinuman sabihin sa akin kung anong gagawin sa alertong ito dito? O kung ano ito bit ng code gagawin para sa amin? Madla: Ito magbibigay sa iyo ng lahat ng mga pangalan. Allison BUCHHOLTZ-AU: Kanan, kaya Gusto alertuhan lamang sa lahat ng mga pangalan dahil ito ay pumunta sa pamamagitan ng cottage ko, kaya nais itong magsimula sa zero. Kaya nais itong sabihin, OK kaming naghahanap ng sa ito unang bagay, na ay ang unang slot sa aming array. At sinasabi nito, "bigyan mo ako ng katangian, ang pangalan ng bagay na iyon. " Kaya pumunta kami dito, kami ay -scan, nais naming mahanap ang pangalan, at gusto naming i-print James, Molly, at Carl. Ang anumang mga katanungan sa ngayon? Ang JavaScript sa kasamaang-palad ka ng pagpunta sa maging paggawa ng maraming hinahanap sa iyong sarili, ang pag-uunawa ng syntax, grappling dito. Ngunit siyempre ako palagi dito, oras ng opisina ay palaging dito. Baka ako tuwing Martes sa linggong ito. Kaya kung nandoon ka, maaari kang dumating bisitahin ang sa akin sa linggong ito. Gusto itong maging mahusay. OK, kaya DOM ay Dokumento-Bagay-modelo. Kaya ito ay isa lamang paraan na nais naming mag-isip tungkol sa kung paano ang aming HTML at lahat ng bagay sa loob nito ay organisado. Ito ay napaka isang bagay na ay marahil na makabuo sa iyong pagsusulit. Alam ko ang aking taon, ito ay tulad ng narito HTML file, punan ang DOM para dito. At sa iyo punan lang sa maliit na bagay. Ito ay dapat na sana ay madaling puntos. Sana makikita mo see-- Madla: [hindi marinig] Allison BUCHHOLTZ-AU: Kaya mo ang puno na ito? Madla: Oo. Allison BUCHHOLTZ-AU: Kaya sila ay hilingin sa paggamit upang punan sa kung ano ang napupunta sa ilalim ng katawan. Siguro sa ilalim ng katawan, mayroon kaming ilang mga divs o mayroon kaming ilang mga talata, at hihilingin namin sa iyo na punan ang isang puno talaga tulad nito. Kaya mag-i-paglalakad namin sa pamamagitan nito. Kaya ang Dokumento-Bagay Modelo ay isa lamang paraan upang buuin at sa tingin tungkol sa graphically aming HTML. At din kapag makuha namin sa higit JavaScript, ito ay magiging ang paraan na aming aktwal manipulahin ang iba't ibang mga elemento sa pahina. Kailangan namin ng isang paraan upang ma-access ang bawat ng mga bagay sa aming HTML, at sa gayon ito ay nagbibigay sa amin ng isang napaka kongkreto standardized na paraan sa kabuuan ng iba't-ibang mga pahina ng web upang gawin iyon. Kaya kung maglakad lang namin sa pamamagitan ng ito dito, siyempre ang aming mga dokumento tulad ng ating buong file. Na malinaw naman saysay na ito ay ang pinakamataas na bagay, at pagkatapos ay mayroon kaming aktwal na HTML, na tumutugon sa ang tag na ito dito. Gayundin kung sa indent ang iyong mga tag maayos, pagkatapos ng paglikha ng DOM puno ay nagiging sobrang simple. Kaya mayroon kaming ilang mga ulo dito. Mayroon kaming ilang mga katawan na nakikita namin stem-off ng HTML, na ang dahilan kung bakit mayroon kaming ulo at katawan. Sa loob ng ulo, mayroon kaming ilang mga tag ng pamagat, isang pansarang tag na pamagat, upang malaman namin na nauuna matapos ulo. At sa loob pamagat aming mga tag, mayroon kaming kumusta, mundo. OK? Kaya na ito buong kaliwang sangay kamay. At pagkatapos ay para sa mga tamang sangay ng kamay dito, makikita natin na mayroon kami ng HTML, OK tapos na namin ang ulo bahagi, naghahanap kami lang sa katawan, kaya mayroon kaming ilang mga katawan area. At sa loob ng na, ang tanging bagay na mayroon kami ay kumusta, mundo. OK? Kung nagkaroon kami bagay tulad ng ang ilang mga bracket p at pagkatapos ay kumusta, mundo, at pagkatapos ay isa pang bracket p ng paalam, mundo, Gusto naming magkaroon ng dalawang mga bula darating off ng dito. Dahil ang mga ito ay parehong sa ilalim ng katawan, ngunit ang mga ito ay hiwalay na mga talata kasong ito. May tiyak na kasanayan sa na sa mga nakaraang pagsusulit, pati na rin ang maraming online dito. OK kaya, nagbibigay-daan ito lamang amin makita ang lahat ng mabuti at manipulahin ang mga bagay napaka sistematikong. OK? Alam namin kung paano mismo sa pagtawid sa pamamagitan ng punong kahoy na ito, upang malaman namin kung ano ang gusto naming i-access. OK kaya ito ang dahilan kung bakit gusto naming na magkaroon ng ganitong uri ng modelo, upang maaari naming gamitin ang mga bagay na tulad nito, at naiintindihan namin kung ano ang ibig sabihin ng mga ito, at ang mga ito ay standardized sa lahat ng mga bagay na ginagawa namin. Kaya pamagat tuldok dokumento lamang ang pamagat ng our-- lahat ng mga ay medyo sarili paliwanag, Gusto kong isipin. Kaya ang unang tatlong mga halimbawa ang sinasabi lang, "OK, ibigay lamang sa akin ang pamagat ng web page na ito. " Kaya ito ay magbibigay sa iyo kung ano ang ay tumutugon sa pamagat. Tuldok dokumento katawan ay pagpunta sa magbibigay sa iyo ng kahit anong ay sa loob ng mga body tag. Kaya maaari mong manipulahin ang mga iyon. At body tuldok dokumento na tuldok magpasok ng HTML ay isang napaka-cool na isa, at marahil ay hindi tulad ng sobrang madaling maunawaan, ngunit ang panloob na HTML tumutugon sa karapatang ito dito. Kaya kung sakaling nais mong manipulahin ang teksto sa isang pahina, Karaniwang na iyong pupuntahan ginagawa isang bagay na may body tuldok panloob na HTML. OK? Kaya panloob na HTML ay may gawi na mag-refer sa kung ano ang talagang sa pagitan ng mga tag na ito. OK? At pagkatapos ay kapaki-pakinabang function. Kaya kung nais mong makakuha ng alinman sa mga ito, ang anumang mga elemento, mayroon kaming ilang Id, klase pangalan, o pangalan ng tag. Ito ay halos kapareho sa bagay na aming ginawa sa CSS, tama? Kung saan mayroon kaming ilang mga tagapili na tumugma sa alinman sa isang tag, isang klase na nagbibigay namin ang mga ito, o isang Id. Ito ay napaka halos parehong paraan. Kung mayroon kang isang bagay na May ilang klase ng aso, at sabihin mo sa mga elemento ng name tag, at mong ilagay ang aso sa there-- o paumanhin, Pangalan ng klase. Maaari mong ilagay ang tuldok doon. Ito ay pagpunta upang bumalik sa lahat ng mga mga elemento sa iyo na magkaroon ng klase na iyon. Kaya maaari mong manipulahin lamang ang mga naka. Sa parehong paraan, maaaring mo lamang Gusto upang manipulahin ang ilang mga header, kaya ilang h1 header, tulad ng ginawa namin. Maaari mong gawin makakuha ng mga elemento sa pamamagitan ng tag pangalanan, dahil h1 ay isang pangalan ng tag. At sa parehong paraan, kung nais mong makakuha ng sa ilang mga natatanging bagay, maaari mong gawin get tag. Kumuha ng mga elemento sa pamamagitan ng Id. At ang mga ito ay aktwal na ng maraming mga ito. Ang mga ito ay tulad ng tatlo sa napaka maraming lamang. Kaya kung mag-online, bilang Pupunta ako sa hinihikayat mong gawin, at gawin ang ilang mga pananaliksik sa iyong sarili, Ako siguradong inirerekumenda Tinitingnan ang lahat ng mga iyon. Maaaring maging sobrang kapaki-pakinabang, lalo na kapag nais mong lamang uri ng manipulahin napaka-tukoy na bagay nang hindi na kinakailangang upang pumunta sa pamamagitan ng at subukan upang i-parse out ang lahat. OK, kaya ang huling bagay ay ang JavaScript kaganapan. Kaya kapag ako ay pakikipag-usap ng mas maaga tungkol sa pagpunta sa isang website, at kapag hover ka sa isang bagay, o ang iyong mouse sa ibabaw nagho-hover ang isang bagay, ibang bagay ang mangyayari. Ito ay kung ano ang gusto naming isipin ang tungkol sa bilang isang kaganapan. Kaya kung ano ang mayroon kami na maaaring maging kapaki-pakinabang dito ay onclick. Kaya mina ay noong hover, na kung saan, ako ay medyo sigurado, ay isa lamang sa mag-agaw-buhay. Gayundin isang tonelada ng mga na maaari mong hanapin. Mayroong isang buong listahan ng online ng iba't-ibang mga bagay na maaari kang makinig para sa. Ngunit kaganapang JavaScript ay talaga lang sa pagtugon sa mga bagay na ang iyong mga user ay ginagawa. Mag-right? Kaya ang iyong mga user ang ginagawa isang bagay, na ang isang kaganapan, at JavaScript na tutugon gayunpaman gusto mo ito sa. Ito ay tumugon nang naaayon. Kaya sa kasong ito, mayroon kaming ang ilang mga window ng tuldok onload. Kaya kung ano ang sinasabi ay, "maghintay hanggang-load ang window ng. " OK? Kaya kapag ang lahat ng na-load, onload, pagkatapos ay maaari mong isagawa ang function na ito. Kaya kapag ang lahat ng -load, na iyong pupuntahan na magkaroon ng ilang mga pindutan sa paghahanap na nakakakuha isang elemento ng Id, at ng mga kopya nito ang anumang na elemento ay kasing ang pindutan ng Paghahanap. At pagkatapos ay mayroon kaming na ito variable, sabihin namin, "OK, onclick." Kaya kapag marinig namin ang isang pag-click sa pindutan ng Paghahanap, isagawa ang function na ito, na isang alerto, nag-click ka sa pindutan ng Paghahanap. Kaya kung ano ang mangyayari is-- ito ay isang magaling maliit na graphic na representasyon dito. Kaya nag-load ang aming mga dokumento, na aming onload, nakita namin ang aming Paghahanap pindutan, na ito. Naghahanap kami para sa aming mga pindutan ng Paghahanap. At pagkatapos ay kapag ang pindutan ng Paghahanap ay -click, ito ay tumutugon sa dito mismo. Onclick. Pagkatapos ay sa wakas kami alertuhan ang aming mga user, na ito huling linya dito. OK? Kaya bawat isa sa mga apat na hakbang lamang ay tumutugon sa apat na mga kahon down na doon sa ibaba. Ba na magkaroon ng kahulugan sa lahat? At pagkatapos ay isang bagay na ako lang ang pagpunta banggitin napaka, napaka-maikling, na aking Hinihikayat ka guys sa sasamang Mas mukhang sa ay jQuery, na isang library lamang na binuo batay sa JavaScript. Ito ay sobrang kapaki-pakinabang, bilang sa karamihan ng mga library. Maraming mga pag-andar. Kaya kung mayroong kailanman ng isang bagay na ang gusto mong gawin sa JavaScript, ang iyong unang katutubong gawi hindi dapat mag-isip ng, "kung ano ang function na dapat Code ako? "Ito ay dapat, "Hayaan mo akong makita ang isang tao ay tapos na ito para sa akin. " Dahil siyam na beses sa labas ng sampung, ang isang tao ay ginawa nito, at sila ay marahil ginawa ito ng mas mahusay. Mga Tao gastusin ng maraming oras paggawa ito, at JavaScript ay napaka-karaniwang ginagamit, kaya mga tao ay patuloy na sinusubukan mong gumawa ng mas mahusay na ito. At jQuery ay may maraming mga pag-andar iyon ay malamang na maging kapaki-pakinabang sa iyo sa inyong huling proyekto kung ikaw ay paggawa ng anumang bagay na may disenyo ng web. Tulad ng gusto kong sabihin, "trabaho mas matalinong, hindi mahirap. " Kung ikaw guys gawin iyon, ito ay mahusay. Kapag handa namin sa hackathon gagawin ko hindi nais mong maging ang lahat ng stressed out. Gusto kong mong maging katulad ng, "Nakatanggap ako na ito. jQuery ay nakuha ko ang aking likod. Hindi ko na kailangang magsulat ng mga function. " Kaya lang ang dalawang bagay upang tandaan, pupuntahan ko upang ipaalam sa iyo guys tumingin nang higit pa sa jQuery sa inyong sarili. Ang lahat ng mga pupuntahan ko sabihin ay ito ang ilang mga Kahanga-hanga bagay at maaaring gumawa ng iyong buhay marami mas madali. Ngunit ano ang gusto mong mayroon ay kahit anong file na iyong pupuntahan upang gamitin ito sa, ka ng pagpunta sa gusto ang dalawang linya. Ikaw ay pagpunta sa gusto ang script ng js jQuery js tuldok. At talagang iyong mapagkukunan ay magiging ilang mga URL. Kung jQuery Google, ang Google talaga nagho-host ng lahat ng mga file para sa iyo. Kaya gusto Siguradong sa -input ang URL na iyon sa halip. Ilagay ko lang ito dito alang-alang sa pagiging simple ng. Ang lahat ng mga ibig sabihin nito ay kung saan upang hanapin ang iyong jQuery library. Ito ay napakalaking, kaya hindi mo nais na upang i-host ito sa iyong sariling computer kung maaari mo itong iwasan, na kung saan ay kung bakit namin may posibilidad na lamang ilagay sa URL ng Google na Nagho-host ang lahat ng mga file na ito para sa iyo. OK? Mo ang Google ito, nangangako ako ito ay magiging doon. At pagkatapos ay ang anumang JavaScript file na ikaw ay ginagamit, kaya ito ay lamang ng ilang panlabas JavaScript file na iyong ginagamit. Sa parehong paraan na link namin sa aming CSS mga file, ito ay pareho uri ng bagay. Ito lang ang nagli-link sa file kung saan ang iyong JavaScript ay. At Mayroon akong ilang mga halimbawa may mga simpleng JavaScript. Kaya naming mag-i-pagpunta sa pamamagitan nito. At pagkatapos ay sa iyong index JavaScript, na ang iyong JavaScript maghain dito, ito ay uri ng damit-pambahay ng babae na mayroon ka para sa jQuery. Malapit ka 99.9 porsiyento ng oras ng pagpunta na magkaroon ng ito sa iyong index.js file. Dahil kung ano ang sinasabi ay, "Huwag isagawa ang anumang bagay hanggang sa iyong dokumento ay talagang handa na, "kung saan ay kung ano mismo ang gusto mo. Dahil kung ang iyong dokumento ay hindi handa na, at jQuery nagsimula ang paggawa ng mga bagay, ito ay isang gulo lang. Kaya gusto mo laging magkaroon ito wrapper. At pagkatapos ay para sa mga bagay na pumunta sa doon, ako ay umalis sa sariling perusing iyong guys '. OK, kaya ang naroon kanan anumang mga katanungan ngayon tungkol JavaScript sa pangkalahatan? O ang modelo ng DOM? Kung hindi, mayroon kaming ilang mga magandang mga halimbawa na maaari naming pumunta sa pamamagitan ng, na guys makakatulong sa akin code. Pero pupuntahan ko rin na maging sobrang maganda, at kung ayaw mong sabihin ang anumang bagay para sa mga ito, na fine. Maaari ko rin lang magbibigay sa iyo ng mga halimbawa. Ngunit ang anumang bagay sa PowerPoint bago ilipat namin sa? Ayos. Nararamdaman kong kailangan mo guys sa enerhiya. Kaya sa tingin ko kami ay pagpunta sa simulan sa aking partido unang halimbawa. Mayroon kaming tatlong halimbawa, mayroon kang ang iyong pinili. Kaya mayroon kaming orasan, na kung saan kami ay pagpunta upang ipatupad ang isang aktwal na orasan na pagpunta sa i-update ang bilang napupunta sa pamamagitan ng oras. Mayroon kaming na ito mahusay na pag-andar Twitter. This-- alam mo kung ano, hawakan. Kami ay pagpunta sa gawin ito pumunta ang layo. Bam. OK. Mayroon kaming na ito mahusay na pag-andar ng Twitter dito, that-- Alam ko, tama? Ito ay magiging mahusay. Sigurado ka guys ay nasasabik? Iyon ay pagpunta upang mabilang ang bilang ng mga character na iyong iniwan, kaya kung nagta-type ako ngayon, Malinaw na sinasabi nito pa rin 140, ngunit alam namin na hindi ito ang kaso. At pagkatapos ay sa aming mga huli dito, i-click dito upang i-party. Ano ang nangyayari sa mangyari ay kapag namin i-click, ang background ng pagpunta upang baguhin ang kulay. Kaya mo guys mayroon ang iyong mga pagpipilian ng kung alin ang gusto mong gawin muna. Nangangako ako Kukunin ko mas madali sa iyo. Pakiramdam ko ay tulad ng lahat ng tao ang uri ng lang napakababang key ngayon. Kaya kukunin ko na ituturo sa iyo kung paano ay ipapatupad namin ang lahat ng mga ito. Kung nais mong tunog ng relos in, mabuti iyan, ngunit ko parang lahat ng tao ay isang maliit na pagod. Kaya ko makikita lamang ituturo sa iyo sa pamamagitan ng mga halimbawa. Mayroon ba kami ng isang bagay na nais naming gawin unang? Sinuman? Walang kagustuhan? OK. Alam mo kung ano? Humihingi kami sa party. Pakiramdam ko ay tulad mo guys kailangan ng little-- kaya, ipapakita namin unang gawin ang isang partido. OK. Kaya kung ano ang mayroon kaming here-- na Hindi dapat na maging doon. Ngayon ay mabuti. OK. Kaya kung ano ang mayroon kami dito ay lamang ang simpleng HTML na pahina na iyong guys ay dapat na sobrang lahat pamilyar sa mula sa iyong huling dalawang psets. mayroon kaming uri ng doc dito. Maaari makita ng lahat ang? OK. Ayos. Mayroon kaming aming HTML malinaw naman. Mayroon kaming ilang mga header na -link sa isang style sheet na ginawa lamang maganda ang aking font at malaki at naka-bold. Kaya huwag mag-alala tungkol sa na. Mayroon kaming ilang mga katawan na may isang Id background, OK? Dahil kami ay magiging pagbabago ng background. Kaya kapag namin binabago ang background ng aming katawan, tandaan namin mula sa dalawang linggo nakaraan kapag pagharap namin sa mga web page. Kaya magandang upang magkaroon iyon. At mayroon kaming ilang Id ay katumbas ng partido. Ito h ref pound ay nangangahulugan lamang na ito ay pagpunta sa pumunta sa parehong pahina. At i-click dito upang i-party, na ang dahilan kung bakit kapag nag-click namin ito, Dapat itong baguhin sa kulay, Sa kabutihang palad. At pagkatapos ay mayroon kaming ilang script dito na ay naka-link lamang sa partido tuldok js file, iyon ay walang laman dahil hindi pa kami tapos kahit ano pa. At ito ay kaya malungkot. Ngunit sa lalong madaling panahon, ito ay baguhin kulay, at ito ay magiging kahanga-hanga. Kaya ako lamang ng pagpunta sa ituturo sa iyo guys sa pamamagitan ng kung paano namin maaaring lapitan ito. Kaya ang unang bagay na Maaaring gusto naming gawin, kung ang pagbabago ay namin ang background ng katawan, ang unang bagay na maaari naming gusto gawin ay talagang grab kung ano ang katawan ay, i-right? Kaya gusto naming magkaroon ng kabuuan, ang aming background, at kung napansin mo, Ko lang ang awtomatikong magsimula lamang sa pagta-type. Wala espesyal na iyan namin kailangang gawin para sa aming mga file sa JavaScript. Maaari ba akong magsimula deklarasyon variable, at nagpapahayag random na pag-andar. At ito ay mas libreng form. Ito ay tulad sa C, ibinigay namin sa iyo ang lahat ang mga matitigas na mga panuntunan, at lumaki, kaya hindi namin tulad ng, "pumunta balik. Mag-libre. Gawin kung ano ang gusto mo. " At iyon ang JavaScript. Kaya mayroon kaming ilang background dito. Sa aming modelo ng DOM, alam namin namin Maaari gawin tuldok dokumento makakuha ng elemento, at kung napansin namin dito, ang aming mga katawan ay may Id. Mag-right? Kaya maaari ko kami makakuha ng dokumento sa pamamagitan ng Id, at narito ang isang simpleng isa. Ano ang aming Id na gusto naming dito? Madla: Background. Allison BUCHHOLTZ-AU: Background. Perpekto. At semicolon sa dulo. Na hindi pa nawala ang layo. Kailangan mo pa rin ang iyong mga semicolon. OK. Kaya na ang aming una. At kapag nag-click kami ng isang bagay, kami Gusto ng isang bagay na mangyayari, i-right? Kaya maaari naming nais ng ilang mga variable na naghihintay para sa isang pag-click. Ano kami ay pagpunta sa gawin ay kami ay pagpunta sa gawing mas katulad ng aming link sa isang pindutan. Kaya kami ay pagpunta sa may ilang mga pindutan na ay katumbas ng idokumento ang tuldok na makakuha ng elemento ng Id. At kung ako pinag-uusapan ng mga i-click ang link o i-click dito upang Party link, ano ang maaaring aking Id na naririto? Party. Tamang. OK hindi masyadong masamang sa ngayon. Makakuha ng lahat ng tao kung anong ginagawa namin? OK, kaya ngayon mayroon namin ang aming pindutan, at gusto naming mga bagay na baguhin kapag nag-click kami dito. Kaya kung tandaan namin mula sa aming PowerPoint, napaka-simpleng bagay na maaari naming gawin ay tuldok lang ang button onclick, tama? At na pupuntahan katumbas ng ilang function. Ito ay isang hindi nakikilalang function. At ito as-- lang talaga ako pagpunta sa gawin ito ng isang maliit na mas malaki. Kaya kung ano ko lang ginawa dito ay ako na nagsasabi, OK, kapag nag-click namin ang aming mga pindutan, na ang link na ito na lamang ang tinutukoy namin na, pupunta kami upang maisagawa ang hindi kilalang pag-andar na ito. Hindi namin kailangan ang anumang mga input. Hindi namin pakialam kung ano ang sinasabi ng user. Kapag nag-click sila dito, hindi namin pagpunta sa gawin ang anumang gusto namin, na baguhin ang kulay ng background. OK? Kaya na ang dahilan kung bakit wala kaming anumang mga input, mayroon lamang namin ang hindi kilalang pag-andar na ito. At ngayon talagang kami ay pagpunta isulat ang mga function na ito. Kaya mayroong isang bungkos ng mga paraan sa iyo maaaring bumuo ng isang random na kulay. Ang paraan na aking ginawa ito ay upang bumuo ng tatlong mga random na numero at i-convert ito sa isang RGB triple. Kaya ito ay nagpapakita lamang sa iyo ang ilang mga magandang mga bagay na kung ikaw ay tulad ng, "oh, Kailangan ko upang bumuo ng isang random numero. "kung Googled mo ito, ito ay kung ano ang gusto mong hanapin. Kaya mayroon kaming tatlong iba't ibang mga bagay, var, hindi muli pula, berde. Mag-right? Kaya mga ang tatlong mga bagay na bumubuo ng isang kulay. Asul, pula, at berde. Ayos. At kung ano ang maaari naming gawin ay na alam namin na ito ay kailangang nasa pagitan ng 255, at kung ikaw ay tumingin up ng ilang random na numero generator, maaari kang makakuha ng isang bagay tulad ng matematika tuldok random, na kung tiningnan mo ito up bumalik sa ilang mga numero sa pagitan ng zero at isa. OK? At kung ano ang mga numero gawin ang aming RGB triples pumunta sa pagitan? Zero at kung ano? Ano ang maaari nilang pumunta hanggang sa? 255. Kaya kung math tuldok random napupunta sa pagitan ng zero at isa, kung paano maaaring gusto naming i-convert ito? Madla: Oras? Allison BUCHHOLTZ-AU: Oo, eksakto. Kaya oras ay 255. Madla: [hindi marinig] Ito ay tulad ng [hindi marinig]. Allison BUCHHOLTZ-AU: Math tuldok random. Madla: Cool. Allison BUCHHOLTZ-AU: Oo. Lamang ay tumatagal ng pag-aalaga ng JavaScript ng sa iyo. OK. Kaya maaari naming gawin iyon para sa lahat ng mga ito. Mag-right? Tuldok Math random na beses 255. Kopyahin iyon. Ayos. Kaya ang bagay ay, ito ay maaaring hindi nagbabalik ng isang integer. Mag-right? Siguro makuha namin ang ilang mga numero sa pagitan ng zero at isa, at ito ay nagiging sanhi ito upang maging bahagyang -off, at ang aming RGBs ay hindi maaaring maging sa kamay. Kailangan nila upang maging ints. Kaya kung sinubukan mo ito, marahil nais May ilang mga mali-mali pag-uugali. Ito ay isang maliit na funky. Kaya kung ano ang ginagawa namin ay gusto naming makasiguro Tiyakin na ang mga ito ay bilugan, at maaari mong isalin ang alinman paraan. Bilugan kong may floor. Kaya palagi kong ginawa bang na nai-round down. Ngunit pagpunta off kung paano simple ito ay upang makakuha lamang ng random na numero, paano sa tingin namin maaari palapag ang numerong ito? Ito ay halos katulad na. Anumang mga ideya? Kaya kung random ay isa lamang sa math tuldok random, kaya huwag tingin mo gusto naming gawin sahig? Math tuldok palapag. At maaari mo ring gawin matematika tuldok kisame. Round ay uri ng hindi maliwanag dahil hindi mo gusto alam kung paglilikom o isalin pababa. Kaya karaniwang palagi naming gawin matematika tuldok palapag, matematika tuldok kisame. Ngunit honestly-- Madla: down na ba palapag na round? Allison BUCHHOLTZ-AU: round down na palapag. At iyon ay isang pagpipilian lang sa aking bahagi. Kaya ngayon mayroon kaming tatlong numero na random na binuong, at kung ano ang namin ang pagpunta sa gawin ngayon ay hindi namin lamang ng pagpunta upang baguhin ang background. OK? Kaya namin na mayroon ang aming background uri ng naka-imbak na sa elementong ito na tinatawag na background. Kaya kung ano ang mapapansin mo ay, kung ang i-play sa paligid na may ito, gusto naming baguhin ang estilo. At ito ay uri ng isang bagay na Gusto mo ang Google at malaman kung, i kung paano baguhin ang kulay. Ngunit ang paraan na-access mo ang kulay na ito ay tuldok na background background style na tuldok. Kaya ito ay nagsasabi ibinigay sa bagay na ito, background, na tumutukoy sa na elemento Id up doon, kami ay pagpunta sa tumingin sa estilo sa loob ng mga estilo, kami ay pagpunta sa tumingin sa background. OK? At kung pumunta at hanapin ito up, maaari itong gumawa ng kaunti pa sa kahulugan, ngunit ito ay isa lamang lamang na nagsasabi, "Ninyo akong bigyan ito napaka-tukoy na katangian ng kung ano ang iyong tinukoy ko kanina. " Kaya kung ano ang namin ang pagbabago nito sa ay ilang RGB, sapagkat ito ang may katuturan. Ginagamit namin RGB triples, tama? At have-- namin na gusto kong tiyakin ko makuha ang tamang bilang ng mga quote sa dito. Kaya kung ano ang ginagawa namin ay mayroon kaming RGB, at kami ay pagpunta to-- ito ay tulad ng pagdudugtong, na kung saan ay pula. At pagkatapos ay gusto namin ang ilang mga kuwit. At pagkatapos ay nais naming plus berde, pagkatapos ng ilang kuwit, at ang ilan ay asul. Kaya mga plus lang ibig sabihin tulad ng pagdudugtong. Kaya ito ay ang paggawa lamang ito string na nangyayari sa loob ng RGB. OK? Madla: [hindi marinig] plus pagkatapos ay ang berdeng plus pagkatapos ay ang pula. Allison BUCHHOLTZ-AU: Oo, dahil messed ko na up. Masarap na ng isang tao. Oh, hawakan. Hindi. Dahil ang kailangan ko upang tiyakin na nakuha ko ang lahat ng karapatan mga ito. Kaya ako ay ipaliwanag sa Mga Nagkakaisang Bansa momento. Berde, asul, perpekto. Ngayon ko na. Naniniwala ako. OK. Kaya kung ano ito ay, ay background na Mawawala na itatakda sa ilang mga string. Mag-right? Alin ang kung ano ang mayroon kami dito. Ito ay magiging ilang RGB 255 kuwit 255 kuwit zero, o anumang bilang ka mayroon doon. Kaya ang ginagawa namin dito, mayroon kaming ilang mga string. At kung ano ang gusto naming gawin, ay hindi namin pabagu-bagong uri ng paglikha na kung kailan namin aktwal na patakbuhin ang program na ito. Kaya ito ay ang ilang mga string. Plus concatenates ito sa ang halaga pula na may, concatenates na ito ng kuwit, na concatenates ito may kung ano berde, at iba pa, at nakalagay ito. OK? Hanggang sa dulo, na ang pagsasara ng mga panaklong ng RGB dito. OK? Kaya kung ano ito ay pagpunta sa bumuo ng ilang command na talaga na RGB ng tatlong numero background na nakatakda ngayon sa. OK? Kaya sabihin makita kung ito ay gumagana. Umaasa ako na ginagawa nito, dahil kung ito Hindi, pupuntahan ko na maging tunay na malungkot. Ay naku. OK, hawakan. Talagang background tuldok estilo background na tuldok. Siguradong ako nawawala isang bagay lang maliit. Huwag mo guys mapoot na? Kapag ito ay lamang ng isang maliit na maliit na error? Makapangyarihan sa lahat background. RGB. Madla: [hindi marinig] Allison BUCHHOLTZ-AU: Hindi. Sinubukan ko ito bago klase. Mayroon akong lahat ng ginawa ko bago klase kung sakaling ako ay tulad, "Maghintay, kung ano ang ginawa ko mali?" Dahil ako ay tulad ng, "ako'y marahil Nagkamali up ito sa isang punto. " Plus berde. Lahat kamukha ito concatenated tama. OK. Madla: [hindi marinig] Allison BUCHHOLTZ-AU: Oh, mayroong kang pumunta. Iyon ang aking kailangan. Tumingin sa na. Tiffany upang iligtas. Perpekto. OK. Ngayon tingnan natin kung gumagana ito. Oh aking Diyos. OK. Sandali. Madla: Space matapos ang ikalawang plus. Allison BUCHHOLTZ-AU: Aling isa? Oh maghintay, hawakan. Space wear? Madla: Ikalawa plus sa ang berdeng pagdudugtong. Allison BUCHHOLTZ-AU: Oh. Madla: Walang espasyo pagkatapos ng plus, oo. Allison BUCHHOLTZ-AU: mo hindi na kailangan iyon, but-- Madla: Oh, hindi mo gusto? Allison BUCHHOLTZ-AU: Mukhang medyo. Madla: OK. OK. Allison BUCHHOLTZ AU: Tingnan natin kung ito gumagana Hayaan. OK. Malinaw naman ako nabibigo sa demo, na reminds sa akin ng isang panayam ang iba pang mga linggo, ngunit alam ko na ito ay gagana. Alam ko na ito ay gagana. Kaya malapit. Maliban Hindi ko sinasadyang natanggal ang aking mga script sa isang ito. Hindi, ito ay party na tuldok js. OK hawakan. Pupunta ako sa kopyahin ito, at din ako lamang ng pagpunta sa tanggalin ang lahat ng bagay, dahil nagkaroon ako ng trabaho na ito nang mas maaga. Nangangako ako ito gumagana. Kung hindi, ipapakita ko sa iyo kung ano ang Tommy ay. At doon. Madla: Ikaw ay tumutukoy sa partido tuldok CSS, at ito ay isang partido na tuldok js. Allison BUCHHOLTZ-AU: Ah, well dito mismo ay party na tuldok js. OK, ano ang gagawin ko naiiba? OK, ipapakita namin makita kung ito ay gumagana na ngayon. Bam. Kaya, hindi ko alam kung ano ang aking ginawa sa ibang paraan, ngunit ito ay kung ano ang dapat mangyari. Medyo cool. -Click ako sa ito, tulad ng, magpakailanman. Ngunit maaari naming subukan at tingnan kung ano ang aking ginawa sa ibang paraan na nagkaroon ng isang ito. Hindi ko alam tungkol sa iyo guys, ngunit ito mukhang talaga kung ano lamang na sinulat ko. Nagkaroon marahil ang isang nawawalang semicolon sa isang lugar ang aking bagay. Sa totoo lang pagkatapos, sa tingin ko ako ay nawawala may semicolon karapatan dito talaga. Ngunit hindi ko makita ito dahil ito ay off ang screen. Ngunit kung napansin namin, ito ay medyo magkano eksakto kung ano lamang na sinulat ko. Sa tingin ko marahil ang hardest bahagi tungkol sa ito lamang ang uri ng bagay na ito sa dito, pag-unawa kung ano ang ginagawa nito doon. Ang mga uri ng mga bagay na matutunan mo talaga lang sa pamamagitan ng Pag-Google at matapat lamang sinusubukan. Kung sa tingin mo may ilang mga katangian, mayroong ay malamang na. Kaya subukan ito. Tingnan kung ano ang mangyayari. Tulad ng sinabi ko, maraming ng -e-eksperimento gamit ang JavaScript, at PHP, at ang lahat na mga bagay-bagay, at CSS lalo. Iyon ay ang tanging totoong paraan upang maunawaan ito. OK, kaya pagkatapos na ganap na kabiguan sa partido tuldok js, mayroon kaming dalawang iba pang mga pagpipilian. Mayroon kaming orasan o Twitter. Ang mga ito ay parehong kawili-wili. Siguro hindi pa masyadong bilang masaya bilang partido, na kung saan ay nagkaroon ng isang maliit na cool na strobing bagay sa dulo. Ka guys Mayroon ba ng anumang mga kagustuhan? Madla: Orasan? Allison BUCHHOLTZ-AU: Orasan? OK. Ayos. Kaya muli, mayroon kaming Walang laman ang JavaScript file. At tulad ng nakikita namin dito, namin May ilang mga napaka-simpleng HTML. Mayroon kaming aming style sheet, na lamang format kung ano ang dapat itong parang. Mayroon kaming aming div sa isang Id ng orasan, na lamang nagsasabing, "ito ay dapat na isang orasan." At mayroon kaming link sa aming mga JavaScript file na aktwal na pagpunta sa bumuo ng aming orasan para sa amin. Dahil ang mga cool na bagay, ay maaari kang itakda ang JavaScript upang awtomatikong i-refresh ang sarili nito. OK? Kaya sa halip na naghihintay para sa user upang maabot ang I-refresh sa pahina sa gayon ay maaari kang makakuha ng -update ang oras, JavaScript Maaari itong i-update gayunpaman ito ang may gusto. Kaya, tulad ng sa aming huli, gusto naming upang ma-access ang aming mga background, i-right? Kaya kung ano ang tingin mo ay maaaring ang ang unang bagay na gusto naming gawin dito? Kung uri ng kami ay pagpunta off ang ganitong uri ng tularan dito? Malamang na gusto naming -access ang aming orasan, i-right? Kaya, mayroon kaming ilang var orasan, na equals-- ano ang sa tingin namin ito ay magiging? Dokumento na tuldok makakuha ng elemento by-- ko rin Gustung-gusto Sublime-- Id at ang aming Id ay orasan. Semicolon. Nakuha ko upang matiyak na makakuha ng mga semicolon oras na ito, dahil nararamdaman kong iyon ang problema huling beses. OK kaya, bilang ay lamang na sinasabi ko sa sinusubukan magkaroon JavaScript i-refresh ang sarili nito, may mahusay na ito function, ako Alam ito ay dumating sa madaling-gamiting nakaraang taon, Hindi ako sigurado pagdating sa madaling-gamiting para sa pset, ngunit ito ay tinatawag na hanay agwat. At ito ay ang tunay talaga cool na kung ikaw guys gumawa ng anumang bagay may oras o pagkuha ng -update na impormasyon. Sa isang website para sa isang huling proyekto, ito ay marahil isang function na gusto mong makakuha ng napakabilis alam. Kaya kung ano ang nakatakda agwat ng ginagawa ay na pupuntahan namin upang bigyan ito ng isang function, at kung gaano kadalas ito dapat tawagan ang function na ito. OK? Kaya sa kasong ito, lamang kami ng pagpunta sa lumikha muli ng ilang mga pag-andar ng hindi kilalang, OK, na pagpunta upang makakuha ng ang aming petsa, at ang aming oras, at pagkatapos ay i-update ang mga bagay at ipakita ito. Kaya kami ay mag-alala tungkol sa na. Patuloy kaming makikipag tulad makabuo ng orasan dito. Ngunit kung ano ang kailangan namin ay paano madalas upang i-refresh ito. Kaya sa kasong ito, ito ay lamang millisecond. Kaya namin lamang ng pagpunta sa gawin 100 millisecond. Siyempre, ganap na arbitrary. Kung gusto mo itong i-update mas mabagal, maaari mo. Maaari Nagkamali sa paligid sa hanay agwat, kung gaano kalaki ang aming agwat ay pagkatapos namin isang gumaganang orasan, na sana ay idedetalye ko makapunta sa. Kaya ito ay sinasabi lang, "OK, tawag function na ito bawat 100 millisecond. " OK? Iyon lang ang ginagawa nito. Kaya kung ano ang gusto namin ang aming mga function na gawin ay gusto naming magkaroon ng ilang mga petsa at ilang oras ay kung ano ang kami ay pagpunta sa may. Kaya maaari naming magsimula sa aming ay katumbas ng petsa ang isang bagay, at ang aming oras ay katumbas ng isang bagay na hindi pa namin alam. O kaya naman talaga, kailangan lang namin ng petsa, dahil petsa ay pagpunta upang isama ang lahat ng bagay. Muli kung kamakailan mo lamang ang Google ng anumang bagay tungkol sa kung ano ang nais mong gawin, kung sumulat ka, "OK, Gusto kong makuha ang oras sa pamamagitan ng JavaScript, "ito ay magbibigay sa iyo ng mahusay na ito function na tinatawag na petsa get. Literal, karamihan sa mga bagay na nais mong gawin, Ang JavaScript ay pagpunta sa may ito ginawa para sa iyo na. Kaya literal tulad ng bagong makakuha ng mga petsa, na creating-- o bagong petsa, rather-- na kung saan ay pagbuo ng ang ilang mga bagay na iyon ay kumakatawan sa isang petsa. At kung ano ang pagpunta naming gawin dito ay ito is-- pupuntahan ko isulat ito, at pagkatapos ay ipaliwanag kung ano ang ginagawa nito. Kaya kukunin ko na matiyak na makuha ko na ito ng tama. OK, kaya kung ano ang function na ito ginagawa, ay hindi namin lamang paglikha ng HTML na talaga pagpunta sa pumunta sa loob ng aming div Id ng orasan. Kaya kung ano ito ay pagpunta sa ginagawa ay bumubuo ng lamang ng ilang mga string, OK? Iyon ay pagkatapos ay magiging transplanted sa aming HTML. Talaga kung ano ang pagpunta sa gawin ay kahit anong we-- kung ano ang ipapakita ko sa iyo ay na kung ano ang sinasabi namin HTML ay, kami ay pagpunta sa palitan dito ang text na ito sa kahit anong HTML ay. Kaya ito ay pagpunta sa payagan amin upang baguhin ang aming orasan tuldok HTML mula sa pagiging lamang ang teksto ng ito ay dapat na isang orasan, upang aktwal na nagpapakita ng ang mga numero at mga bagay na mahalaga sa kami tungkol sa, at talagang maging singko ng hapon. Kaya kung ano ang namin ang pagpunta sa gawin ay kami ay pagpunta sa simulan ang pagbuo ng mga ito HTML. Kaya sa parehong paraan na aming ginagamit gawin plus ay katumbas para sa integer, Maaari mo na ngayong gawin iyon para sa mga string, maliban ito ay pagpunta sa pagdugtungin ang mga ito. Mag-right? Tulad ng nakita natin sa party na tuldok js, ito lamang concatenates ang lahat ng mga bagay-bagay. Kaya maaari mong pagdugtungin iba't ibang mga piraso ng HTML mula sa mga variable, o mga piraso ng string na sinulat mo out sa iyong sarili, at ito lamang talaga ay nagbibigay-daan sa iyo upang masiglang bumuo ng HTML, na kung saan ay medyo cool. Kaya kung mayroon kang isang bagay napaka-tukoy na user, Maaari itong daan sa iyo upang gawin iyon. Kaya mayroon kaming ng HTML, na pupuntahan ko subukan at matiyak na makuha ko na ito ng tama. Kaya kami ay pagpunta sa gawin ang ilang mga h1 header. Kaya kung ano ang mahalaga sa mapagtanto dito ay hindi ito aktwal na HTML lamang. Mag-right? Sumusulat kami aktwal na HTML code in dito, ito ay hindi lamang isang string sa normal paraan na nais naming isipin ang tungkol dito. Kaya mayroon kaming ilang mga HTML. Ito ay itinuturing na isang string dito bagaman. At ginagawa namin ang petsa dot-- namin nais upang makakuha ng aming oras. Muli, kung ikaw ay upang tumingin up anumang bagay tungkol sa petsa, ito ay sabihin sa iyo ang mga ito ay ang lahat ng ang mga katangian ng petsa na may. At narito kung ano ang maaari mong gamitin dito. Kaya marahil ito ay mga bagay tulad ng kumuha ng oras, at kumuha ng mga minuto, at makakuha ng ilang segundo, at makakuha ng millisecond, at may alam kung ano pa mayroon silang. Ngunit kung tiningnan mo sa dokumentasyon, ito ang lahat maging doon. Kaya mayroon kaming kumuha ng oras, at pagkatapos naming nais upang pagdugtungin na with-- ako pagpunta sa ilipat ito sa paglipas dito. Kaya kung kami ay bumubuo ng mga ngayon, hindi namin talagang bumubuo ng oras, tama? Mayroon kaming na oras, at pagkatapos ay kung ano ang sa pagitan ng oras at minuto? Mayroon kang isang tuldok-kuwit, tama? Kaya gusto naming gawin ang ilang mga tuldok-kuwit dito. At pagkatapos ay nais naming kunin ang aming minuto, kaya sa parehong paraan mayroon kaming petsa tuldok makakuha ng oras, kung paano maaaring makuha namin ang aming minuto? Ito ay literal na petsa na tuldok makakuha ng minuto, kung saan ako uri ng gusto. Ito ay tulad, "oh, paano ako makakakuha ng aking minuto? " Ko lang ang aking minuto. OK. At pagkatapos ay mayroon kaming isa pang tutuldok dito. At pagkatapos ay kung gusto naming makuha ang aming segundo, kung paano namin maaaring makakuha ng aming ikalawang? Petsa tuldok makakuha ng ilang segundo. Sa tingin ko ito ay medyo cool. At ano ang mahalaga sa Napagtanto, ay na rin namin kailanganin mong isara ang aming mga HTML tag dito, dahil dapat pa rin itong maging wastong HTML, kaya h1. Ayos. Kaya pagkatapos na, maaari naming gawin orasan tuldok panloob na HTML ay katumbas ng HTML. OK? Kaya tandaan kung paano ko sinabi panloob na HTML talaga tumatagal ng kahit anong ay sa pagitan ng dalawang tag na usapan natin ang tungkol at pagsingit o manipulates kahit anong ay nasa doon? Kaya kung ano ang ginagawa, kung kami bumalik sa aming mga orasan, ay ang orasan ay tumutukoy sa lahat ng bagay sa loob ng div. Ito ang panloob na HTML ng Id ng orasan div. At kaya ng pagpunta sa baguhin ito sa ang HTML na binuo namin, na kung saan, na, sana, sana, sana, ay ipinapakita ang oras ngayon. Susubukan naming makita. Siyempre. Kaya maraming mga teknikal na isyu. Just-- Allison na ako ay -off ang aking mga laro ngayong araw guys. OK, na gumagana. orasan tuldok panloob na HTML. Ito ay Talagang HTML? Gayundin ito ay kung ano ang mangyayari. Kapag hindi mo makita ang isang bagay, mo tingnan lamang sa iyong source code. OK. Huwag mong Nais mong malaman ng isang cool na trabaho sa paligid na kami ay pagpunta sa gawin dito mismo? Madla: Maaari mong gawin ang mga malalaking titik? Ang mga malalaking titik? Dahil mayroon kang makakuha ng oras, at pagkatapos ay kumuha ng ilang minuto. Allison BUCHHOLTZ-AU: Ito ay makakuha ng oras at get-- oh. Are-- mong gold star. Ang lahat ng ito ng isang pagsubok, guys. Ipinapangako ko ito ay gumagana bago klase. OK, ngunit may mga cool na malaman ang na maaari mong also-- kung minsan ang iyong mga panlabas na mga file ay pagkuha ng isang maliit na mabaliw, maaari mo ring lamang ilagay ang mga ito tuwid in dito, na may gawi na ayusin ang mga bagay. Maliban na ito ay tulad ng talagang pangit. Siyempre i-format ang lahat. Tiyakin na ang lahat ng ito kaakit-akit. OK. Nais kong gawin ang lahat ng mga cool na demo, at sila lamang ang hindi gumagana out. OK. Script var orasan. Pa rin, kung ano ang mahalaga ay na ito ay ang pangkalahatang paraan na nais mong i-format ang JavaScript. Tulad ng iyong nakikita, maaari itong maging napaka maselan minsan, kahit na ito ay literal nagtatrabaho ng dalawang segundo ang nakalipas. O kaya hindi dalawang segundo ang nakalipas, ngunit napaka, kamakailan lamang. Kaya upang ipakita sa iyo kung ano ang dapat itong parang, at upang ipakita sa iyo na hindi ako baliw, at na ang lahat ng bagay ay eksaktong parehong, ito ay kung ano ang dapat itong parang. Saan ka ng pagpunta sa gawin ito tuktok na bahagi dito, at kung titingnan mo ang page source, kung napansin mo, ginawa niya ang ilan Crazier bagay, pinasimple ko ito. Gayundin, kredito sa Tommy McWilliam, na aktwal na nakatulong akong lumikha ng mga halimbawang ito, na ang dahilan kung bakit alam ko gumagana ang mga iyon. Dahil Tommy ay isang master JavaScript. Ngunit kung napansin namin, mayroon kaming ilang mga hanay. Mayroon kaming ang aming mga orasan dito. Ito ay ang lahat ng JavaScript na Sinulat ni namin, o ilan sa mga ito. Sinulat ni lang namin ang isang ito dito mismo. At siya ay may dagdag na function na Pad lang ito pamamagitan ng paglalagay ng zero bago ang isang sulat o bago ang isang numero kung ito ay isa lamang sa mga ito. Kaya kung napansin mo, ito ay medyo magkano kung ano mismo ay nagsulat kami lang. Mayroon kang ilang mga orasan variable na May aming mga elemento, kumuha ng mga elemento ng ID, na orasan. Mayroon kaming aming hanay ng agwat function, na isang hindi nakikilalang function na na executes lahat ng ito. Ilang namin ang simula ng string ng Na namin pagkatapos ay dynamic na HTML bumuo pamamagitan ng pagkakaroon ng ilang mga h1 header, concatenating may kumuha ng oras, plus ang aming mga tutuldok, kasama ang pagkuha ang minuto, kasama ang isa pang tutuldok, kasama ang aming mga segundo, at panghuli ang pangwakas na HTML para dito. At pagkatapos ay i-update namin ang aming orasan tuldok panloob na HTML sa HTML, at i-update namin ang bawat 100 millisecond. OK? Tingnan nangangako ako hindi ako baliw. Hindi ko alam. Hindi ko alam kung bakit hindi ito sa akin gusto. Pakiramdam ko ay tulad ng hitsura ang parehong, ngunit tila Ayaw ito sa akin. Kaya tingnan natin kung pag-ikot ng tatlong napupunta mas mahusay. Kami ay tungkol sa upang makita. Hindi ako sigurado kung paano ito ay pagpunta sa pumunta. Ay lahat ng hindi bababa sa pagkuha ng cons, tulad ng pangkalahatang tema ng JavaScript, bagaman? Umaasa ako na hindi bababa sa kapaki-pakinabang, higit pa kaysa nagpapakita na ito ay isang maliit na maselan. Ngunit ang iyong set problema ay napaka-masaya. Ito ay magiging mahusay. Hindi nito lubos na bilang nakakapagod bilang na ito, palagay ko ay hindi. Makikita mo talagang makapunta sa tingnan talagang cool na mga bagay. Kaya huling ngunit hindi bababa sa, susubukan naming ang isa Twitter. Akoy 'talagang natakot ngayon, guys. Hindi ko alam kung paano ito ay pagpunta sa pumunta. Ngunit lamang upang mabigyan ka ng kaunti higit panlasa, at ito ay ang tunay ng pagpapatakbo string at input, kung ano ang pagpunta naming gawin ay, kung napansin namin dito sa HTML-- ang isang ito ay may kaunti more-- mayroon kaming ilang teksto na lugar, kung saan tumutugon sa teksto ng lugar na ito dito. OK? At na may isang Id ng teksto. Restyled namin ito nang kaunti na may ilang lapad at taas na ang paunang natukoy na namin, at kami H1, na lamang ang ating isang header na Kinakatawan ang aming mga character na natitira. Binigyan namin ito ng ilang Id ng natitirang mga character, at pagkatapos ay mayroon kaming ilang script dito, na talagang ako umaasa pangatlong beses ni ang kagandahan dito, guys. Kaya kung ano ang gusto naming gawin, sa parehong pangkalahatang lagay ng kalooban na nagawa namin sa orasan tuldok js at party na tuldok js bilang na napansin namin, ay sinimulan namin sa pamamagitan ng aktwal daklot ang mga bagay na aming nagmamalasakit sa, i-right? Kaya sa kasong ito, mayroong dalawang mga bagay na namin na nagmamalasakit sa, OK? Ang isang bagay na hindi namin aktwal na uri ng Tinitingnan at pagguhit ng data mula sa, at isang bagay na talaga naming binabago. Kaya ang aming HTML. Kung ito ay ang aming web page dito, kung ano ang ang data na aming tinitingnan? Ito ay magiging kahit anong ang teksto sa aming mga kahon, i-right? Kaya kahit anong nagta-type ako in dito. Iyon ay kung ano ang gusto kong malaman, o na kung ano ang gusto kong tumingin sa. At kung ano ang magiging pagbabago sa aming web page? Ang mga character na natitira. Kaya sa parehong paraan, nais naming magsimula sa pamamagitan ng Sinisimulan ang mga variable na aktwal na hawak sa mga elementong iyon. OK? Kaya kung mayroon kaming ilang var na aming text area, at mayroon kaming ilang var na natitira. Mag-right? Kaya ang mga ito ay pagpunta sa matagal ang dalawang bagay. Kaya ang parehong uri ng mga bagay, Ang dokumentong dot-- OK, ako ay pagpunta sa tiyakin na ito ay pagpunta sa gumana ang oras na ito. Ako ay napaka-matatag. OK, kaya kung gusto natin ang ating text area, ayon sa aming HTML, kung ano ang aming pantukoy? Ano ang aming Id? Lamang ito ay magiging teksto dahil ito ay lumilikha ng aming mga text area, OK, at ang aming Id ay teksto, kaya na kung paano namin maaaring grab kung ano ang doon. OK, semicolon. Pupunta ako sa maging sobrang tumpak tungkol dito, dahil gusto ko itong gumana oras na ito. OK, gawin ang parehong bagay, makakuha ng mga elemento sa pamamagitan ng Id. Talaga ako nagtataka kung ano ay sanhi ng iba pang mga dalawa hanggang Nagkamali. OK, at pagkatapos ay sa isang ito, kung ano ang gusto naming i-access? Ano ang dito ang aming Id? Mayroon kaming isa pang Id sa ang aming HTML, ano ito? Madla: Character natitira. Allison BUCHHOLTZ-AU: Natitirang mga character. OK. Ayos. Kaya ako lamang ng pagpunta sa isulat ito talagang mabilis. Lamang ako pagpunta sa isulat ito sa segundo. Kaya text area. Ano ang mga kawili-wiling ay B function-- doon Maraming mga function na hindi lamang tumutugma sa iyong mouse, ngunit ang iyong keyboard. OK? Kaya maaari mong sabihin kapag ang anumang key ay pinindot, maaari mong gawin ang mga bagay tulad na. Kaya ang isa na ginagamit namin ay tinatawag na sa key up, na nagsasabing, "kung pinindot ang anumang key sa iyong keyboard, kapag ang gumagamit ay itinaas ang kanilang mga daliri off ang pindutan na iyon, at ang mga key ay naging unpressed, pagkatapos kami ay pagpunta sa gawin ang isang bagay. " OK? Kaya ito ang may katuturan, tama? Dahil ang bawat karakter -type namin, kami ay pagpunta upang i-angat ang aming mga daliri off ng ito, kaya kapag naging up ang key, maaari naming malaman upang pagbawas ang aming natitirang mga character. Kaya mayroon kaming ilang mga susi sa up, at sa parehong paraan, kami ay pagpunta sa sabihin, "OK, kapag ginagawa namin na, kami ay pumunta upang lumikha ng ilang mga pag-andar na ay pagpunta sa tumagal e, "sa kasong ito, at ano ang gusto naming gawin ay kalkulahin ang bilang natitira. OK, kaya hayaan simulan lamang ni sa pamamagitan ng paglikha ng isang variable. Kaya mayroon kaming ilang mga r variable, na ang nangyayari upang kumatawan kung gaano karaming mga character na namin ang natitira. OK? Alam namin na sisimulan namin ang may 140, at kung gusto naming malaman, sabihin nating, ang haba ng string na naging input, gagawin mo guys mayroon kang anumang mga ideya kung paano namin maaaring gawin iyon? Batay lamang off ng halata mga bagay, tulad ng kung gusto naming oras, ginamit namin makakuha ng oras. Alam namin na ang aming object ay text area, ngunit maaari mo guys -isip ng kung ano ang maaaring dumating pagkatapos na ito? Ang anumang mga ideya? Kaya isa ito uri ng mas mababa madaling maunawaan, subalit ito ay halaga haba na tuldok. Kaya sumuko na lamang sa akin ang ilang halaga ng katangian na ay talagang ang haba ng ang string na ito. Kaya ito ay pagpunta sa sabihin, "OK, ako ako naghahanap sa ang buong string ng teksto sa loob ng lugar, at pupuntahan ko upang sabihin sa paano mo gaano ito kahaba. " Dahil kung tandaan namin string ay talagang lamang array, upang maaari naming lamang gawin ang mga haba ng mga ito. Kaya mayroon kaming na iyon. Ayos. Pagkatapos ay kung ano ang gusto naming gawin ay namin hindi kailanman nais na payagan ang user sa pag-input ng higit sa 140 mga character, tama? Dahil kung sasabihin namin tulad ng, "oh, mo May ganito karami ang natitira lang, " at pagkatapos ay hayaan silang gawin iyon pa rin, kami ay namamalagi. At ito ay isa pang bagay na JavaScript ay maaaring maging talagang magandang para sa, ay ang pagpapatunay ng gumagamit at tinitiyak na ang iyong Tama ang sukat ng gumagamit sa loob ng anumang mga panuntunan na iyong ibinigay sa kanila. Kaya kung nais mong gumawa ng mga bagay tulad ng paggawa ng Tiyaking ang isang tao ng pag-input ang kanilang mga email address, o siguraduhin na kapag sila ay maglagay ng dalawang mga password, naitugmang mga ito. JavaScript ay maaaring gawin iyon. Gusto mong gawin ang isang bagay tulad ng, "kapag ang form ay isinumite, "o katulad, "Kapag Isumite ang pindutan ng Form ay -click, suriin ang lahat ng mga bagay na ito. " At maaari naming gawin iyon JavaScript. Kaya ito lamang ay kung ano ang kami ay pagpunta sa gawin dito. Kaya kung ano ang maaaring maging isang paraan upang masuri kung sila na wala na sa paglipas ng 140 mga character? Ano ang nangyayari sa mangyayari sa ang aming halaga ng r kung susubukan nila? Ito ay magiging negatibo, tama? O ito ay magiging mas mababa kaysa sa o katumbas ng zero. Kaya maaari naming gamitin ang isang kung iyon ang gusto lang lahat ng iba pa. OK? At mayroon kaming ilang text area na tuldok halaga, at kung anong ginagawa namin dito ay namin cutting-- lang ano ito? Sorry. Isa ito, gusto lamang naming return false. I Kaka-lito. Lahat ng frazzled mula sa mga bagay na hindi gumagana. OK, gusto lang namin sa return false, at pagkatapos namin Gusto upang ipakita ang natitirang mga character, tama? Kaya may orasan, ginawa namin isang bagay na may panloob na HTML, tama? Saan kami itakda ito katumbas ng ilang variable, kaya kung ano ang maaari naming gawin dito? Ano ang mga pagbabago namin ang panloob na HTML ng? Madla: Natitirang? Allison BUCHHOLTZ-AU: Binabago namin ang natitira. Ang lahat ng mga karapatan, at kung ano ang ginagawa namin nais na itakda ito katumbas? Ito ay magiging r, dahil iyon ay dapat na ang aming natitirang mga character. OK? Kaya ako talaga kinakabahan upang makita kung ito ay gumagana na ngayon, ngunit gagamitin namin makita. Mag-iwan na ito. Iyan ay talagang mabilis. [Hindi marinig] OK. Muli, lang ako pagpunta upang ipakita sa iyo. Para sa anumang dahilan, minahan ay nagpasiya na hindi gumagana, ngunit kung ano ang ipapakita ko sa iyo ay na ito is-- oh ako ay dapat na ilagay na sa. OK, napansin namin ang parehong uri ng bagay dito, pagkuha ng mga text area. Gayundin, kung abiso tao, kung mayroong kailanman ng isang bagay na gusto mong gawin, at hindi mo alam kung paano gawin ito, i-click lamang ang View Source ng Pahina, at sila ay pagpunta sa sabihin sa iyo. Minsan mas mag-i-encrypt. Para sa iyong pset, i-encrypt namin ang lahat ng bagay, kaya ang hitsura lang ito tulad ng walang kuwentang. Ngunit kung mayroong kailanman isang talagang cool na website na gusto mo, kung iki-click mo lamang ang View Source ng Pahina, ito ay pagpunta sa sabihin sa iyo kung paano ito gawin. Kaya muli, mas mahusay na makapagtrabaho, hindi mahirap. At tulad ng nakikita mo dito, lahat ng mga bagay na ito ay pareho. ang isang ito dito lamang tumatagal ng ilang substring na iyon, nakalimutan ko kung ano mismo ang ginagawa nito. Pero malinaw naman tumatagal ng ilang substring ng halaga mula sa zero hanggang sampu, at ibinabalik false ano ang dapat itigil ang mga user sa inputting ngayon, at pagkatapos ay malinaw naman-a-update panloob na HTML doon. Ayos. Kaya malaki aways tumagal mula ngayon, eksperimento, tingnan ang source code dahil ito ang nangyayari upang matulungan kang maraming, at lahat ng tao, minsan JavaScript Maaaring maging mahirap upang gumana sa at hindi laging gagana sa paraang iyong inaasahan ito sa, ngunit panatilihin lamang sinusubukan dahil nangangako ako'y nito. Nangangako ako sa lahat ng mga halimbawa ay nagtatrabaho bago klase. Hindi ko maintindihan kung ano ang nangyari. Literal bang kumuha ng lahat ang parehong. Isa pang bagay na nais lamang ako sa ipakita sa iyo guys na maaaring maging kapaki-pakinabang super ay in-- kung ano ang gumagana bago? Hindi Mayroon kaming party sa trabaho, ay namin? Sa tingin ko kaya. Oo. Ginawa namin. Kahanga-hanga. OK, kaya ang isang bagay na ka guys ang dapat malaman ay ang log ng console na usapan ko ang tungkol. Kaya console tuldok log ng halo. Kaya ito ay uri ng JavaScript katumbas ng printf. Kaya kung sakaling nais mong siyasatin ang iyong mga variable o tingnan kung ano ang nangyayari doon, kung ano maaari mong gawin ay, kung siyasatin namin elemento, ay kung ano ang gusto mong pumunta sa, at pumunta ka sa console, makikita mo na ito nakalimbag halo. Kaya maaaring magkaroon ng namin ito -print namin ang kahit anong gusto. Kung gusto namin ito upang i-print background style na tuldok background na tuldok, dapat namin magagawang makita ang RGB triple na ay lumalabas. O hindi. Nakakalimutan ko nang eksakto kung paano mo i-print ang isang variable na tulad nang, ngunit dapat mong magawang i-print ang mga bagay tulad na. Iyon ay magiging lubhang kapaki-pakinabang para sa iyong pset kapag sinusubukan na manipulahin coordinate o watnat. Kaya baguhin din nila ito piraso sa klase. Ito ay iba mula sa huling taon, kaya maging maganda lang sa iyong TFs, o ang TFs sa oras ng opisina sa halip, dahil kami uri ng pag-aaral kasama ang sa iyo guys. Ngunit ang log ng console ay sobrang, sobrang kapaki-pakinabang para sa JavaScript nakaraang taon. Kaya ibigin ito. Alamin kung paano gamitin ito. Ito ay mas madaling gamitin kaysa sa GDB, upang dapat na hindi bababa ng plus point. Ngunit salamat guys ay tindig sa akin. Sorry na ang aking mga halimbawa para sa ilang kadahilanan lamang ay hindi nais na makipagtulungan sa akin, ngunit ko Inaasahan na ito nakatulong sa uri ng makakakuha ka ng kaunti pa sa zone ng JavaScript. At magpadala sa akin ang lahat ng iyong mga tanong para sa sa susunod na linggo upang makita ako sobrang repaired, at kukunin ko na dalhin ang kendi at kahit dagdag kendi dahil ito ay katawa-tawa. Ngunit ikaw guys ay mahusay, at may isang kahanga-hangang linggo.