[Powered by Google Translate] [Semèn 9, Kontinye] [David J. Malan - Inivèsite Harvard] [Sa a se CS50. - CS50.TV] Sa a se CS50. Sa a se nan fen semèn 9. Mèsi anpil. Finalman. Semèn 9. Mwen te resevwa li. Jodi a nou kontinye konvèsasyon nou an sou pwogram entènèt ak yon grenn je nan direksyon pwojè final la, se pa paske ou gen fè yon bagay ki baze sou wèb pou pwojè final, men paske swa pou pwojè final oswa apre CS50 sa a se sètènman a nan direksyon kote modèn lojisyèl ki pral. Men, li pa aktyèlman yon bagay fasil. An reyalite, youn nan bagay ki pi di fè se aspè nan nan konsepsyon. Pou egzanp, nan konsepsyon nou vle di aktyèlman ap resevwa koòdone nan itilizatè oswa eksperyans nan itilizatè dwa. Mwen daresay - epi nou konnen soti nan yon seri pwoblèm ki sot pase lè yon kèk nan ou devwale kolik ou sou kèk moso nan lojisyèl oswa pyès ki nan konpitè infuriates ou, si wi ou non sou lakou lekòl la oswa nan - gen nan yon anpil nan sit yo deyò, gen nan yon anpil nan kenkayri yo deyò, ki kalite suk. Men, reyalite a se sa ki fè bagay sa yo ke yo se fasil yo sèvi ak ankò se Alòske pwisan se yon defi trè difisil. Se konsa, pou jodi a Mwen te mande Jozèf ak Tommy rantre nan m 'isit la pou nou ka gen yon konvèsasyon, tou de sou modèl ansanm ak ki kalite pwosesis te panse ta dwe kòmanse ale atravè tout tèt ou lè ou desine pwojè final ou a, inisyativ avni-ou. Lè sa a, avèk èd Tommy a nou pral gade nan kèk nan detay yo aplikasyon. Ki jan w ka gen kèk vizyon sou papye oswa nan lide ou ke ou ka Lè sa a, egzekite programatik lè l sèvi avèk kèk nan teknoloji yo ak teknik nou te jis kòmanse te kòmanse pale sou sa, savwa JavaScript ak yon bagay menm plus, sètadi Ajax, asenkron JavaScript. Ki pèmèt ou kreye tout plis dinamik a nan yon koòdone itilizatè pa Chairman pi plis ak plis done progresivman ki sòti nan yon sèvè. Se konsa, nou pral wè kèk nan moun yo koupe kòm byen jodi a. Kòm yon sou kote, si w enterese nan konsantre nan syans òdinatè oswa minoring nan syans konpitè, konnen ke sa a Vandredi a midi nan Maxwell Dworkin 221 pral gen yon evènman pitza ki kote ou ka aprann yon ti jan pi plis sou syans òdinatè. Sou wout ou soti nan pòt la jodi a, ou pral kapab ranmase yon gid ofisyèl CS nan Harvard. Nou pral mete l 'sou bwat yo fatra deyò nan wotè ren pou ke si ou ta renmen gen tan pwan sa a ak aprann yon ti jan plis sou CS, ki pral gen pou ou jan li te ye nan semèn 0. Epitou si ou ta renmen rantre nan nou pou CS50 manje midi sa a vandredi a 1:15 pm, tèt a cs50.net/lunch. San yo pa pi lwen brwi, m 'ba ou ansèyman parèy Jozèf Ong. Hi. [Aplodisman] Mèsi. A premye fwa mwen te aprann enfòmasyon sou konsepsyon te nan yon klas isit la yo rele CS179. Pwofesè a nan moman an te di nou istwa a sou yon lòt pwofesè ki te ale nan yon otèl ak itilize tiyo yo. Èske nenpòt moun kapab di m 'sa 2 manch yo sou bò gòch la ak dwa fè? [Elèv] cho yo ak frèt. >> Cho yo ak frèt. Bon. Ki sa ou nòmalman atann, dwa? Sa a pwofesè apre lè l sèvi avèk tiyo a vle pran yon beny, li vanse yo sèvi ak sa a. Li panse bò gòch la ak kote sa yo dwa yo se pou cho ak frèt, dwa? Men, kapab nenpòt moun ki di m 'sa sa yo aktyèlman fè? Nenpòt men? [Repons fèbl elèv] >> Yon sijesyon se? [Fèbl elèv repons] Tanperati >>? Se konsa, youn nan yo kontwole tanperati a ak kontwole yo lòt yo? >> [Elèv] presyon dlo. Presyon dlo. Bon. Sa a pwofesè mache nan sa a, epi, panse yo ap kontwole cho ak frèt, vin youn nan dwa yo, ki li panse se pou cho, tout wout la jiska paske li vle pran yon beny cho. Oke, sa yo pa reyèlman matche ak moute, se konsa li vin eksperyans sa a pa trè amizan pou yo te nan yon douch frèt, ak nou tout konnen ki sa sa santi l tankou. Sa a se yon egzanp yon defo konsepsyon. Ki sa mwen vle di pa ki se tann l 'soti nan tiyo a pa t 'matche ak sa ki te soti kite peyi douch la, ki yon jan malere pou l '. Se konsa, sa a se yon egzanp yon defo desen ki k ap pase nan lavi reyèl. Men, nou wè tout kalite nan yo menm lòt yo tou. Nou se pwobableman pa fanatik nan sistèm nan MBTA a. Sa a se yon sistèm tren aktyèlman nan London, ki di, "sa a bouton se pa nan itilize." Poukisa se li menm sou la? Poukisa nou menm pran swen? Lè m 'te yon jenn ti kabrit, yo te teknoloji yon sèl la konprandr nan kay la, nenpòt lè òdinatè a ta aksidan, manman mwen ta vin jwenn mwen, ki montre m 'sa a ekran ak mande m' sa ki te pase. Menm mwen pa konnen sa sa a vle di. [Ri] Ki sa? [Ri] Anpil fwa nou santi devlopè lojisyèl yo se jis trèn nou. Geny en kòm itilizatè nou ap tankou, "Ki sa ki pwal sou? Yon moun di nou." Sa a tout vini desann nan yon pwoblèm nan konsepsyon. Design, kòm nou ka wè, se pa piman sou estetik, li pa sou jan bagay sa yo gade. Nou wè isit la ke sa a ti kras pop-up sou isit la aktyèlman sanble trè bèl. Li te gen yon lonbraj gout nan background nan, li gen radiuses fwontyè pral sou. Li nan kalite bèl. Li pa nan vrèman byen fèt paske se pa trè itilizatè zanmitay. Sa ti kras pop-up ki vini pa reyèlman, ban m 'nenpòt ki enfòmasyon sou sa ki ap pase, li pa di m anyen kòm itilizatè a sou jan yo ka refè nan ki erè. Nou vle panse osijè de bagay sa yo ke konsepsyon se pa. Premyèman, li pa estetik. Li la tou pa fars app ou a ak tòn fonctionnalités nesesè. Si ou se yon restoran Thai, pwobableman ou pa vle yo yon dantis nan menm tan an. Se avèk Facebook Kesyon, pa ke anpil moun te itilize li epi li pa te vrèman nan nwayo a nan sa yo t'ap bati a. Se konsa, li la bèl bezwen panse osijè de pa tèlman kantite a nan bagay sa yo ke w ap mete ak aplikasyon ou, men bon jan kalite a epi ki jan ou ap fè ki eksperyans itilizatè pi bon pa aktyèlman amelyore sou sa ki ou deja genyen. Nan yon Nutshell, konsepsyon di nou sa nou ta dwe bati. Pou egzanp, si nou ap bati yon bagay ki fè nou chèche bagay yo, tankou Google, pou egzanp, nou ta dwe fè bagay sa yo nan yon mannyè ki ki egzije pou itilizatè a yo pran anpil nan klik pou li ale nan sa yo vle, osinon èske nou dwe fè li nan yon fason, pou egzanp, ak Google Instant oswa otokonple ki pèmèt nou jwenn yo rezilta nou an pi vit? Jeni enplike nan, tankou Tommy pral montre w, aktyèlman bati li. Gen anpil bagay nan kalite konsepsyon. Pou egzanp, si w ap bati yon bagay yo deplwaye yon bagay nan yon peyi Tyèmond kote ki gen pa anpil elektrisite oswa ke teknoloji anpil, ou gen nan konsepsyon sa w ap bati nan yon fason ki fasil bay aksè a moun yo la. Men, sa ki kalite desizyon konsepsyon lòt ta ka gen oswa ta ka patisipe nan yon bagay tankou sa a? Yeah. Mwen wè yon men yo. [Fèbl elèv repons] Dwa >>. Egzakteman. Aksè nan se yon sèl bagay. Yon anpil moun pa panse osijè de, "Ki sa ki sou itilizatè mwen an?" tankou ekstrèm yo nan swa spectre. Mwen gen divinò ki ka gen andikap ki mwen pa panse sou ak mwen jis panse sou desine pou itilizatè a jeneral. Entènèt la se aksesib pa tout moun sèjousi, e mwen ta dwe desine pou moun sa yo kòm byen. Ki kalite desizyon konsepsyon lòt ta ka ou fè? Wi. >> [Elèv] Pri. Koute. Li bon anpil. Yon lòt bagay nou ta ka baz jijman konsepsyon nou sou yo pri. Si nou se yon biznis, ou vle bati yon bagay ki pa pran anpil pri yo pwodwi men yo ka vann a yon pri patikilyèman segondè oswa ka jwenn nou kèk pwofi. Sa yo se tout diferan kalite desen, men lè n ap bati yon bagay sou entènèt la oswa lè nou ap bati yon bagay ki pwobableman pa koute ke anpil konstwi kounye a, tankou aplikasyon entènèt - ou pa bezwen voye jete anpil kapital nan li yo nan lòd fè yon bagay ki aktyèlman ap travay - ki sa nou ap plis pweyokipe sou se eksperyans nan itilizatè. Nou rele sa itilizatè santre konsepsyon. Esansyèlman sa ki konsepsyon itilizatè santre enplike nan ap mete tèt nou nan soulye yo nan itilizatè ou an. Si yon moun siy moute pou sa m ap bati, yo te evidamman vini nan aplikasyon an patikilye mwen an avèk yon objektif nan tèt ou, ak yon travay yo vle konplete. Ak travay ou se pa sèlman yo ede yo ranpli ki travay men ede yo pran konplete ki travay nan yon fason ki se efikas, entwisyon, ak yo, jan kèk moun di lòt bò a, ki aksesib. Ki sa ki efikasite vle di? Efikasite vle di kouman byen vit itilizatè mwen ranpli travay la bay koòdone m 'yo. li pran anpil bagay nan klik pou yo pou jwenn soti nan yon sèl kote nan lòt la? Èske li fatigan? yo gen yo fè anpil bagay nan travay repetitif? Nou vle fè pwosesis sa a kòm efikas ke posib Se konsa, yo pa bezwen fè sa yo kalite bagay sa yo. Kòm pou intuitiveness, se sa ki, pou egzanp, si yon itilizatè sanble moute koòdone m 'yo, se li fasil pou yo pou jwenn nan yon kote ale yon? Èske li fasil pou yo pou konnen ki sa yo te dwe klike sou nan koòdone mwen yo nan lòd pou yo pou reyalize objektif la oswa travay yo ke yo vle reyalize? Epi finalman, kòm yon moun di lòt bò a, aksè a trè enpòtan. [Gason oratè] Li vini nan aksè pou bagay sa yo tankou vizyon, renmen ki jan mwen aktyèlman desine yon bagay pou yon moun ki se avèg? Oh. Pou moun ki pa ka wè nan tout, nou gen yon bagay yo rele lektè ekran. Ki sa ou dwe fè se ou ta dwe bati sit entènèt ou a nan yon fason ki, pou egzanp, teknoloji an patikilye sa nou rele - Gen anpil bagay nan bagay sa yo kounye a. Mwen panse ke gen lektè ekran rele machwa. Yon anpil nan bagay sa yo depann sou sa nou rele règ zòn yo nan lòd yo li soti nan itilizatè a ki sa ki prezan sou paj la. Pou moun sa yo ki pa ka wè, ou bezwen asire w ke sa yo ekran lektè ka aktyèlman ranmase kontni an nan paj an ak ka aktyèlman montre itilizatè ou an, si ou pa ka wè, omwen ou menm ou ka toujou konprann sa ki sou paj la. Yeah. Oke. Ase pale de konsepsyon bon. Se pou nou pale sou desen move. Sa yo se bagay ke ou pa ta dwe fè. Èske nenpòt moun kapab fè m 'konnen sou eksperyans yo ak krèyslist ak sa yo panse se pa konsa pou sa gwo sou sa a konsepsyon? Wi. >> [Elèv] Mwen panse ke gen nan twò anpil mo nan yon sèl zòn nan. Twò anpil mo, dwa? Konplètman akablan yo. Ou vini nan paj sa a epi w ap akeyi ak yon pakèt antye de bagay sa yo moute isit la ki pa ta ka menm gen pwoblèm ou yo. Pou egzanp, ou ap viv nan yon eta ki pa kòmanse ak lèt ​​sa a. Se pou nou di w ap viv nan Texas oswa yon bagay. Ou gen woulo liv tout wout la desann paj la pou w ale nan ki kote ou ye a. Mwen ki soti nan Boston, se konsa, kite m 'gade nan Massachusetts. Ki kote se Massachusetts? Oh, li nan dwa isit la. Oh, li nan Boston. Oke. Se pou yo gade nan Boston. [Ri] Joli boulvèsan, dwa? Bagay sa yo gòch sou la. [Ri] Se pou nou di mwen kap chèche yon kote yo ap viv la. Konbyen moun ki gen aktyèlman itilize krèyslist? Tòn ou. Gen trè move fason fè yon gade nan sa a, men kite a gade nan sa a. Ki sa ki nan diferans ki genyen ant img ak pic? Èske nenpòt moun kapab di m 'konsa? Gen aktyèlman gen okenn diferans. Yo vle di egzakteman menm bagay la, men yo gen etikèt diferan pou yo pou kèk rezon. Si m 'klike sou Èske gen Imaj, pa gen anyen k ap pase sou paj la. Mwen gen aktyèlman klike sou Search ankò pou yon bagay rive. Ki sa ki ta kapab yon desizyon konsepsyon pi bon ki te kapab fè a? Si mwen klike sou ki filtre li, mwen pwobableman vle filtre nan ki aksyon an patikilye oswa ki kategori an patikilye. Se konsa, olye pou yo gen yon konvèsasyon vwa Search ankò, mwen te kapab jis otomatikman fè filtraj la sòt de style Google kote yo fè li imedyatman. [Malan] Men, pa fòme jan nou te wè yo konsa byen lwen gen yo dwe fizikman soumèt pa frape Mete omwen oswa klike sou yon bouton? Kòm ou te wè yo twò lwen, ou gen aktyèlman klike sou Soumèt fè bagay sa yo. Men, kòm Tommy pral montre w nan yon dezyèm, gen aktyèlman fason pou ou sa yo ki lè ou klike sou ke bagay li ka otomatikman voye sa nou rele yon demann Ajax epi pou yo jwenn done retounen lakay yo epi filtre rezilta ou enstantane. Gen tòn bagay ki mal ak sa a koòdone. [Malan] Èske ou ka rechèch pou Cambridge? Gen nan yon bagay yon ti kras iregilye isit la ki kote ou pran swen sou Cambridge e ankò w ap vin Westford, Spring Hill, West Newton ak renmen an. Pwobableman pa ideyal. >> Pwobableman pa ideyal. Ki jan mwen ka kapab fè eksperyans itilizatè a pi bon sou paj sa a an patikilye? Wi. >> [Elèv] Enstriksyon. Oke. Enstriksyon nan sa ki sòt de sans? [Elèv] Pou egzanp, yon bagay pou itilizatè premye fwa ki pa menm konnen ki sa krèyslist se oswa ou pa konnen sa ou ap sipoze fè. Dwat. Se konsa, esplike ou kisa ki krèyslist se sou paj sa a se yon bagay enpòtan. Nou ka aktyèlman di itilizatè sa ki nan paj sa a se aktyèlman pou li a. Si mwen jis vizite sa a, mwen wè yon pakèt antye nan kote yo ye. Mwen pa menm konnen ki sa yo vle di. Men plis enpòtan, jis gade nan sa a koòdone, sonje mwen te gen desann yon tòn de bagay sa yo sa yo jwenn yon kominote patikilye ke mwen aktyèlman pran swen sou sou sa. Ki sa ki nan yon fason pi vit mwen te kapab fè sa? Wi. [Elèv] Divize yo moute nan bò solèy leve, nan rejyon lwès. >> Okay. Mwen te kapab divize yo nan plis kategori ki ta kapab ede m 'pi vit detèmine kòman ou kapab jwenn ak sa yo ki kote an patikilye. [Elèv] Mete yon lis drop-desann. Dwa >>. Oke. Mwen te kapab sèvi ak yon meni drop-desann paske nou gen yon seri fiks de bagay sa yo ak nou te ka montre yo nan yon meni drop-desann. Nan fason sa a li pa pran moute espas anpil sou ekran an. Men, menm pi bon pase sa, ki sa nou ka fè? Wi. >> [Fèbl repons elèv] >> Èske ou ka di ke ankò? >> [Elèv] bwat rechèch la. Yeah, yon bwat rechèch. Sa a se gwo. Ki sa nou ka aktyèlman fè se si nou tounen gade dèyè nan ti bwat la glisad rechèch,. Otokonple. Trè fasil fason nan rechèch nan rezilta ke ou konnen yo se nan yon seri. Si mwen kòmanse sezisman BO, jis montre m tout rezilta yo ki gen BO andedan nan yo. Nan fason sa a mwen ka trè fasil jwenn youn nan patikilye Mwen vle pou yo ale nan olye pou yo gen woulo liv atravè lis sa a vrèman gwo. Sa yo se tout kalite reyèlman ba-pandye fwi ke yon moun ki moun ki mete ann aplikasyon krèyslist ka aktyèlman fè yo fè eksperyans nan sou sit entènèt la yon pi bon anpil pou itilizatè yo an patikilye. Oke. Ase ap pale de sou sit entènèt move. Se pou nou pale sou Facebook. Lè Facebook 'soti, li patikilyèman Facebook foto, te gen anpil bagay nan lòt sèvis la nan moman ki ta ka fè egzakteman menm bagay yo. Yo te kapab òganize foto ou nan albòm. Ki sa ou ta ka fè se ou ta ka òganize yo nan aparèy televisyon HD kòm byen. Ou te kapab òganize yo nan dat sa a. Ou ta ka fè tout bagay sa yo an patikilye. Men, nenpòt moun ki konnen sa ki te fè Facebook foto eksploze la nan moman li te lage? Wi. >> [Elèv] Tags. >> Tags. Egzakteman. Nou gen Milo sou isit la, ki moun ki se maskot chen nou yo ak ki foula CS50. Ou ka wè ke nou gen karakteristik sa a balisage nan mitan yo. Ak sa ki te fè Facebook foto konsa enteresan sòti nan yon fason D ' se ke li aktyèlman pèmèt moun atravè sa a enplike zanmi yo nan foto yo. Pou Facebook, depi sou sit wèb yo se patikilyèman sosyal, li a sou bati sa a sòt de atmosfè sosyal. Sa amelyore eksperyans nan nan foto yon anpil plis paske yo te kapab aktyèlman kòmanse di, "Sa yo se koneksyon ki genyen ant moun, ak sa yo, se foto sou moun ou aktyèlman swen sou. " Yon pati nan li se tou narsisism zèl. Moun renmen pou atenn nan foto ak bagay sa yo tankou sa. Pandan ke sa pa nan nesesèman yon bon trè imen, an menm tan an li nan ki baze sou desizyon konsepsyon bon paske moun aktyèlman swen sou bagay sa yo tankou sa a. Se konsa, sa a, se foto Facebook. Men, kite a pale Facebook plis jeneralman. Mwen sèten anpil moun isit la gen opinyon sou Facebook, tou de desizyon konsepsyon bon ak desizyon konsepsyon move. Se konsa, kite a anpeche oswa gen kè kontan. Vini non sou. Mwen konnen tout moun nan mitan nou sèvi ak Facebook. Yon moun gen yo gen yon move bagay yo di oswa yon bon bagay yo di sou li. Wi. [Elèv] Nan manje a nouvèl gen yon bann bagay sa yo mwen pa reyèlman sousye de. Manje nan nouvèl fè sa ki montre yon bann bagay sa yo ou pa ta ka pran swen sou. Ou gen zanmi sou Facebook ki moun ou pa gen te rankontre pandan 2 oubyen 3 zan epi ou wè rezilta nouvèl yo eklate moute nan manje nouvèl ou epi ou pa reyèlman sousye de li. Facebook gen aktyèlman te fè yon efò fè sa-a pi byen, ak yo te aktyèlman te eseye pouse rezilta ki gen rapò ak tèt la nan manje a nouvèl kòm nan anreta konsa ou aktyèlman wè bagay pa zanmi ki gen rapò ak ou menm oswa zanmi pwòch ou. Nenpòt lòt bagay? Wi. [Fèbl repons elèv] >> Èske ou ka di ke ankò? [Elèv] anons yo se relativman efase. >> Nan ki sans? [Fèbl elèv repons] Yo pa gen limyè sou ekran an, tankou banyèr. Oke. Sa a se bon. Si ou sonje entènèt la nan '90s yo - >> [Malan] Mwen te la. >> Li te la. [Ri] Ou ta ka sonje flache jif antesedan, sparkly bagay sa yo, GeoCities sòt style a bagay sa yo. Sa a vrèman pa yon egzanp sou yon konsepsyon bon paske li nan reyèlman distrè soti nan kontni an. Sit wèb la atizay Yale te konn itilize anvan jif anime kòm background yo epi ou pa t ka li anyen sou paj la, men mwen devine yon moun aktyèlman pale ak yo epi kounye a se yon ti jan diferan. [Malan] Li nan pi bon kounye an. >> Li nan pi bon kounye a, kòm ou kapab wè. >> [Malan] Oh yeah. Jis gwo, jis - Yeah. Oke. Pati nan li ap fè tou paj ou a posib trè minimalist ak anpil konprann Se konsa bagay sa yo sou koule nan paj nan yon fason ki trè ki lojik e ki pa jwenn nan fason a nan chak lòt. Kalite Ki sa ki nan lòt bagay yo se bon sou Facebook oswa move sou Facebook? Se pou nou jis gen yon konvèsasyon konsepsyon isit la. Oh. Ki kote? Yeah. [Elèv] sistèm nan Timeline nouvo pèmèt ou nan rechèch pwofil moun nan sou sot pase yo. Ooh, Timeline. Timeline se yon gwo bagay paske li pèmèt ou pouse zanmi ou tounen lè yo te nan lekòl segondè. Timeline se yon bon bagay paske li pèmèt ou filtre nan kontni yon anpil pi vit, li pèmèt ou jwenn bagay sa yo ke ta gen otreman pran ou yon moman vrèman long jwenn jis defile leve, li desann, moute, moute, moute, moute, moute, tankou ale tounen nan tan. Men, Lè sa a, gen nan tou sòt de yon inconvénient ak sa yo ki an tèm de eksperyans itilizatè. Ki sa ki ta ka ke ta dwe ye? Big mo ki kòmanse ak P R-. >> [Elèv] Enfòmasyon Prive. >> Privacy, dwa? Privacy se yon itilizatè pwoblèm gwo eksperyans. Sa a se youn nan bagay ki pi m 'rayi sou Facebook kounye a. [Ri] [Malan] Kòm pou m kounye a. David pa t 'konnen sa sa a aktyèlman te rive jouk yè. Se konsa, kounye a li konnen ke chak fwa mwen chat l 'mwen konnen li te konn mete inyore m'. [Malan] pati nan gòch te mwen te aktyèlman inyore l ', epi mwen pa t 'konnen li te konnen mwen te inyore l'. [Ri] Privacy se yon sijè gwo. Èske nenpòt moun kapab isit la di m 'sa ta ka move sou Facebook vi prive san konte lefèt ke yo fè bagay sa yo tankou sa a? Ki sa li patikilyèman di yo fè ki gen rapò ak Facebook vi prive? Ki sòt de se yon kesyon dirijan. Wi. >> [Elèv] Kache foto ou nan mitan pèp a sèten. Dwat. Egzakteman, nan kache foto ou nan mitan pèp a sèten. Yo gen sa a piti, ti kras bouton an dwa a anwo ki pèmèt ou aktive enfòmasyon prive ki nan yon foto. Opsyon vi prive yo yo trè varye ant kalite diferan nan meni. Yo te vinn yon pi bon anpil sou li dènyèman, men li itilize yo dwe ka a ke chak fwa ou te vle anpeche zanmi ou soti nan wè foto, ou ta gen yo ale nan yon pwosesis ki trè konplike-5 etap pou yo te tankou, kite m 'klike sou lyen sa a, kounye a kite m' klike sou ankò, kite m 'klike sou ankò, kite m 'presize ki moun ki pa ka wè foto m' yo. Sa a se pa patikilyèman bon sou pati Facebook a paske anpil sou eksperyans itilizatè ki aktyèlman ba yo libète a kontwole sa moun ka wè. Nou rele sa kontwòl itilizatè yo ak libète. Si ou pa ap kite itilizatè ou fè sa nan yon fason ki se efikas ak entwisyon, Lè sa a, eksperyans itilizatè ou an se pa reyèlman ki gwo nan tout.  Èske ou ta nèg renmen di anyen sou Facebook? Kouman pou mwen vire sa a la? [Ong] Ou pa ka vire sa a la, e ke se yon defo D 'gwo sou pati nan Facebook. Karakteristik sa a - Mwen aktyèlman gade nan li yè - li nan swa ke ou pa kapab fè li oswa li nan yon kote antere l 'trè, trè gwo twou san fon nan ata sou tèt Facebook paske mwen pa kapab konnen ki jan a enfim sa a fonctionnalités nan tout. [Malan] Men, pafwa desizyon sa yo yo pa evidan paske ou nèg yo te ban nou yon anpil nan fidbak itil sou CS50 divès kalite aplikasyon epi sou sit entènèt ke kou a sèvi avèk yo. Nou pa t 'aplike tout moun sa yo demann ak sijesyon. Yon pati nan se sa ki pou resevwa demann pou anpil moun ke li nan yon fonksyon yo nan tan, men pafwa nou jis pran yon desizyon konsyans tankou, "Mèsi dèske ou sijesyon la, men nou dakò." Se konsa, kouman ou aktyèlman deside ki sa w ta dwe fè si itilizatè ou panse ou ta dwe fè yon bagay menm si ou fè pa nesesèman? Li se yon balans amann ant aktyèlman koute sa divinò ou an di ak aktyèlman gen kèk sòt de liy kote ou di, "Nou pa pwal fè sa sa yo itilizatè yo 'di nou. Ak an patikilye, mwen panse ke te gen yon quote pa Henry Ford ki rezime sa a moute trè byen. "Si mwen te mande l 'moun sa yo te vle yo, yo ta yo te di yo te vle pi vit chwal." Èske nenpòt moun kapab klase nan toumante apa ki sa sa quote vrèman vle di? Li pa jis ke itilizatè konnen ki sa yo vle, men li la plis ke - [Elèv] Yo pa konnen sa ki nan sa posib. Nan pati yo pa konnen ki sa ki posib. Toumante ki apa yon ti jan ti kras pi plis. Ki sa ou vle di pa sa? [Fèbl repons elèv] Sa a se bon. Ki sa mwen panse ke nou ap eseye di isit la se ke gen moun ki konnen sa yo vle. Yo vle pi vit chwal. Kisa yo vle reyèlman se kapasite a pou avanse pou pi pi vit, men yo pa vrèman konnen mwayen an pa ki reyalize sa. Lè w rive nan itilizatè ou yo ak divinò ou rakonte w yon bagay epi yo di nou, "Nou vle karakteristik sa yo ak karakteristik sa yo ak karakteristik sa yo," ou pa vle nesesèman panse osijè de, "Kite m 'ale pi devan "Epi aplike sa yo ouvètman di," men ki sa ou vle panse osijè de se, "Ki sa ki sòt de lide mwen ka jwenn soti nan sa?" Ki sa yo aktyèlman vle? Depi lè sa a gen sa ou kapab fè se konsepsyon yon bagay ki satisfè sa yo mande men se pa nesesèman nan fason ke itilizatè a espere li yo dwe satisfè. Se konsa, pou yon bagay tankou pwojè final, an tèm trè reyèl, sa ki nan yon eristik itil lè li rive fè yon bagay pi byen, espesyalman si designer a gen sa a awogans sou li annakò ou sòt de konnen sa ki pi bon, ou ta ka pran enfòmasyon nan men gwoup itilizatè ou an, men ki jan ou aktyèlman ale sou kesyon pran ke Feedback? Nan pwojè final, trè konkrètman, ki sa ki pwodwi rezilta optimal isit la? Ki sa ki pwodwi rezilta optimal - epi mwen pral ale sou sa a nan yon dezyèm - se pwosesis sa a pou devlope ak Lè sa a, fè tès ak Lè sa a, iteration. Ki sa mwen vle di pa fè tès se nòmalman lè ou desine yon bagay ou panse li nan san patipri bon, tankou, "Mwen tankou yon designer gwo. Tout moun ki pral renmen sa a." Lè sa a, ou mete l 'deyò a la, ak moun ki pa vrèman renmen li pou kèk rezon. Ki sa ou dwe fè se ou dwe pran pati pyès sa yo de bagay sa yo ke gen moun ki fè tankou ak korije bagay sa yo ke moun ki pa renmen. Li son tankou yon pwosesis ki trè evidan, men pwosesis sa a nan toujou ap iteration sou tèt de ki sa ou te deja bati se yon pwosesis ki ede ou pa sèlman amelyore fòmasyon pwòp konsepsyon ou, men tou ede ou amelyore desen an pou ke moun yo aktyèlman apresye pwodwi ou menm pi plis pase yo te fè anvan. Mwen pral ale sou plis egzanp konkrè nan sa ki ou ta ka aktyèlman fè. Kòm kalite yon egzanp sot pase yo nan yon pwodwi, kite pou yo gade nan kayak. Kayak lè li te vini soti te trè, trè popilè. Èske nenpòt moun kapab devine poukisa? Ki sa ki kalite ki nan bagay sa yo ou renmen sou sa a si ou te itilize li oswa ki sa yo se kalite ki nan bagay sa yo ou pa renmen? Wi. >> [Fèbl repons elèv] >> Okay. Sa a se yon pati nan li se kite itilizatè a gen yon sijè rechèch ki pi plis awogan pase yon yon sèl tankou anpil restriksyon, "Ou ta dwe chwazi dat kòmansman ou "Epi ou ta dwe chwazi dat fen ou a." An reyalite, li pèmèt ou dwe fleksib sou li e li ba ou tout nan vòl yo ki nan ki pòte. Nenpòt lòt bagay? [Elèv] Yo genyen ladan yo frè yo nan pri an. Yo fè enkli frè yo ki nan pri an. Taks yo ak bagay sa yo aktyèlman ale tou dwat nan ki pri nan bò gòch la anwo se konsa ou pa ap twonpe nan panse ke w ap aktyèlman pou peye pou yon vòl $ 240 lè li vrèman $ 330. Nenpòt lòt bagay? Wi. [Fèbl repons elèv] Mwen pa si si yo aktyèlman kite ou fè sa. M 'te ka sa ki mal. Ke sa ta kapab yon enteresan bagay si ou vle mete plis pwa sou filtè an patikilye yo pou ke yo pouse rezilta ki gen rapò ak filtè nan tèt la. Men, kapab nenpòt moun ki fè m 'konnen sa ki nan konsa espesyal sou sa a bò gòch? Kijan ou te tradisyonèlman gade moute yon vòl nan yon sèvis Entènèt anvan sa a? Wi. >> [Fèbl repons elèv] >> Èske ou ka di ke - [Elèv] Chak avyon. >> Yeah. Chak avyon gen pwòp sit entènèt li yo. Sa a konsolide bagay sa yo. Ak? [Elèv] Ou konnen ekzakteman ki sa tan w ap kite. Ou konnen ekzakteman ki sa tan w ap kite, men ki gen rapò ak filtè yo an patikilye. Kite m 'rale moute kayak. Oh Bondye, pòp-ups. Move eksperyans itilizatè. Kisa k ap pase lè m 'deplase sa a kurseur? [Elèv] Ki dènye otomatik. >> [Ong] Ki dènye otomatik. Sa a se yon bagay ki enpòtan anpil. Anvan sa a, nenpòt lè ou te vle yo gade jiska yon vòl, ou te gen yo mete nan kote apò ou, kote pwodiksyon ou, peze Search, li ta travay sou sa ki epi montre rezilta ou. Si ou te vle chanje sijè rechèch ou an, ou ta gen yon konvèsasyon vwa tounen de fwa, antre nan nan yon sijè rechèch nouvo soti nan grafouyen, ak Lè sa a, fè li sou yo ak sou ankò. Bagay nan bon sou yon bagay tankou sa a se li itilize yon trè [enkonpreansibl] bagay nan mitan yo. Nenpòt lè ou fè yon bagay tankou sa a, li lans sou yon demann ak li retounen nou tout rezilta yo imedyatman. Sa a sòt de fidbak imedya se yon bagay ki te fè kayak pwi enflasyon popilè paske li nan reyèlman fasil pou mwen pou m jis chanje sijè rechèch mwen ak figi soti bagay sa yo ke yo ozalantou yon seri patikilye san yo pa gen ale retounen lakay yo epi soti, retounen lakay yo epi soti, retounen ak lide. Se konsa, sa yo, se tout kalite bagay sa yo ou vle panse osijè de lè w ap desine sit entènèt ou. Kouman mwen ka fè li trè efikas pou itilizatè mwen yo ale nan tou sa yo ap travay sou ak pou li ale nan objektif evantyèlman yo kòm byen vit ke posib? [Malan] Lè nan pwen Jozèf yo pi bonè sou itilizatè yo pa nesesèman konnen sa yo vle, ki baze sou ki sa ou nèg kounye a konnen sou HTML epi ou gen kaz, bouton radyo, meni seleksyone yo, jaden yo opinyon ak renmen an, ki jan ou ta aplike nosyon de davwa yon tan kòmansman pou yon vòl? Kilès nan sa yo fòmil UI divès ou ta itilize? Si ou jis konnen kantite a HTML ki te anseye anvan e ou konnen entrain yo se bouton radyo, kaz, drop-Downs, ansanm ak ti bwat D ', sa ki ta gen chwa natirèl ou a te pou davwa dat? [Elèv] Antre. Antre >>. Oswa petèt menm yon ti gout-desann ak tout dat yo, dwa? Se konsa, avèk mekanism plis konplèks UI tankou sa a sou bò gòch la ke ou ka aplike, ou ka fè pwosesis sa a pi plis entwisyon ak yon kurseur paske tan se kontinyèl, ak moun anjeneral pa panse a li an tèm de sègman disrè. Tout dwa. Dènye bagay. Dis D 'eristik. Tout bagay sa yo nou te pale osijè de pwobableman tonbe anba youn nan kategori sa yo. Si ou ale nan lyen sa a, ki kote yo pral poste sou entènèt, ou pral aktyèlman kapab, jan ou desine sit ou a, kenbe sa yo eristik nan tèt ou ak règ sa yo nan gwo pous. Pou pwojè ou a, ki sa mwen sijere ou fè yo nan lòd yo desine app ou a pi byen se fè Prototype papye an premye. Lè w ap panse sou aplikasyon ou lan, trè vit trase sa ou vle l 'bay gade tankou , epi fè sèten tout bwat yo ranje nan yon fason ki trè entwisyon pou itilizatè a pou itilize e menm montre sa yo prototip papye to zanmi ou ak kòmanse gwoup diskisyon. Jis jwenn 2 oubyen 3 moun ansanm epi mande yo bay jis tiyo sou sa yo prototip papye, epi montre yo ekran nouvo yo wè si yo aktyèlman konprann sa ki pral sou. Ki sa ou vle fè se ba yo yon travay, motive ki travay, ak jis ba yo app a epi kite yo sèvi ak li. pa bay yo enstriksyon pi lwen pase sa. Ou vle aktyèlman kite yo kominike avèk app ou nan yon fason ki pèmèt ou wè kijan yo ta sèvi ak li si ou pa te kanpe bò kote yo a. Epi sa a, ki enpòtan anpil. Ki pral ba ou anpil bagay nan Sur kòm yo se moun k ap resevwa tout bagay nou patikilye nan yon fason ki mwen pa t 'gen entansyon yo? Èske yo lè l sèvi avèk fòmil UI patikilye sou ekran an nan yon fason ki se kalite hacky? Mwen pa t 'gen entansyon pou yo pou fè l' ki fason. E yon fwa w ap fè ak ki, ki sa ou vle fè? Wòch konsepsyon ou, dwa? Ki sa ou vle fè se ou vle devlope ak Lè sa a, fè pwosesis sa a sou yo ankò. Se konsa, montre li nan zanmi yon fwa ou te devlope li, tès li, devlope, teste, devlope, teste, repekte, sou yo ak sou sou yo ak sou pi devan. Design se yon trè repete pwosesis nan sans sa a. Ou gen aktyèlman yo bati yon bagay e yo Lè sa a, reyalize bagay sa yo sou li ke ou pa t 'rekonèt devan epi ale retounen lakay yo epi amelyore soti nan sa. Koulye a, kòm pou pati ki devlopman, se sa ki Tommy ki pral montre w apre repo a epi ki jan ou ka kapab aplike yon bagay tankou otokonple nan yon fason ki se jistis ki senp. [Malan] Kòm Tommy kouche moute isit la, yon kesyon Lè sa a,. Yon anpil nan sit entènèt yo pi bonè - ak lè Jozèf di ane 1990 sou sit wèb style, li te en kote si ou te vle chwazi yon tan ap kòmanse ak yon tan fen, franchman, li tounen nan jou a, e menm sou kèk sit entènèt jodi a, nan fason ou fè sa a se ou chwazi yon èdtan nan yon gout desann-, ou chwazi minit nan yon gout-desann, petèt ou chwazi pou ou AM, PM, ak Lè sa a, ou fè sa 3 fwa plis. Se konsa, ak 6 klik e petèt defile kèk itilizatè ou ka aktyèlman bay kèk kalite dat ak / oswa ranje tan nan sans sa a. Se konsa, definitivman optimal e ankò konsa byen lwen nou te wè pa gen okenn kapasite ekspresif nan nenpòt nan lang yo nou te gade fè sexier yon bagay tankou sa a kurseur nan tan kòmanse ak lè fen. Men, si ou panse tounen nan semèn 0 lè nou te pale osijè de grafouyen, gen twò pa t 'gen widgets ki jis te fè sèten bagay. Ou vrèman jis te gen sa yo fondamantal tankou pasan ak kondisyon ak renmen an. Se konsa, kalite jis panse trè abstrè, koulye a, endepandan de Nap yo nan HTML, ki sa ki reyèlman ale sou ak yon bagay tankou tan sa a kòmanse ak kurseur tan fini? Lè m 'deplase sourit mwen epi mwen klike sou senbòl ki kawòt ti kras sou bò gòch la e kòmanse trenen, programe, ki sa li ou vle pou kapab aplike fè ki rive? Ki kesyon, ki sa ki ekspresyon Boolean ou vle pou kapab mande? Kisa ki reyèlman ale sou? Sammy? [Elèv] Ki kote nan pozisyon nan kurseur la? >> Bon. Ki kote se pozisyon nan kurseur la? Sa a te yon bagay nou bezwen eksprime tounen nan grafouyen, si li te baze sou ki kote oswa menm koulè oswa tankou an. Ou ta ka sonje janm konsa yon ti tan nan Lendi te gen tout bagay sa yo rele evènman nan mond lan nan sit Entènèt la, epi konsa gen nan bagay sa yo tankou xonclick ak onkeypress ak onkeyup ak onmouseover ak onmouzawt. Se konsa, reyalize ke menm bagay sa yo nou te te pran pou yo akòde sou entènèt la ak sit tankou Facebook ak Gmail, menm si ou pa gen okenn lide ki jan ou ta pètèt aplike pou sa paske pa gen anyen menm tankou l 'nan konferans oswa Pwoblèm Fikse 7, reyalize ke sa yo ak Fondamamtal egzak menm, ak HTTP ak karakteristik epi pou yo jwenn ak POST, ak entrain yo debaz HTML ke nou te gade konsa byen lwen ak nan yon moman ak fòmil yo pwogramatik ki nan Tommy sou yo prezante ou ka kòmanse yo eksprime tèt ou jis tankou ou te fè nan semèn 0 pa trè entwitivman trenen ak jete. Se konsa, avèk ki te di: Tommy MacWilliam ak kèk moso devinèt nouvo pou nou pou sit entènèt. Tout dwa. Non mwen se Tommy ak mwen pral yo dwe pale sou JavaScript. Jis yon dechajman: Se mwen menm nan opinyon ke JavaScript se lang la pwogramasyon pi bon nan tout mond lan tout antye. Gen anpil bagay nan moun ki dakò avè m ', men li la jis etonan. Yon fwa ou tounen nan C, si ou gen yo ekri C pou yon lòt klas oubyen kèk lòt lang yo, li jis reyèlman fwistre nan tout detay yo ki ba-nivo ou gen jwenn anbourbe desann pous Se konsa, si w ap janm santi tris sou kouman annwiyeu C se ka ekri, jis ale tounen, ekri kèk JavaScript. Li nan nivana. Ou ap santi pi bon sou jou ou move non. Yon anpil nan majik nan JavaScript soti nan kapasite li nan manipile bagay sa yo ki deja sou paj la. Lè nou te ekri Scripts PHP nou an, yo te egzekite sou sèvè a, ak evantyèlman ki PHP script pwobableman Sòti kèk HTML. Sa HTML te voye bay kliyan an, ak Lè sa a, sa ki te li. Si PHP te vle ajoute yon bouton nan yon paj, pou egzanp, li pa ka vrèman fè sa. Li ta genyen rann yon antye nouvo dosye HTML epi voye ke yo navigatè a. Avèk JavaScript nou konnen ke nou ka mete ajou bagay sa yo pandan ke yo ap deja sou paj la, ak paske nan sa nou kapab founi fidbak pi plis enstantane, ki pral reyèlman amelyore eksperyans nan itilizatè sou sit entènèt nou an. Jis yon rapèl rapid sou JavaScript seleksyon. Nou konnen ke lè nou telechaje yon paj HTML, ki k ap pase yo dwe reprezante nan Dom la. Dom yo sonje se jis pye bwa sa a gwo kote eleman yo ki gen rapò sa a nan yerachi gwo. Lè nou te travay ak baz done nan pset 7, youn nan bagay ki premye nou bezwen konnen ki jan fè se te sijè rechèch baz done a. Nou gen sa a gwo itilizatè tab, epi pafwa nou jis vle di, "Mwen sèlman vle kèk nan sa yo itilizatè yo ki matche ak kèk kondisyon." Menm jan tou, lè nou gen Dom a nou bezwen kèk fason pou rekèt li. Nou bezwen kèk fason pou di, "Mwen vle tout bouton sa yo ki gade tankou sa a "Oswa tout imaj yo sou paj la." Ak sa yo seleksyon pèmèt nou fè sa. Se konsa, jis yon rapèl rapid. Sa a yon sèl premye isit la, sa a # soumèt an, sa sa pral chwazi? nenpòt moun ki sonje? [Fèbl repons elèv] >> Yeah, egzakteman. Sa a se pral chwazi yon eleman sou paj la ki gen yon ID nan soumèt. Se konsa, ki tag regle di sa a seleksyon ki pral travay ak idantite. Kouman sou yon sèl, dezyèm lan, sa a. Santre, ki sa ki pral ki chwazi? Yeah. >> [Elèv] Gwoup. >> Egzakteman. Sa a se kounye a ale nan chwazi nan klas la. Diferans ki genyen ant ID ak klas isit la se jeneralman ID a yo ta dwe inik nan kèlkeswa sa espas w ap chèche sou. Se konsa, si ou te chache sou plis pase yon paj entènèt antye, ou reyèlman yo ta dwe sèlman gen 1 eleman ak ki ID sèten, se konsa nan ka sa a nan soumèt. Avèk klas yo, sou la lòt bò, nou ka gen plis pase 1 eleman nan paj an menm avèk klas la menm. Sa a te kapab itil pou li di mwen vle chwazi tout bagay ki nan santre sou paj la olye ke sèlman 1 bagay sa yo. Epi finalman, yon sèl sa a dènye isit la se yon ti kras pi plis konplike, men ki sa sa a se ale nan chwazi nan Dom a? [Repons fèbl elèv] >> Ki sa ki nan sa? [Elèv] Nenpòt bagay ki se yon tag. >> Nou gen 2 pati isit la. Pati nan dezyèm ki pral di mwen vle chwazi sa yo tags ak yon tag nan opinyon, pou nenpòt ki eleman ki se yon tag opinyon. Men, mwen pa vle jis chwazi tout entrain yo paske yon bagay tankou yon bouton plede te kapab yon D ' ak yon bagay tankou yon bwat tèks te kapab yon D '. Se konsa, avèk sa yo parantèz kare m ap di mwen sèlman vle chwazi sa yo eleman ki nan tèks ki kalite. Yon kote nan tag HTML m 'mwen gen yon atribi rele kalite, ak valè sa a nan atribi te gen tèks. Se konsa, ki jan sou pati sa a premye isit la? Mo nan premye nan sa a seleksyon manm CCELL se fòm Lè sa a, mwen gen yon espas ak Lè sa a, nan pati sa a D '. Ki sa sa fè sa, mete fòm nan nan devan li? Sa a se pral fondamantalman limite rechèch nou an. Li ta ka ka a ke nou gen kèk entrain sou paj la ki pa pitit ak pitit pitit yon fòm. Ki sa sa ap fè se sa a ap di mwen sèlman vle opinyon etikèt yo ki gen yon kote pi wo a yo kèk paran eleman nan yon fòm. Se konsa, nan fason sa a nou ka fè sa yo queries plis yerarchize donk nou pa jis gen nan chwazi tout bagay matche yon seleksyon manm CCELL bay yo. Nou kapab kalite limit sijè ki abòde lan ki sijè rechèch yon lòt bagay. Se konsa, kounye a ke nou konnen ki jan yo chwazi eleman ki nan paj la, kite a pale yon ti jan sou Ajax. Ajax se yon akwonim toujou trè tandans ki vle di pou asenkron JavaScript ak XML. Li jis konsa k ap pase ki XML se jis kèk fason ki reprezante done. Sa kalite yo nan pèdi popilarite dènyèman, se konsa X la nan Ajax pa itilize tout tan tout tan an. Fondamantalman, ki sa ki Ajax pèmèt nou fè a fè yon demann HTTP soti nan kontèks la nan JavaScript. Lè nou ap nan navigatè entènèt nou yo ak nou ap navige alantou paj epi nou klike sou yon lyen, sa ki navigatè nou an, ap pral fè se fè yon demann HTTP mèt fè tout sa lyen nou klike sou. Men sa a pa toujou ideyal paske si se ka a, Lè sa a, tankou David, te di li: nou toujou gen fè divinò klike sou yon bouton anvwaye oswa klike sou yon lyen yo nan lòd fè anyen rive ki nan ale nan enplike yon demann HTTP. Se konsa, avèk Ajax nou ka fè sa yo mande nan non JavaScript. Sa vle di chak fwa itilizatè a reyaji ak paj la oswa yon lòt bagay rive, nou ka aktyèlman fè yon demann pwogramatik nan kèk dosye PHP lòt sou sit entènèt nou oswa tout lòt bagay ak rekipere done yo ki ki dosye krache deyò. Se pou nou pran yon gade nan yon egzanp sou Ajax. Sa a se paj Finans CS50 nou avèk ki èspere ke kèk nan nou yo abitye. Si nou gade nan HTML a nan paj sa a, nou wè isit la ke mwen te ajoute yon bagay kèk, youn nan ki mwen te bay fòm sa a yon ID. Mwen te di id = "fòm-quote". Mwen te fè sa a jis paske li pral fè sa-a yon ti kras ti jan pi fasil chwazi nan Dom nan depi m 'ka jis fè yon rechèch trè senp. Ki sa mwen vle fè isit la se mwen vle ranje kèk pwoblèm ak CS50 Finans. Se konsa, si nou ale nan finance.cs50.net, chak fwa mwen vle jwenn yon quote, mwen gen klike sou bouton sa-a Quote jwenn, e ke Jwenn bouton Quote Lè sa a, pran m 'nan yon lòt paj antye. Men, si mwen vle yon lòt quote, mwen gen frape bouton an nan do ak Lè sa a, mwen tape l 'nan, Mwen ka resevwa yon quote, e mwen frape bouton an Retounen. Sa a vrèman se pa eksperyans nan itilizatè pi bon an. Ki moun ki ta reyèlman itilize sit la si li nan ki dousman jwenn pri stock? Se konsa, ki sa nou vle fè ak Ajax se retire sa etap nan ale nan yon paj separe yo nan lòd yo wè rezilta yo. Ki sa nou ap reyèlman sèlman mande pou se ke pri reyèlman piti, ak sa se sèlman yon kantite lajan reyèlman ti done. Se konsa, gen nan pa gen bezwen pou m 'ale yon lòt antye paj HTML, telechaje yon antye pakèt nouvo sou HTML, petèt telechaje kèk plis imaj, kèk lòt dosye CSS jis pou mwen pou m reponn kesyon ki trè senp kantite lajan sa a pri stock. Avèk Ajax nou ka fè sa a anpil yon pi fasil. Nou wè desann isit la ke mwen ki lye ak nan yon dosye JavaScript rele quote.js. Se pou nou aktyèlman louvri moute ki dosye. Pa jwenn yo. Tout moun nan JavaScript dosye mwen yo pral chita nan HTML pou ke navigatè wèb la ka gen aksè li. Lè sa a, nou gen yon anyè separe isit la pou JavaScript, e kounye a, isit la se quote.js. Nan tèt sa a ranpli sa a di isit la ke mwen vle rete tann pou tout paj la yo dwe chaje mwen anvan m 'eseye fè anyen. Poukisa se sa nesesè? Li sanble ke bagay la pwochen mwen pral fè isit la se kòmansman kap chèche yon eleman ki matche ak kèk seleksyon manm CCELL. Si sa a se JavaScript janm ekzekite anvan yo sa a eleman ki chaje sou paj la, Lè sa a, tout sa mwen eseye fè a pa pral travay paske mwen pral pou yo eseye chwazi yon bagay ki pa gen ankò. Se konsa, liy sa a moute tèt di mwen vle fè w rete tann jiskaske tout bagay se boure se konsa n ap garanti ke nenpòt eleman Mwen kap chèche yo aktyèlman sou paj la. Sa a siy dola isit la vle di m ap sèvi ak bibliyotèk lan te rele jQuery. Sa a bibliyotèk jQuery pèmèt nou sèvi ak sa yo seleksyon ke nou jis te gade. Lè li di $ Lè sa a, pase nan kòm yon agiman sa a # fòm-quote, Mwen kounye a chwazi ki fòm ke nou jis te pran yon gade. Koulye a, mwen gen yon reprezantasyon nan ki fòm nan memwa yon jan kanmenm. Sou sa a objè kounye a, sa a reprezantasyon nan fòm la, Mwen kounye a lè l sèvi avèk yon fonksyon rele sou. Ki sa sa fonksyon fè, se li a pral mete yon kap okipe-evènman. Evènman sa yo ke nou ap ale nan koute pou li a se evènman an soumèt. Se konsa, lè klik yo itilizatè ki Soumèt bouton oswa apwi Antre, evènman sa a ki pral nan dife. By akrochaj nan sa a, mwen kapab kounye a pase sou desizyon konpòtman an default nan fòm nan. San yo pa sa a JavaScript, fòm la ta soumèt bay tou sa PHP dosye nou itilize nan ki atribi aksyon. Men, olye de sa, mwen kounye a li di, rete tann, rete tann, rete tann, mwen pa ta vle nou vin aktyèlman fè sa. Mwen vle sa a rive anvan ou ale epi eseye pou soumèt a kèk dosye PHP. Kounye a ki sa mwen vle fè? Nan pwen sa a mwen vle sèvi ak Ajax yon jan kanmenm chaj nan sa ki pri a nan stock la se. Premye bagay mwen bezwen konnen se sa ki stock itilizatè a ap leve je l '. Pou fè sa mwen pral sèvi ak yon lòt seleksyon manm CCELL. Sa a se seleksyon an twazyèm nou te etidye anvan. Sa a di ke mwen vle kòmanse koupe sa a eleman fòm ak yon ID nan quote fòm-. Lè sa a, yon kote andedan nan ki fòm gen te gen yon eleman D ' ki gen yon non nan senbòl. Si nou gade tounen nan HTML nou an, nou te wè ke nou te gen yon D '[non = senbòl]. Sa vle di ke sa a ki pral chwazi ki bwat tèks ki itilizatè a ap tape nan. Sa a se bèl. Nou gen ti bwat la tèks. Koulye a, nou jis bezwen konnen ki sa ki andedan nan li. Pou fè sa nou kapab rele metòd sa a isit la, sa a Val., ak sa a di mwen konnen ki sa ki bwat tèks ou genyen. Mwen vle fè w di m 'sa li se itilizatè a tape nan ki bwat tèks. Koulye a, nou gen yon fisèl rele senbòl ki se egal a kèlkeswa sa itilizatè a tape pous Sa a se bèl. Nou ka sèvi ak sa fisèl kounye a fè demann nou yo. Sa a se yon fonksyon nouvo isit la, sa a $, eksepte nou ap pa yo pral chwazi eleman, nou ap pral rele yon fonksyon diferan ki nan bay nou pa jQuery. Sa a fonksyon Ajax se sa ki la aktyèlman ale nan fè demann sa a HTTP. Se konsa, nou oblije di li yon bagay kèk. Premye bagay nou dwe di sa a fonksyon se kote mwen vle pou demann la ale a. Yon kote nan pwojè mwen an mwen gen sa a ranpli andedan nan anyè a HTML rele quote.php. Mwen kapab jwenn aksè nan dosye sa a, nou te wè, jis tankou sa a, si mwen ale nan lokalost / quote.php. Mwen vle JavaScript mwen an fè yon demann ak sa yo ki paj. Ki kalite demann kounye a? Nou te wè anvan sa fòm nan gen ki metòd = "post" atribi, ak sa vle di li pral fè yon demann POST, Se konsa li pa ale nan mete anyen nan adrès URL la, olye ke yon demann jwenn, ki ta va jis te tire si nou jis jwenn aksè paj la avèk navigatè wèb la, pou egzanp. Koulye a, nou te di ke mwen vle fè yon demann POST HTTP nan yon paj ki chita nan quote.php. Lè nou soumèt fòm lan, sonje nou te ka gen aksè eleman yo D 'andedan nan ki fòm ak varyab sa a $ _POST. Se konsa, lwen nan istwa a nou pa gen aktyèlman voye ansanm nenpòt done ankò. Nou te jis di nou ap fè yon demann Ajax ak isit la a ki kalite demann nou ap fè. Koulye a, nou bezwen aktyèlman voye kèk done nan paj la. Pou fè sa nou kapab itilize pwopriyete sa a yo rele done. Valè a nan pwopriyete sa a se aktyèlman yon etalaj asosyatif. Rezon ki fè la pou sa a se li pèmèt nou voye plis pase jis moso 1 nan done. Se poutèt sa nou gen sa yo aparèy òtopedik Curly isit la pare solèy andedan nan sa yo aparèy òtopedik lòt Curly. Kle yo nan sa yo ranje asosyatif pwal gen menm bagay la tankou moun yo non atribi nan eleman fòm nou yo. Sa vle di ke si mwen voye ansanm yon kle nan senbòl, sa vle di paj PHP mwen kapab jwenn aksè nan sa a done ak $ _POST [senbòl] jis tankou nou te fè sa anvan lè nou te soumèt yon fòm. Epi, koulye a done yo reyèl nou vle voye a pwal andedan kay la valè de sa a etalaj asosyatif. Nou estoke tèks sa a nan yon senbòl varyab rele, epi pou nou ap voye ansanm kounye a yon kle nan senbòl ak yon valè de kèlkeswa sa itilizatè a tape pous Koulye a, nou te fè demann sa a HTTP, li te dosye PHP nou egzekite, epi li pral voye kèk done tounen kounye a bay kliyan an ki jis te fè demann sa a. Koulye a, nou bezwen yo pou yo reponn tou sa sèvè a di nou. Pou fè sa nou gen pwopriyete sa a dènye isit la yo rele siksè. Valè a nan sa a kle siksè se aktyèlman ale nan yon fonksyon, ak sa a se youn nan bagay ki ou kapab fè avèk JavaScript vrèman fre. Se pa sèlman kapab ou gen antye oswa ranje kòm yon andedan valè de yon etalaj asosyatif, nou ka yo te genyen tou yon fonksyon. Se konsa, lè li di siksè, sa a se kle m 'yo. Yon kolon di isit la vini valè a, e kounye a, valè a nan sa a se aktyèlman yon fonksyon. Se konsa, nou pa bezwen bay sa a fonksyon yon non se pou chak. Nou ka jis di sa a ki pral gen kèk fonksyon. Li nan pral pran 1 agiman. Agiman la sa a fonksyon a pwal kèlkeswa sa sèvè a voye nou tounen soti nan demann lan. Jis tankou lè navigatè nou fè yon demann, sèvè a ap voye yon bagay dèyè ak navigatè a montre li, nan yon kontèks Ajax nou jis te fè yon demann, sèvè a voye yon bagay dèyè, e kounye a, nou te ke reprezante kòm yon kòd. Avèk ki fisèl mwen ta jis tankou yo montre ki sou paj la. Pou fè sa mwen pral gen yon sèl dènye seleksyon manm CCELL. Mwen vle chwazi eleman a ak pri a ID. Sa a se jis yon div vid ke mwen te kreye sou paj la, e mwen vle yo mete sa ki nan ke div yo dwe tou sa sèvè a voye nou tounen. Mwen te aktyèlman modifye quote.php yon ti jan. Olye de rele rann ak rann kèk paj, quote.php koulye a, se tou senpleman ale nan enprime soti valè a nan stock an kòm yon fisèl. Se konsa, si ou te aktyèlman ale nan paj la, ou ta jis wè ke fisèl ti nan tou sa pri a stock se. Youn nan dènye bagay nou dwe fè isit la se jis asire ou ke sa a fonksyon retounen fo. Ki sa sa di se ke si mwen andedan nan yon evènman kap okipe- e ke kap okipe-evènman retounen fo olye pou yo retounen vre, ki vle di ke mwen pa vle evènman orijinal la nan dife. Nan ka sa a, si nou pa t gen okenn JavaScript epi nou soumèt yon fòm, navigatè wèb nou an ki pral di, "Mwen pral voye ke done ansanm," ak yo pwal santi yo voye ba ou nan yon lòt paj. Paske nou ap sèvi ak Ajax, koulye a, gen nan pa gen bezwen voye itilizatè a nan yon lòt paj. Nou jis ap ale nan montre rezilta yo dynamique nan paj sa a menm. Nou vrèman pa vle yo ale nenpòt kote, e mwen vle yo rete sou paj la menm. Se konsa, ki te retounen fo, nou asire ke fòm-la pa fè sa pou nou. Se pou nou pran yon gade nan ki sa sa a aktyèlman sanble. Paj quote nou yo sanble menm bagay la. Kite m 'rale moute enspektè a desann isit la pou nou ka wè sa ki pral sou. Fè li yon ti kras mwens gwo. Sonje si nou louvri moute tab la Network, sa a se kote nou ka wè tout demann yo HTTP k ap pase sou paj la. Pou yon senbòl, kite m 'tape nan aapl, epi klike Jwenn Quote. Koulye a, nou te wè yon pati nan Apple koute kèk nimewo de dola jis parèt sou paj la, men adrès URL la pa t 'chanje nan tout. An reyalite, isit la se demann lan HTTP ke nou jis fè fè yo. Nou te fè yon demann POST quote.php. Ki fè sans. Sa a se sa sèvè a voye nou tounen. Li pa pi long dokiman sa a jigantèsk HTML ak imaj ak bagay sa yo tankou sa, li jis yon liy nan tèks, ak Lè sa a, nou jis parèt liy lan nan tèks. Si nou tounen nan Tèt yo, epi wè ki sa nou aktyèlman voye anndan demann sa a HTTP, nou ka wè 'desann isit la ke nou te voye sou yon kle nan senbòl ak yon valè de aapl, ki se sa ki itilizatè a tape pous Sa a se bèl, men li la toujou yon ti kras anmèdan. Mwen toujou gen klike sou bouton sa-a yo ka resevwa quote a stock. Nou se moun okipe epi nou pa gen tan klike sou bouton. Google reyalize sa a ti kras yon ti tan Anons sa pibliye depi lè yo aplike Google Instant. Ki sa ki Google Instant fè se kòm w ap tape li jis kòmanse montre rezilta pou ou pou w pa gen enkyete sou menm klike Search. Aktyèlman, yon istwa amizan ki gen rapò ak sa. Yon fwa Google Instant te soti, moun yo te tankou, "ola, sa a se super etonan." "Sa a se konsa fre." Ak yon elèv atè nan Stanford ki nan moman an te 19 te fè sit sa a yo rele YouTube Instant. Tout Instant YouTube se efektivman rechèch YouTube imedyatman. Se konsa, olye ke gen pou yo ale nan YouTube.com ak frape Search, lè mwen kòmanse sezisman nan yon bagay Instant YouTube tankou CS50, nou te ka wè isit la ke li nan eseye sou yon koneksyon entènèt dousman peple rezilta sa yo ap viv la. Pou fè sa nou kapab aktyèlman fè yon modifikasyon trè senp nan dosye quote.js nou an. Kounye a, nou ap atache evènman sa a lè yo soumèt fòm nan. Nou pa vrèman vle fè itilizatè a soumèt fòm ki ankò, kidonk kite a olye dife evenman sa a chak fwa itilizatè a apwi yon kle. Pou fè sa a kite l 'premye chanje evènman an soti nan soumèt a keyup. Sa vle di ke olye ke ap tann pou fòm sa a bay soumèt, chak fwa se kle nan bourade, yon bagay ki pral rive. Li pa fè sans nan tache evènman sa a keyup tout fòm nan. Nou vrèman sèlman swen sou ki kazye rechèch ki make. Pou chwazi ki kounye a, nou kapab chanje sa a yo dwe, olye ke quote fòm-, fòm-quote epi nou pral gen yon D '(tape = tèks) oswa nou te ka di (non = senbòl) - tou sa nou vle. Koulye a, gen nan yon sèl bagay dènye nou dwe fè. Sonje desann isit la, lè nou di retounen fo nou te di nou pa vle ke evènman default nan dife. Men, li jis pou k ap pase ke si nou enfim ki koulye a, tou sa nou tape nan pa pral montre moute nan navigatè a ankò paske ki ta ka konpòtman an default nan sezisman nan yon bwat tèks. Nou pa vle pase sou desizyon ki, kidonk kite a detwi sa a retounen fo. Si nou delivre sa ak Reload paj la, kounye a lè mwen kòmanse sezisman aapl ou ap wè ke pri a stock nan pati anba a isit la se ranpli otomatikman. Se konsa, isit la se CS50 Instant Finans. Aktyèlman yon istwa amizan sou YouTube Instant la se ke elèv jis kalite ekri li kòm yon pwojè 1-mitan lannwit, ak jou kap vini an li te ofri yon travay nan YouTube CEO a. Se konsa, kòm senp tankou sa, ou CS50 elèv yo, pwojè final ou a ka fè ou jwenn yon travay nan YouTube. Yon bagay tankou sa a se yon lide vrèman fre pou yon pwojè final, dwa? Nou te gen kèk fonksyonalite ki egziste ke nou te vle entegre avèk yo. Nou amelyore eksperyans nan itilizatè yon ti jan, ak toudenkou chèche yon bagay sou YouTube Instant ta kapab yon pi fasil anpil pase pou chèche l 'sou YouTube regilye. Se konsa, sa a, se Ajax nan yon Nutshell. Nan egzanp yo ke Joseph te montre, nou te wè yon anpil nan autocompletes, ak moun ki autocompletes yo se reyèlman, reyèlman sou la men paske nou pa gen sonje - Pou egzanp, si w pa sonje pri a stock pou Apple ak nou jis konnen li nan yon bagay aa, olye ke jis a ki di mwen, "Yon pati nan bagay sa a koute lajan sa a anpil," Mwen ta kalite renmen konnen sa aksyon kòmanse avèk aa. Nou ka fè ki vrèman joliman ak bibliyotèk la demaraj ki nan deja enkli andedan nan CS50 Finans. Si ou vini isit la yo tag a JavaScript ak woulo liv desann nan Typeahead, sa a se jis yon Plugin bèl gen yon moun ki deja te ekri pou nou, e nou ka byen fasil sèvi ak fonctionnalités li tankou sa a. Mwen tape nan yon A ak isit la se yon lis kèk eta ki kòmanse ak A. Se pou nou di ke mwen panse ke sa a se vrèman fre ak li lè pou mwen pou m gen ladan sa a nan paj m 'yo. Li sanble ke sa a se reyèlman, reyèlman senp. Se pou nou sote sou isit la yo quote3.js. Dosye mwen an sanble yon ti jan diferan. Desann isit la tout bagay Ajax mwen se menm bagay la. Mwen vle chaje done yo stock san yo pa gen pou yo ale nan yon lòt paj. Men, koulye a, mwen ta vle itilize sa Plugin. Dokiman an demaraj gen egzanp gwo sou kouman egzakteman mwen ka fè sa. Mwen vle di, "Isit la nan opinyon an ki mwen vle otokonple sou li a," ak mwen pral rele sa a fonksyon rele typeahead, Epi sa a, ale nan okipe tout nan bagay la Typeahead pou nou. Li pral inisyalize lis la, li pral fè tout Filtered nou an. Bagay la sèlman li bezwen konnen se sa ki done nou ap autocompleting sou. Se konsa, mwen te jwenn deyò sa a kle jis pa lekti dokiman an ak gade nan egzanp yo. Si m 'bay li yon kle nan sous, valè sa a kle se jis kèk etalaj de bagay sa yo mwen vle otokonple sou. Sa a varyab te soti nan sa a ranpli ak lòt. Mwen louvri moute symbols.js. Sa a symbols.js se jis sa a etalaj reyèlman, reyèlman gwo ki gen strings nan tout moun sa yo senbòl stock soti nan nasdaq la. Si m 'vle so tounen nan HTML a, se konsa jharvard, vost, globalhost, html, modèl, quote_form. Depi lè sa a yo rele koulye a quote3.js, kite m 'chanje dosye a JavaScript mwen ki gen ladan isit la. Koulye a, mwen gen quote3.js, se konsa mwen pral chaje nan ki dosye JavaScript ki apa a, youn nan ki gen ke otokonple demaraj. Koulye a, lè m 'so tounen nan navigatè a, Reload paj la, epi mwen kòmanse sezisman aa, gen nan otokonple m 'yo. Epi li te vrèman kòm senp tankou sa. Mwen te gen 1 liy nan kòd ki jis te di, "Isit la yo se bagay sa yo mwen vle otokonple sou li a," ak toudenkou mwen gen sa a fonctionnalités reyèlman, reyèlman bèl ak pa anpil yon antye nan efò nan tout. Kòm w ap devlope sou sit entènèt ak patikilyèman bò nan fen devan bagay sa yo, w ap ale nan jwenn sa a se ka a anpil. Gen yon anpil, anpil, anpil nan bibliyotèk vrèman fre gratis yo deyò ki fè li Super fasil fè bagay sa yo tankou sa a. Èske nenpòt moun kapab panse a okenn lòt dezavantaj nan tou senpleman autocompleting sou lis sa a gwo nan senbòl? Ki sa ki ka yon bagay ki pa pi bon an ak apwòch sa a? Yeah. >> [Elèv] Tan, si ou gen yon anpil nan [fèbl] Yeah. Kounye a, nou ap Téléchargez sa a ranpli JavaScript gwo ak gen nan yon anpil nan senbòl. Se konsa, si nou gen yon ton nan bagay, sa a kalite te kapab nan ogmante latence a nan pa sèlman chèche men tou Téléchargez dosye a vrè. Great. Nenpòt lòt bagay? Kounye a, gen nan pa gen sans reyèl nan enpòtans. Si m 'tape nan yon A, konpayi yo ki montre moute isit la pa ka konpayi yo ki pi popilè ki kòmanse ak A. Mwen anvan m 'jwenn yo Apple, li ta ka pran kèk plis karaktè jwenn sa m ap chache pou. Sa a otokonple pa gen sans sa a nan enpòtans. Li nan jis pral di, "Nenpòt bagay ki matche ak chwa mwen pral montre." Olye pou yo sa, mwen ta renmen yon jan kanmenm entegre kèk enpòtans nan fouy m 'yo. Si m 'ale sou isit la yo Finans Yahoo!, finance.yahoo.com, Si m 'eseye antre nan yon senbòl nan paj Yahoo! Finans la epi mwen kòmanse sezisman goog, mwen gen lis sa a bèl nan bagay sa yo. Klèman, li sanble Finans Yahoo! ap fè yon bagay ki pi entelijan isit la. Yo gen kèk enpòtans ak yo menm tou yo ki gen plis enfòmasyon tankou non an nan stock la. Sa se yon bagay ke mwen pa ka reyèlman jwenn ak jis lis stock m 'lan nan senbòl. Mwen vle sa a ak sa mwen pral pran li. Pou fè sa a kite l 'fè yon bagay kèk. Se pou nou premye louvri moute enspektè a nan paj sa a paske nou te wè ki nan paj sa a se pa sa rupture nan tout, Se konsa, li pwobableman lè l sèvi avèk Ajax yon jan kanmenm yo dwe loading done li yo. Nou ka chèche konnen kisa done li nan loading. Si m 'klike sou sa a tab Rezo, sa yo pwal gen tout demann yo ki kòmanse yo dwe te tire. Koulye a, si mwen tape nan goo, nou ka wè ke mwen fèk resevwa yon demann HTTP nouvo. Sa a se pwobableman ki kote done ap vini soti nan. Asire w ase, si mwen gade nan sa a URL, ki se yon ti jan etranj nonmen non li, nou ka wè ke sa a se egzakteman ki kote Yahoo ap voye koupe done li yo soti nan. Mwen te kreye yon dosye separe ki rele suggest.php sa a, se trè menm jan an nan lespri fonksyon an Passage. Li nan fondamantalman pwal fè yon rechèch URL Yahoo a, jwenn tounen kèk done, epi voye li tounen nan m '. Koulye a, olye ke lè l sèvi avèk sa a gwo, gwo lis senbòl, M ka sèvi ak bagay sa yo bèl Yahoo a l'eee, e mwen pa bezwen download ki masiv JavaScript dosye-a. Mwen sèlman pral rale desann senbòl yo stock aktyèlman ki enpòtan. Se pou nou Ale nan sa. Se konsa, html, js. Nou se kounye a nan quote4. Koulye a, nou ap pa lè l sèvi avèk ke lis gwo nan JavaScript dosye. Men genyen yon kalite ti pwoblèm konsepsyon isit la. Nou te di ke Yon a nan Ajax se asenkron. Ki sa sa vle di se ke lè mwen fè yon demann Ajax, Se konsa isit la sou liyn 8, sa a se ki kote demann Ajax mwen aktyèlman yo te tire. Se pou nou di koulye a, mwen gen kèk kòd desann isit la ki nan pral fè kèk bagay renmen alète itilizatè a oswa yon bagay chanjman nan paj la. Kisa ki pa nan pral rive se navigatè a pa pral rete tann pou demann sa a yo kontinye anvan li te vini desann ak frape liy sa a. Sa a se pati nan asenkron. Li nan pral fè demann sa a ak di, "Chak fwa ou fini, "Vin retounen lakay yo epi rele ki fonksyon ki mwen te di nou yo rele andedan nan siksè." Sa vle di nou pa ka jis download tout aksyon yo davans. Nou bezwen fè demann lan epi rete tann pou yon bagay li vle tounen. Sa vle di ke anvan, nou te ka tou senpleman di demaraj, "Isit la nan lis la de bagay sa yo mwen vle fè w otokonple sou." Nou pa kapab fè sa ankò paske nou pa konnen sa nou vle aktyèlman otokonple sou. Chans, demaraj te panse de sa a paske sa yo se nèg entelijan lòt bò a, epi yo aktyèlman te ban nou yon lòt fason yo chaje sa a Plugin Typeahead. Anvan, valè pwopriyete sa a sous te jis sa a etalaj gwo nan bagay yo otokonple sou. Koulye a, pwopriyete a sous se aktyèlman yon fonksyon, ak objektif sa a, fonksyon se konnen sa ki bagay yo otokonple sou yo. Wout la li pral kalkile ki soti se li nan pral mande Finans Yahoo! ki sa bagay sa yo pi bon yo otokonple yo ye. Pou fè sa mwen pral fè yon trè menm jan Ajax demann. Mwen pral mande paj sa a nan suggest.php. Mwen vle voye ansanm senbòl yo te toujou. Epi, koulye a siksè m 'yo, dokiman an demaraj te di m' ke yo nan lòd peple ke lis de bagay sa yo, tou sa m 'bezwen fè se pase nan sa a etalaj kounye a nan fonksyon an kalbak. Men, tann yon minit. Si sa a se sipoze yon etalaj ak Ajax ap voye m 'tounen tèks, ki jan se ke posib? Sa a entwodui yon nouvo fason pou echanje done rele JSON. Nan ka sa a nou pa jis ap voye tounen yon kòd senp nan tèks. Koulye a, nou ap fè fas ak lis sa a nan senbòl stock pi konplike. Sa yo senbòl stock kapab tou gen ladan bagay sa yo tankou non konpayi an oswa pri yo kounye a. Jis lè l sèvi avèk yon gwo fisèl long ki pa nan fòma nan nenpòt fason previzib pa a pwal pi bon fason yo jwenn sa a done ki sòti nan sèvè Yahoo a fè m ' nan yon fason ki mwen ka byen fasil konprann. JSON se yon teknoloji ki pran avantaj de kouman pou nou kreye ranje asosyatif nan JavaScript. Sa a sanble yon sanble anpil ak yon etalaj asosyatif JavaScript, ak nan reyalite, li nan paske li se. JSON kanpe pou Notasyon JavaScript objè. Sa a se fondamantalman yon dakò sou fòma pou transfere done retounen ak lide. Isit la sa a JSON objè oswa sa a JSON etalaj asosyatif ap voye m 'kèk done sou yon kou. Kle yo nan sa a etalaj yo se bagay sa yo tankou kou ki gen yon valè de cs50, , li desann isit la nou kapab wè ke mwen ka gen yon valè ki se yon etalaj. Mwen pa bezwen fè bagay sa yo tankou analizan soti strings epi gade pou vigil ak fè bagay sa yo fou tankou sa. Paske sa a se te deklare nan fòma sa a JSON, JavaScript ak jQuery deja gen fonksyon konvèti yon kòd ki sanble tankou sa a JSON nan yon vrè etalaj asosyatif JavaScript ke nou ka travay avèk yo. Lè w fè sa se kòm senp tankou li di ke pa gen okenn ankò se sa a ranpli, suggest.php, voye m 'tounen tou senpleman yon afè de tèks, Men, mwen konnen li nan yo pral voye m 'tounen JSON. Sa vle di ke ki JSON ka konvèti nan yon etalaj asosyatif JavaScript. Se konsa, jQuery, mwen ta renmen ou fè sa pou mwen. Sa vle di ke sa a repons paramèt isit la, sa a se pa pi long jis yon fisèl. Paske nou te di jQuery ki isit la vini kèk JSON, jQuery a pwal entelijan ase yo di, "Ou te vle JSON?" "Mwen pral konvèti ki nan yon etalaj asosyatif pou ou." Se pou nou aktyèlman pran yon gade nan tab la Rezo yon fwa nou gen quote4.js. Nou pral chanje sa a ak Reload paj la. Koulye a, mwen pral tape nan yon yon-ankò. Mwen te fè yon demann koup suggest.php, men kounye a repons sa a, olye ke sèlman fisèl la, li nan JSON. Se konsa, mwen gen yon louvri atèl Curly di, "Men vini yon etalaj asosyatif." Kle a premye ak sèlman sa a etalaj asosyatif yo rele senbòl, ak Lè sa a, isit la se yon etalaj nan tout nan senbòl yo ki enpòtan vini kounye a soti nan Depatman Finans Yahoo!, pa ka soti nan ke lis konstriksyon. Sa a se kouman mwen ka tou senpleman peple sa a Plugin otokonple ak kèk done ki pa la vini soti nan yon dosye lokal ki nan deja Predetermined Men, nan yon lòt bagay. Li sanble ke nou ka aktyèlman pran avantaj de yon teknoloji ki rele JSONP, oswa JSON ak kouvèti, ki pral elimine sa a entèrmedyèr suggest.php. Men, olye pou yo fè sa, kite la olye pran yon gade nan ki jan mwen ka amelyore sa a menm plis. Mwen vrèman renmen Typeahead demaraj la. Li nan reyèlman bèl. Men, nou ap vin bon nan JavaScript e nou vle kalite fè sa tèt nou, petèt pran yon gade nan ki sa sa a Plugin te kapab fè. Kite a pa sèvi ankò ak ke bagay Typeahead, epi kite nan eseye fè lis sa a nan sijere aksyon tèt nou. Isit la nan quote6.php nou pwal kòmanse nan menm jan an. Chak fwa yon moun kalite yon bagay, nou vle fè yon demann Ajax. Sa a se menm jan ak Instant orijinal Finans nou CS50. Olye de fè yon demann yo voye quote.php, kounye a nou ap fè yon demann ak sa yo ki dosye menm jan ak anvan, sa a suggest.php, ki se jis pral rale done ki sòti nan Finans Yahoo!. Ankò, nou toujou ap tann JSON, men kounye a depi Typeahead la pa fè sa pou nou, nou menm tou nou bezwen voye ansanm valè a se sa ki andedan nan bwat la tèks ye kounye a. Koulye a, nou konnen ki sa yo mande Finans Yahoo! pou li a, ak konsa koulye a isit la nan fonksyon an ke nou vle akonpli yon fwa demann lan konplete. Nou pa gen Plugin la fè lis la pou nou, Se konsa isit la nan kote n ap aktyèlman pral bati yon lis sijesyon. Pou fè sa, anpil renmen nan PHP nou anchene sa yo strings gwo HTML Lè sa a, nou enprime yo, nou ka fè menm bagay bagay la egzak nan JavaScript. Premye nou pral kòmanse nan sa a fil ki rele sijesyon, ak sa a fisèl se jis ale nan genyen kèk HTML. Nou vle li nan dwe yon lis de bagay sa yo, se konsa nou pral kòmanse an ak nan sa a tag lis, e kounye a nou ap ale nan repekte sou tout nan senbòl yo ki te tounen tounen ban mwen. Sonje byen, paske nou te di datatip: 'json', sa a se pa yon kòd. Sa a se deja yon etalaj pou nou. Sa a se vrèman fre. Nou ka tou senpleman di, "mwen vle nou ajoute yon eleman lis." Nou pral mete l 'andedan yon eleman yon nan bò nan sa, nou pral bay li yon klas nan sijesyon konsa nou konnen sa li ye, e kounye a, isit la se senbòl la ke nou te tounen soti nan Depatman Finans Yahoo!. Yon fwa nou te kreye yon eleman pou chak nan senbòl yo nou te vinn tounen, nou jis vle fèmen nan lis la. Se konsa, kounye a sijesyon reprezante sa a fragman ti kras HTML ke lè mete yo sou yon paj a pwal lis la nan bagay sa yo nou ap chèche pou. Koulye a, kite a aktyèlman mete sa sou paj la. Pou fè sa mwen te aktyèlman kreye yon lòt div vid ak mwen te bay li yon ID nan sijesyon. Anpil tankou nou mete sa ki nan div a ki ta montre pri a nan done yo stock, kounye a nou jis vle mete sa ki nan sa a div mèt fè tout sa sa a fisèl se ki gen sa yo senbòl. Lè l sèvi avèk metòd sa a HTML, sa a varyab sijesyon, sa a fisèl, se yon afè de HTML. Mwen vle fè w pran ki HTML li mete l 'anndan div la te rele sijesyon. Nou te jis fen liv yon bagay yo Dom a kounye a. Nou te ajoute kèk eleman nouvo nan Dom a ke nou kapab kounye a montre sou paj la. Ann gade pou wè ki sa sa a sanble. Si nou chaje nan quote6 e kounye a, nou tounen, kounye a lè mwen kòmanse sezisman aapl, nou pa gen ke demaraj otokonple, men nou genyen kounye a nan lis sa a ke nou te fè tèt nou. Sa a se yon uglier ti jan pase Typeahead nan demaraj, pou egzanp, men li pèmèt nou fè yon lòt bagay. Lè nou te gade nan ki Plugin demaraj, nou te wè ke lè nou autocompleted, youn nan valè yo otokonple te aapl. Sa pa ta ka fèt konsa itil. Kòm yon itilizatè, mwen pa ta ka imedyatman rekonèt tout nan senbòl yo stock. Ki sa ki mwen pwobableman plis chans yo rekonèt yo, se non reyèl konpayi an. Se konsa, pa li ta kapab pran vrèman itil si olye ke li di aapl sa a te di yon bagay tankou Apple Inc Paske nou te woule sa a tèt nou, nou ka vrèman fasil fè sa. Se pou nou louvri moute dosye dènye quote nou yo isit la, se konsa quote7. Menm bagay sa yo. Mwen te jis te kreye yon lòt dosye PHP ki pral retounen nan nou pi plis pase jis senbòl yo. Li pral tou ba nou tounen non konpayi an. Se konsa, n ap fè menm bagay la. Nou ap fè yon demann Ajax. Yon fwa gen demann ou fin ranpli a, nou ap ale nan egzekite fonksyon sa a isit la, ak sa a fonksyon ki pral konstwi yon fisèl gwo nan eleman. Men, diferans lan isit la se ke valè a nan sa yo bay lis se pa jis senbòl la, li nan kounye a non la. Se konsa, nou gen yon sèl ti pwoblèm. Lè nou itilize Passage nou an, nou bezwen yon jan kanmenm pase l senbòl la. Nou pa ka pase Passage yon bagay tankou Microsoft Corporation. Nou bezwen pase l msf. Lè nou ap ekri HTML, nou gen anpil bagay nan atribi bèl bati-an. Yon Yon ta ka asosye ak li yon rèf oubyen nan klas yon. Men, sa nou te reyèlman bezwen kounye a se pou chak nan sa yo lyen gen yon senbòl stock asosye ak li. Gen nan pa gen bati-an HTML atribi pou senbòl stock, men Chans pou, HTML5 pèmèt nou kreye atribi pwòp nou yo dwe tou sa nou vle. Lè li di done-senbòl, mwen te entwodwi yon atribi nouvo mwen ki gen non jis te fè leve, e sa se oke paske mwen précède l 'ak done sa yo. Nou pral nan magazen andedan nan gen senbòl la nan stock la kounye a. Ki sa sa vle di se ke menm si nou ap montre valè a nan non konpayi a andedan nan otokonple nou yo, nou toujou ap sonje senbòl la ki asosye avèk chak konpayi. Wout la n ap fè se sa ki andedan nan sa a eleman tèt li. Se konsa, sa vle di nou bezwen fè yon sèl plis chanjman. Lè nou klike sou li kounye a, nou bezwen aktyèlman pran avantaj de atribi nan senbòl olye ke jis valè li yo. Si nou tounen moute, nou mete yon kap okipe-evènman sijesyon. Chak fwa youn nan sa yo sijesyon se klike, koulye a, mwen vle fè yon bagay. Ki sa mwen vle fè se chanje valè sa a nan bwat D '. Koulye a, mwen vle mete sa a fonksyon Val menm. Se konsa, san okenn agiman sa a fonksyon Val retounen nan ou sa ki nan deja nan ti bwat la tèks, Men, si ou ba li yon fisèl, li pral pran ki kòd li ansanm ak mete l 'nan ti bwat la tèks. Mwen chwazi bwat tèks li yo nan menm jan an. Non Li a se andedan senbòl nan quote fòm-. Koulye a, mwen voye l valè a nan atribi a done-senbòl. Bagay sa a isit la se nouvo, sa a $ (sa a). Ki sa sa vle di se eleman ki ki te klike. Nou ka wè isit la ke nou pa atache yon evènman klike sou nan chak eleman ki gen yon klas nan sijesyon endividyèlman. Olye de sa, nou ap apwoche sa a ti kras yon lòt jan. Olye de sa n ap di chak fwa andedan anyen nan sa a div sijesyon, ki sonje se jis veso a pou ke lis, si se yon bagay ki andedan sa a div klike ak li gen yon klas nan sijesyon, Mwen vle evènman sa a nan dife. Fondamantalman ki sa sa a vle di nou ka fè se nou ka jam itilize sa a kap okipe-evènman menm pou tout nan bagay sa yo nan lis la. Se konsa, nou pa bezwen gen yon sèl kap okipe-evènman pou eleman nan premye ak yon kap okipe-evènman diferan pou eleman, dezyèm lan. Nou ka olye di, "Mwen vle kap okipe-a evènman menm pou aplike nan tout bagay nan lis mwen an." Men, nou bezwen yon jan kanmenm konnen ki eleman te klike. Sa a "sa a" mo kle reprezante sèlman sa. Sa a se objè a ki te jis klike pa itilizatè a. Si m 'jis klike lyen ki 3rd, sa a reprezante eleman nan ki genyen lyen ki 3yèm, ki vle di ke mwen ka jwenn atribi li yo, done-senbòl, ki nou konnen gen a ki genyen senbòl la ki nan ki asosye ak konpayi an mwen jis klike. Si nou sote tounen nan paj finans nou an, nou ka wè kounye a ke yon fwa mwen kòmanse sezisman yon bagay tankou msf, nou ap pa jwenn jis senbòl yo stock, kounye a nou ap resevwa konpayi yo ki aktyèl. Men, lè mwen klike sou youn nan konpayi sa yo, nou ka wè ke nou ap aktyèlman pepleman ti bwat la tèks pa ak non an nan konpayi an Men, se avèk tou sa te estoke andedan nan tout sa yo atribi done. Se konsa, si mwen aktyèlman enspekte youn nan eleman sa yo pa dwat klike li epi klike Enspekte Eleman, nou ka aktyèlman wè sa ki sa a sanble. Sonje sa a se yon bagay ke nou te kreye andedan nan ki pou riban lè nou t'ap bati moute ke afè de HTML. Nou ka wè isit la ke sa a done-senbòl gen valè a nan msf, ki se gwo. Sa a ki sa nou te espere. Sa a se senbòl la ak lè sa a jan nou te resevwa valè a ke nou bezwen yo sèvi ak andedan nan bwat sa tèks. Sa a se ase pou fòm nan quote paske sa a, se kalite raz. Se pou nou jis fè kèk amelyorasyon rapid nan paj pòtfolyo nou an. Si ou te itilize CS50 Finans pou yon ti tan epi ou kòmanse achte ak vann yon anpil nan aksyon, evantyèlman tablo sa a ki pral jwenn bèl gwo, ak w ap ale nan vle yon montr stock, nan kou. Yon fwa tab la se reyèlman, reyèlman gwo, li ka itil pou itilizatè a pou yo eseye rechèch sou li. Anndan nan bwat rechèch la si mwen kòmanse sezisman yon bagay tankou Disney ak kap chèche stock Mickey Mouse m 'yo, nou ka wè ke tab la se kounye a filtraj ki baze sou sa m 'jis tape pous Sa a fonctionnalités sanble super konplike, men li la reyèlman, reyèlman fasil ak jQuery ak JavaScript. Sa a ranpli portfolio.php gen ladan yon dosye JavaScript rele portfolio.js. Se pou nou pran yon gade nan sa. Se konsa, html, js, pòtfolyo. Isit la nan kote n ap fè sa chache sou tab la. Premye bagay mwen bezwen fè se mete yon kap okipe-evènman ak sa yo ki bwat tèks paske nou konnen nou vle fonksyon filtraj nou nan dife chak fwa itilizatè a apwi yon bagay paske nou pa gen tan pou bouton Search. Premye bagay nou bezwen fè se konnen sa ki itilizatè a ap chèche pou li a, jis tankou nou te fè sa anvan. Sa a mo kle refere a eleman aktyèl la itilizatè a ap kominike avèk. Paske itilizatè a ap kominike avèk bwat rechèch la, $ Sa a reprezante bwat rechèch la, Se konsa this.val ban nou Ki sa ki andedan nan bwat rechèch la itilizatè a se kounye a sezisman. Se konsa, kounye a ki sa nou vle fè se nou vle repekte sou tout nan ranje yo andedan nan tablo nou an. Pou chwazi tout ranje yo nan tablo nou an, mwen te bay ki tab yon ID nan pòtfolyo tab, epi li se chak ranje reprezante pa yon eleman TR, kidonk sa a seleksyon ki pral tounen vin jwenn mwen yon etalaj gwo nan tout ranje yo nan tablo m 'yo. Koulye a, mwen vle repekte sou ki etalaj. Mwen te kapab ou yon pou riban, men jQuery aktyèlman bay nou fonksyon an bèl rele "chak." Ki sa ki fè, se chak chak pran yon agiman, e ke agiman se yon fonksyon. Ki sa ki li pral fè se li pral pou aplike pou ke fonksyon bay chak eleman andedan nan lis sa a. Sa a fonksyon pran youn agiman ki nan e, ak ki lè sa a fonksyon egzekite, sa a e yo pral ranplase ak premye ranje a, Lè sa a, dezyèm ranje a, ak Lè sa a, twazyèm ranje a. Lè sa a fason, sa a se menm bagay la kòm kouri yon pou riban ak Lè sa a, lè n ap kalkile eleman aktyèl la ki baze sou andedan an endèks nan ou a pou riban. Nan chak iterasyon, pou chak nan eleman sa yo nan tablo a, Mwen vle tcheke si tèks la nan eleman a - tèks la nan selil la andedan nan ranje a - matche ak sa m ap chèche pou. Sa a fisèl gwo long nan kòmandman ki jan mwen ka fè sa. Premyèman, ankò, sa a kounye a refere a - paske li nan andedan nan yon fonksyon nouvo - sa a se kounye a ranje aktyèl la nan tablo a. Mwen vle pran ranje aktyèl la nan tablo a, e mwen vle jwenn tout timoun li yo. Sonje byen, Dom la se yon pyebwa yerarchize, ki vle di ke eleman gen yon nimewo nan timoun yo. Sa a. Timoun fonksyon ki pral tounen vin jwenn mwen tounen yon etalaj de tout nan eleman yo ki se timoun yo nan, nan ka sa a, yon ranje nan tablo a. Sa a se jis senpleman selil yo andedan nan ranje a. Mwen jis vle nan rechèch sou selil la an premye. Sa a. Fonksyon premye di, ban m 'eleman nan premye nan ki etalaj. Lè sa a, fonksyon an tèks di m 'jwenn ekzakteman ki sa ki andedan nan selil sa a depi mwen vle nan rechèch sou ki tèks. Finalman, kite a konvèti li nan miniskil, pou nou ka fè tèks ka queries bra kwaze. Finalman, nou vle wè si sa fisèl andedan yon tab gen fisèl la nou 're chache. Fonksyon an indexOf nan JavaScript fè sèlman sa. Li di nou si ou pa sa a fisèl gen yon lòt fisèl. Si li la vre ke selil la gen sa m ap chèche pou, Lè sa a, mwen vle asire ke li nan yo montre a. Metòd la montre ap di, "Montre eleman an." Si sa a se pa ka a, lè sa a sa vle di tou sa mwen pou chèche se pa sa ki nan ki ranje, ak Se konsa, mwen vle kache a soti nan itilizatè lan. Sa rive reyalize pwogrè ki efè bèl filtraj kote pa gen okenn ankò nou gade nan tablo ki an tout antye. Si w ap enterese nan kòman yo fè sa a montr kòm byen, nou pral afiche sous la sou entènèt. Men, li la vrèman senp. JQuery gen metòd awizom pou sa yo Animations ak manipile CSS pwopriyete yo. Se konsa, sa a, se li pou mwen. Ki sa ki Lè sa a, tann pi devan? Kòm ou pral wè nan kèk jou, final pwojè pwopozisyon an ki dwe. Final pwojè pwopozisyon a pral mande w kèk kesyon, Men, nan mitan yo pral twa jalons - yon sèl yon "bon" etap enpòtan, youn yon etap enpòtan pi bon, ak yon yon pi bon. Lide a ke yo te reyèlman ede ou guys mete ap atann ou a pou ke minim ou yo pral kontan ak pwodiksyon an nan pwojè final ou a epi li pral "bon" byen lwen tèlman kòm ou gen enkyetid. Men, Lè sa a, nan enterè pou trape ou yo rive jwenn jis yon ti jan a yon bagay pi bon oubyen yon bagay pi byen, nou pral tou sòt de pouse ou nan direksyon ki tankou byen. CS50 Hack-yon-ton la, pandansetan, se nan yon semèn. Tipikman, nou fè sa sou yon baz baz lotri paske nan enterè, men chans yo se nou ap pran yon santèn kèk nan nou nan bis navèt soti nan Harvard Square desann nan Kendall Square kote Microsoft te gen yon etablisman bèl jistèman rele "nèrd" - New England rechèch la ak Sant Devlopman. Nou pral jwenn gen alantou 8 pm Nou pral gen kèk manje. Anviwon 1 a.m. nou pral gen kèk plis manje. Anviwon 5 am si w ap toujou reveye nou pral mete tèt sou nan IHOP oswa pran ou tounen nan lakou lekòl la. Objektif la gen plonje nan pwojè final ansanm ak nan kondisip ak anplwaye yo. Lè sa a, nan kèk jou plita se san Patipri a CS50, ki se vrèman vle di yo dwe yon opòtinite pou ou nèg montre travay ou ak travay li fè pou semès la pandan y ap fwote zepòl youn ak lòt yo ak pou jwenn yon sans de sa chak moun te fè sa. Avèk ki te di, mèsi anpil moun Tommy ak Jozèf, epi nou pral wè ou nan Lendi.  [Aplodisman]