[Powered by Google Translate] [Wythnos 9, Parhad] [David J. Malan - Harvard University] [Mae hyn yn CS50. - CS50.TV] 

Mae hyn yn CS50. Dyma ddiwedd yr wythnos 9. Diolch yn fawr iawn. Yn olaf. Wythnos 9. Cawn ef. Heddiw rydym yn parhau ein sgwrs am rhaglennu ar y we nid gyda llygad tuag at y prosiect terfynol, gan fod yn rhaid i chi wneud rhywbeth ar y we ar gyfer prosiectau terfynol ond oherwydd naill ai ar gyfer prosiectau terfynol neu ar ôl CS50 hyn yn sicr i ba gyfeiriad y feddalwedd modern yn mynd. Ac eto nid yw'n mewn gwirionedd yn beth hawdd. Yn wir, un o'r pethau anoddaf i'w wneud yw agwedd o ddylunio. 

Er enghraifft, drwy ddyluniad rydym yn golygu mewn gwirionedd yn cael y rhyngwyneb defnyddiwr neu 'r profiad y defnyddiwr yn iawn. Mentraf ddweud - a gwyddom o set problem ddiweddar pan fydd rhai ohonoch darlledu eich gripes am rai darn o feddalwedd neu galedwedd sy'n gwylltio chi, p'un ai ar y campws neu oddi ar - mae llawer o safleoedd i maes 'na, mae llawer o galedwedd i maes' na, y math hwnnw o sucks. Ond y gwir amdani yw bod gwneud pethau sy'n hawdd i'w defnyddio eto serch hynny pwerus yn her anodd iawn. Felly, ar gyfer heddiw gofynnais Joseph a Tommy i ymuno â mi i fyny yma fel y gallwn gael sgwrs, y ddau am ddylunio a beth ddylai math o brosesau meddwl dechrau mynd drwy eich pen pan fyddwch yn dylunio eich prosiectau terfynol, eich ymdrechion yn y dyfodol. Ac yna gyda Tommy chymorth byddwn yn edrych ar rai o'r manylion gweithredu. Sut y gallwch chi gael rhywfaint o weledigaeth ar bapur neu yn eich meddwl y gallwch wedyn gweithredu programmatically drwy ddefnyddio rhai o'r technolegau a'r technegau rydym newydd ddechrau siarad am, sef JavaScript a rhywbeth hyd yn oed mwy newydd, sef AJAX, JavaScript asynchronous. Mae hynny'n caniatáu i chi greu holl deinamig mwy o ryngwyneb defnyddiwr drwy nôl data mwy a mwy yn gynyddol o'r gweinydd. Felly, byddwn yn gweld rhai o'r pytiau yn dda heddiw. Fel o'r neilltu, os oes gennych ddiddordeb i ganolbwyntio mewn gwyddoniaeth gyfrifiadurol neu minoring mewn gwyddoniaeth gyfrifiadurol, yn gwybod bod y dydd Gwener hwn am hanner dydd yn Maxwell Dworkin 221 bydd digwyddiad pizza lle y gallwch ddysgu ychydig mwy am wyddoniaeth gyfrifiadurol. Ar eich ffordd allan y drws heddiw byddwch yn gallu codi canllaw answyddogol i CS yn Harvard. Byddwn yn ei roi ar y caniau sbwriel y tu allan ar uchder gwasg felly os hoffech chi i fanteisio ar hyn ac yn dysgu ychydig mwy am CS, a fydd yn yno i chi fel yr oedd yn wythnos 0. Hefyd, os hoffech chi ymuno â ni am ginio CS50 dydd Gwener yma am 1:15 pm, ben i cs50.net/lunch. Heb wastraffu mwy o eiriau, yr wyf yn rhoi i chi cyd-athrawon Joseph Ong. Hi. [Cymeradwyaeth] Diolch. Y tro cyntaf i mi ddysgu am ddylunio oedd mewn dosbarth yma o'r enw CS179. 

Mae'r athro ar y pryd wedi dweud wrthym y stori am athro arall a oedd wedi mynd i westy ac yn defnyddio'r faucets. A all unrhyw un ddweud wrthyf beth y 2 knobs ar y chwith a'r dde yn ei wneud? [Myfyrwyr] poeth ac oer. >> Poeth ac oer. Da. Beth allwch chi ei ddisgwyl fel arfer, dde? Mae hyn yn athro ar ôl defnyddio'r faucet am gymryd cawod, ac mae'n mynd yn ei flaen i ddefnyddio hyn. Mae'n meddwl y chwith a'r ochr dde ar gyfer poeth ac oer, dde? Gall ond gall unrhyw un ddweud wrthyf beth yw'r rhain mewn gwirionedd yn ei wneud? Unrhyw dwylo? [Ymateb y myfyrwyr Anghlywadwy] >> Un awgrym yw? [Ymateb y myfyrwyr Anghlywadwy] Tymheredd >>? Felly, un ohonynt rheoli tymheredd a rheolaethau eraill? >> [Myfyrwyr] pwysau Dŵr. Pwysau Dŵr. Da. Mae'r athro yn cerdded i mewn i hyn ac, a meddwl eu bod yn cael eu rheoli poeth ac oer, yn troi yr un cywir, sydd yn ei farn ef ar gyfer poeth, yr holl ffordd i fyny oherwydd ei fod am i gymryd cawod gynnes. Wel, nid yw'r rhain yn wir yn cyd-fynd i fyny, felly ei fod yn cael y profiad hwn nid yn hwyl o fod mewn cawod oer, ac rydym i gyd yn gwybod beth sy'n teimlo fel. Mae hyn yn enghraifft o nam dylunio. Beth allaf i ei olygu wrth hynny yw ei disgwyl oddi wrth y faucet nid oedd yn cyfateb i'r hyn a ddaeth allan o'r gawod, sy'n fath o anffodus iddo. Felly, mae hyn yn enghraifft o wendid ddylunio sy'n digwydd mewn bywyd go iawn. Ond rydym yn gweld pob math o rai eraill hefyd. Rydym nid yn ôl pob tebyg gefnogwyr y system MBTA. Mae hon yn system isffordd mewn gwirionedd yn Llundain, sy'n dweud, "Nid yw'r botwm yn cael ei ddefnyddio." Pam ei fod hyd yn oed ar yno? Pam rydyn ni'n hyd yn oed yn gofalu? Pan oeddwn yn blentyn, fod yr un savvy dechnoleg yn y tŷ, pryd bynnag y byddai'r cyfrifiadur yn chwalu, byddai fy mom yn dod i mi, dangos fy hyn yn sgrin a gofyn i mi beth a ddigwyddodd. 

Hyd yn oed Nid wyf yn gwybod beth y mae hyn yn ei olygu. [Chwerthin] Beth? [Chwerthin] Weithiau rydym yn teimlo fel ddatblygwyr meddalwedd yn unig trolling ni. Fel defnyddwyr rydym fel, "Beth sy'n mynd ymlaen? Rhywun ddweud wrthym." Mae hyn i gyd yn dod i lawr i fater o ddylunio. Dylunio, fel y gallwn weld, nid yn unig am estheteg, nid yw'n ymwneud â sut mae pethau'n edrych. Rydym yn gweld yma fod hyn ychydig pop-up dros yma mewn gwirionedd yn edrych yn eithaf neis. Mae ganddo cysgod galw heibio yn y cefndir, mae ganddi radiuses ffin yn mynd ymlaen. Mae'n fath o 'n bert. Dyw hi ddim yn dda iawn a gynlluniwyd gan nad yw'n hawdd iawn. Nid yw ychydig o pop-up sy'n dod i fyny yn wir yn rhoi unrhyw wybodaeth i mi am beth sy'n mynd ymlaen, nid yw'n dweud unrhyw beth i mi fel y defnyddiwr am sut i adennill oddi wrth y camgymeriad. Rydym eisiau i feddwl am bethau bod dyluniad yn peidio. Yn gyntaf, nid yw'n estheteg. Nid Mae hefyd yn stwffin eich app gyda tunnell o functionality diangen. Os ydych chi'n bwyty Thai, mae'n debyg nad ydych am fod yn ddeintydd ar yr un pryd. Ac nid â Chwestiynau Facebook, fod llawer o bobl yn ei ddefnyddio ac nid oedd yn wir wrth wraidd yr hyn y maent yn adeiladu. Ac felly mae'n braf i beidio â meddwl am gymaint faint y pethau eich bod yn rhoi i'ch cais ond mae ansawdd a sut yr ydych chi'n gwneud y profiad y defnyddiwr yn well drwy gwella mewn gwirionedd ar yr hyn sydd gennych eisoes. 

Yn gryno, dylunio yn dweud wrthym beth y dylem adeiladu. Er enghraifft, os ydym yn adeiladu rhywbeth sy'n gadael i ni chwilio pethau i fyny, fel Google, er enghraifft, a ddylem wneud pethau mewn modd sy'n ei gwneud yn ofynnol i'r defnyddiwr i gymryd llawer o cliciau i gyrraedd yr hyn y maent ei eisiau, neu a ddylem wneud hynny mewn ffordd, er enghraifft, gyda Google Instant neu awtogwblhau sy'n gadael i ni gyrraedd ein canlyniadau yn gyflymach? Peirianneg yn cynnwys, fel y bydd Tommy yn dangos i chi, mewn gwirionedd yn adeiladu arno. Mae llawer o fathau o ddylunio. Er enghraifft, os ydych yn adeiladu rhywbeth i ddefnyddio rhywbeth mewn gwlad y Trydydd Byd lle nad oes llawer o drydan neu y dechnoleg lawer, rhaid i chi ddylunio hyn yr ydych yn adeiladu mewn ffordd sy'n hawdd rhoi mynediad at y bobl yno. Ond beth y gallai mathau o benderfyniadau dylunio eraill fod neu a allai fod yn rhan o rywbeth fel hyn? Yeah. Rwy'n gweld llaw. [Ymateb y myfyrwyr Anghlywadwy] Hawl >>. Yn union. Mae hygyrchedd yn un peth. Nid yw llawer o bobl yn meddwl am, "Beth am fy defnyddwyr?" fel y eithafion y naill neu'r llall sbectrwm. Mae gen i ddefnyddwyr a allai ag anableddau nad ydw i'n meddwl am a Im 'jyst yn meddwl am ddylunio ar gyfer y defnyddiwr gyffredinol. Mae'r Rhyngrwyd yn hygyrch i bawb y dyddiau hyn, ac os caf fy dylunio ar gyfer y bobl hynny yn ogystal. Beth allai fathau o benderfyniadau dylunio eraill yr ydych yn ei wneud? Ydw. >> [Myfyrwyr] Cost. Cost. Da iawn. Peth arall efallai y byddwn yn seilio ein penderfyniadau dylunio ar eu cost. Os ydym yn fusnes, ydych am adeiladu rhywbeth nad yw'n cymryd costio llawer i gynhyrchu ond gall gwerthu am gost arbennig o uchel neu a all gael rhywfaint o elw i ni. 

Mae'r rhain i gyd yn fathau gwahanol o ddylunio, ond pan fyddwn ni'n adeiladu rhywbeth ar y Rhyngrwyd neu pan fyddwn ni'n adeiladu rhywbeth yn debyg nad yw'n costio cymaint â hynny i adeiladu i fyny yn awr, fel ceisiadau Rhyngrwyd - nid oes rhaid i chi daflu llawer o gyfalaf i mewn iddo er mwyn gwneud rhywbeth sydd mewn gwirionedd yn gweithio - hyn yr ydym ni'n fwy pryderus yn ei gylch yw profiad y defnyddiwr. Rydym yn galw hyn yn dylunio defnyddiwr yn y canol. Yn y bôn yr hyn a dylunio defnyddiwr yn y canol yn golygu yn rhoi eich hun yn esgidiau eich defnyddwyr. Os bydd rhywun arwyddion ar gyfer yr hyn rwy'n ei adeiladu, maen nhw wedi dod yn amlwg i fy nghais penodol gyda nod mewn golwg, gyda thasg y maent am i'w gwblhau. Ac mae eich swydd yw nid yn unig i'w helpu i gwblhau'r dasg ond i'w helpu i gwblhau'r dasg mewn modd sy'n effeithlon, sythweledol, ac, fel rhywun dywedodd dros yno, yn hygyrch. Beth mae effeithlonrwydd yn ei olygu? Effeithlonrwydd yn golygu pa mor gyflym y mae fy defnyddiwr cwblhau'r dasg a roddwyd fy rhyngwyneb. A yw'n cymryd llawer o cliciau iddynt fynd o un lle i'r llall? A yw'n ddiflas? A oes yn rhaid iddynt berfformio llawer o dasgau ailadroddus? Rydym am sicrhau bod y broses mor effeithlon â phosibl felly nid oes raid iddynt wneud y math o bethau. Fel ar gyfer intuitiveness, hynny yw, er enghraifft, os yw defnyddiwr yn edrych i fyny fy rhyngwyneb, a yw'n hawdd iddynt fynd o le i le? A yw'n hawdd iddynt at chyfrif i maes yr hyn y maent yn rhaid i chi glicio yn fy rhyngwyneb er mwyn iddynt gyrraedd y nod neu dasg y maent am ei gyflawni? 

Ac yn olaf, fel y dywedodd un person dros yno, mae hygyrchedd yn bwysig iawn. [Siaradwr gwrywaidd] Mae'n dod i hygyrchedd ar gyfer pethau fel gweledigaeth, yn hoffi sut ydw i'n gwirionedd dylunio rhywbeth i rywun sy'n ddall? Oh. I bobl nad ydynt yn gallu gweld o gwbl, mae gennym rywbeth a elwir yn darllenwyr sgrin. Beth ddylech chi ei wneud yw y dylech adeiladu eich gwefan mewn ffordd hynny, er enghraifft, technolegau penodol hyn rydym yn galw - Mae llawer o bethau yn awr. Rwy'n meddwl bod yna darllenwyr sgrin a elwir yn JAWS. Mae llawer o'r pethau hyn yn dibynnu ar yr hyn a alwn reolau ardal er mwyn darllen allan i'r defnyddiwr beth sydd yno ar y dudalen. I'r bobl hynny nad ydynt yn gallu gweld, mae angen i chi wneud yn siŵr bod y darllenwyr sgrin mewn gwirionedd gall godi'r cynnwys ar y dudalen a gall mewn gwirionedd yn dangos eich defnyddwyr, os nad ydych yn gallu gweld, o leiaf gallwch barhau i ddeall y cynnwys ar y dudalen. Yeah. Iawn. Digon siarad am ddylunio da. Gadewch i ni siarad am ddylunio gwael. Mae'r rhain yn bethau na ddylech ei wneud. A all unrhyw un ddweud wrthyf am eu profiadau gyda Craigslist ac nid beth maen nhw'n feddwl sydd mor wych am y cynllun hwn? Ydw. >> [Myfyrwyr] Rwy'n credu bod yna gormod o eiriau mewn un ardal. Gormod o eiriau, dde? Hollol llethol. Byddwch yn dod i'r dudalen hon a ydych yn croesawu gyda criw cyfan o bethau i fyny yma Ni allai hyd yn oed yn bwysig i chi. Er enghraifft, ydych yn byw mewn un yn datgan bod iddo yn dechrau gyda'r llythyr hwn. Lets 'ddeud ydych yn byw yn Texas neu rywbeth. 

Mae'n rhaid i chi sgrolio holl ffordd i lawr y dudalen i gyrraedd y lleoliad rydych yn. Rwy'n dod o Boston, felly gadewch i mi edrych yn Massachusetts. Ble mae Massachusetts? O, mae'n iawn yma. O, mae'n Boston. Iawn. Gadewch i ni edrych ar Boston. [Chwerthin] Pretty llethol, dde? Bethau Lletchwith dros yno. [Chwerthin] Lets 'ddeud dwi'n chwilio am rywle i fyw. Faint o bobl wedi defnyddio'r Craigslist? Tons of chi. Mae yna ffyrdd eithaf gwael i edrych ar hyn, ond gadewch i ni edrych ar hyn. Beth yw'r gwahaniaeth rhwng img a pic? A all unrhyw un ddweud wrthyf? Nid mewn gwirionedd oes unrhyw wahaniaeth. Maent yn golygu yn union yr un peth, ond mae ganddynt wahanol labeli ar eu cyfer am ryw reswm. Os byddaf yn cliciwch ar Wedi Image, nid oes dim yn digwydd ar y dudalen. Fi 'n weithredol rhaid i chi glicio Chwiliwch eto am i rywbeth ddigwydd. Beth allai fod yn benderfyniad dylunio gwell y gellid ei wneud yno? Os ydw i'n clicio ar y hidlo, yr wyf yn ôl pob tebyg am hidlo gan y gweithredu penodol neu fod categori penodol. Felly yn hytrach na gorfod wasg Chwiliwch eto, gallai Fi jyst yn awtomatig yn gwneud y hidlo math o Google arddull lle maent yn ei wneud yn syth. [Malan] Ond peidiwch â ffurfio fel yr ydym wedi eu gweld hyd yn hyn yn gorfod cael eu cyflwyno yn gorfforol drwy daro Rhowch o leiaf neu glicio botwm? Fel chi eu gweld nhw hyd yn hyn, rydych mewn gwirionedd yn rhaid i chi glicio Cyflwyno i wneud y pethau hynny. 

Ond fel y bydd Tommy yn dangos i chi mewn eiliad, mae mewn gwirionedd yn ffyrdd i chi fel bod pan fyddwch yn clicio ar y peth gellir ei anfon yn awtomatig hyn yr ydym yn galw cais AJAX a chael data yn ôl a hidlo eich canlyniadau yn syth. Mae tunnell o bethau sydd o'i le ar y rhyngwyneb. [Malan] Allwch chi chwilio am Cambridge? Mae rhywbeth ychydig yn afreolaidd yma, lle yr ydych yn gofalu am Cambridge ac eto yr ydych yn ei gael WESTFORD, Spring Hill, Gorllewin Newton ac yn y blaen. Mae'n debyg nad yw'n ddelfrydol. Nid >> yn ôl pob tebyg yn ddelfrydol. Sut byddaf yn gallu gwneud profiad y defnyddiwr yn well ar y dudalen benodol? Ydw. >> [Myfyrwyr] Cyfarwyddiadau. Iawn. Cyfarwyddiadau ym mha fath o synnwyr? [Myfyrwyr] Er enghraifft, beth am ddefnyddwyr tro cyntaf, nid ydynt yn hyd yn oed yn gwybod beth Craigslist yn neu os nad ydych yn gwybod beth rydych yn fod i wneud. Hawl. Felly, yn egluro beth Craigslist ar y dudalen hon yn bwysig. Gallwn mewn gwirionedd yn dweud wrth ddefnyddwyr beth y dudalen hon mewn gwirionedd. Os Im 'jyst yn ymweld â hyn, yr wyf yn gweld criw cyfan o leoliadau. Dydw i ddim hyd yn oed yn gwybod beth maent yn ei olygu. Ond yn bwysicach, dim ond edrych ar y rhyngwyneb, cofiwch Roedd rhaid i mi sgrolio i lawr tunnell o bethau i ddod o hyd i gymuned arbennig fy mod mewn gwirionedd yn gofalu amdanynt ar y. Beth yw'r ffordd gyflymach allwn i wneud hynny? Ydw. [Myfyrwyr] Rhannwch nhw i fyny i mewn dwyrain, rhanbarthau gorllewin. >> Iawn. Gallwn eu rhannu i gategorïau mwy a allai fy helpu gyflymach benderfynu sut i gyrraedd y lleoliad arbennig hwnnw. [Myfyrwyr] Rhowch gwymplen. >> Iawn. Iawn. Gallwn ddefnyddio gwymplen gan fod gennym set benodol o bethau a gallem ddangos iddynt mewn gwymplen. Dyna ffordd nad yw'n cymryd cymaint o le ar y sgrin. Ond hyd yn oed yn well na hynny, beth allwn ni ei wneud? Ydw. A all >> [Anghlywadwy ymateb y myfyrwyr] >> chi ddweud hynny eto? >> [Myfyrwyr] blwch Chwilio. Yeah, blwch chwilio. Mae hynny'n wych. Yr hyn y gallwn ei wneud mewn gwirionedd yw os ydym yn edrych yn ôl yn y chwiliad sleidiau blwch,. Gwblhau yn awtomatig. Ffordd hawdd iawn i chwilio drwy ganlyniadau eich bod yn gwybod bod mewn set. Os byddaf yn dechrau teipio BO, dim ond dangos i mi yr holl ganlyniadau sydd y tu mewn BO ohonynt. Dyna ffordd y gallaf yn hawdd iawn dod o hyd i'r un arbennig Dw i eisiau mynd i yn hytrach na gorfod sgrolio drwy'r rhestr hon fawr iawn. 

Mae'r rhain i gyd math o isel iawn-hongian ffrwythau rhywun sy'n gweithredu Craigslist Gall ei wneud mewn gwirionedd i wneud y profiad ar y wefan lawer gwell ar gyfer eu defnyddwyr penodol. Iawn. Digon siarad am wefannau drwg. Gadewch i ni siarad am Facebook. Pan Facebook ddaeth allan, ac yn enwedig lluniau Facebook, roedd llawer o wasanaethau eraill ar y pryd a allai wneud yn union yr un pethau. Gallent drefnu eich lluniau i mewn albwm. Beth allech chi ei wneud yw y gallech eu trefnu mewn setiau yn ogystal. Gallech eu trefnu yn ôl dyddiad. Gallech wneud yr holl bethau hyn penodol. Ond a oes unrhyw un yn gwybod beth a wnaed Facebook lluniau ffrwydro ar yr adeg y ei ryddhau? Ydw. >> [Myfyrwyr] Tags. Tags >>. Yn union. Mae gennym Milo dros yma, sydd yn ein masgot ci gyda'r bandana CS50. Gallwch weld bod gennym nodwedd hon tagio yn y canol. A beth oedd yn gwneud lluniau Facebook mor ddiddorol o safbwynt defnyddioldeb yw ei fod mewn gwirionedd yn caniatáu i bobl drwy hyn i gynnwys eu ffrindiau yn eu lluniau. Ar gyfer Facebook, gan fod eu gwefan yn arbennig cymdeithasol, mae'n ymwneud ag adeiladu y math hwn o awyrgylch cymdeithasol. Oedd yn gwella'r profiad o luniau a llawer mwy oherwydd y gallai eu bod mewn gwirionedd yn dechrau dweud, "Mae'r rhain yn cysylltiadau rhwng pobl, ac mae'r rhain yn lluniau am bobl rydych yn gofalu amdano. " Rhan ohono hefyd yn narcissism fath. Mae pobl yn hoffi cael eu tagio mewn lluniau a phethau fel 'na. Er nad yw o anghenraid yn nodwedd ddynol da, ar yr un pryd ei fod yn seiliedig ar benderfyniadau dylunio da oherwydd bod pobl yn poeni am bethau fel hyn. Felly dyna lluniau Facebook. 

Ond gadewch i ni siarad Facebook fwy cyffredinol. Rwy'n siwr llawer o bobl yma farn am Facebook, ddau penderfyniadau dylunio da a phenderfyniadau dylunio gwael. Felly, gadewch i ni awyrdwll neu fod yn hapus. Dewch ar. Yr wyf yn gwybod pob un ohonoch yn defnyddio Facebook. Mae rhywun wedi cael rhywbeth drwg i'w ddweud neu rywbeth da i'w ddweud am y peth. Ydw. [Myfyrwyr] Yn y ffrwd newyddion mae yna lot o bethau dwi ddim wir yn poeni am. Mae'r porthiant newyddion yn dangos llawer o bethau efallai nad ydych yn gofalu amdano. Mae gennych ffrindiau ar Facebook nad ydych wedi cyfarfod am 2 neu 3 blynedd a byddwch yn gweld eu canlyniadau newyddion neidio i fyny yn eich ffrwd newyddion ac nad ydych yn wir yn poeni am y peth. Facebook wedi gwneud mewn gwirionedd ymdrech i wneud hyn yn well, ac maent wedi ceisio mewn gwirionedd i wthio canlyniadau perthnasol i ben y porthiant newyddion yn ddiweddar er mwyn i chi mewn gwirionedd yn gweld pethau gan ffrindiau sy'n berthnasol i chi neu eich ffrindiau agos. Unrhyw beth arall? Ydw. A all [Anghlywadwy ymateb y myfyrwyr] >> chi ddweud hynny eto? [Myfyrwyr] Mae'r hysbysebion yn gymharol ddisylw. >> Ym mha ystyr? [Ymateb y myfyrwyr Anghlywadwy] Nid oes ganddynt olau ar y sgrin, fel baneri. Iawn. Mae hynny'n dda. Os ydych yn cofio y Rhyngrwyd gan y '90au - >> [Malan] oeddwn i yno. >> Roedd yno. [Chwerthin] Efallai y byddwch yn cofio cefndiroedd GIFs fflachio, disglair pethau, Fath arddull Geocities o bethau. Na wir yn enghraifft o ddyluniad da oherwydd ei fod yn wir yn tynnu sylw oddi wrth y cynnwys. Mae gwefan celf Yale a ddefnyddir i gael GIFs animeiddiedig fel eu cefndir ac nad oeddech yn gallu darllen unrhyw beth ar y dudalen, ond mae'n debyg i rywun mewn gwirionedd yn siarad â nhw ac yn awr mae'n ychydig yn wahanol. [Malan] Mae'n llawer gwell erbyn hyn. >> Mae'n llawer gwell yn awr, fel y gallwch weld. >> [Malan] Oh yeah. Dim ond fawr, dim ond - Yeah. Iawn. 

Rhan ohono hefyd yn gwneud eich tudalen o bosibl iawn minimalaidd ac yn ddealladwy cymaint o bethau ar y llif dudalen mewn ffordd sy'n iawn rhesymegol ac nid ydynt yn mynd yn y ffordd i'w gilydd. Pa fath o bethau eraill yn dda am Facebook neu drwg am Facebook? Gadewch i 'jyst gael sgwrs dylunio yma. Oh. Ble? Yeah. [Myfyrwyr] Mae'r system Llinell Amser newydd yn eich galluogi i chwilio proffil y person am eu gorffennol. Ooh, Timeline. Llinell Amser yn beth gwych oherwydd ei fod yn gadael i chi coesyn eich ffrindiau yn ôl pan oeddent yn yr ysgol yn uchel. Llinell Amser yn dda oherwydd mae'n gadael i chi hidlo trwy gynnwys yn llawer cyflymach, mae'n gadael i chi ddod o hyd i bethau a fyddai fel arall wedi cymryd i chi amser hir iawn i ddod o hyd dim ond sgrolio i fyny ac i lawr, i fyny, i fyny, i fyny, i fyny, i fyny, fel mynd yn ôl mewn amser. Ond yna mae hefyd yn fath o anfantais i hynny o ran profiad y defnyddiwr. Beth allai hynny fod? Gair Fawr sy'n dechrau gyda P-R. >> [Myfyrwyr] Preifatrwydd. >> Preifatrwydd, dde? Preifatrwydd yn fater ddefnyddiwr profiad enfawr. Mae hwn yn un o'r pethau dwi'n casáu fwyaf am Facebook yn awr. [Chwerthin] [Malan] Fel rydw i'n awr. Nid yw David yn sylweddoli hyn yn digwydd mewn gwirionedd tan ddoe. Felly nawr ei fod yn gwybod bod bob tro rwy'n sgwrsio wrtho fy mod yn gwybod ei fod wedi bod yn anwybyddu fi. [Malan] Y rhan lletchwith oedd yr wyf yn oedd mewn gwirionedd yn ei anwybyddu, a doeddwn i ddim yn gwybod ei fod yn gwybod fy mod yn ei anwybyddu. [Chwerthin] Preifatrwydd yn broblem enfawr. A all unrhyw un yma ddweud wrthyf beth allai fod yn ddrwg am Facebook preifatrwydd ar wahân i'r ffaith eu bod yn gwneud pethau fel hyn? Beth yw yn arbennig o anodd i'w wneud mewn perthynas â Facebook preifatrwydd? Math hwnnw o yn gwestiwn arweiniol. Ydw. >> [Myfyrwyr] Cuddio eich lluniau gan bobl benodol. Hawl. Yn union, i guddio eich lluniau gan bobl benodol. Maent yn cael y bach, botwm bach yn y dde uchaf sy'n eich galluogi i toglu preifatrwydd llun. Mae eu dewisiadau preifatrwydd yn amrywio'n fawr rhwng gwahanol fathau o fwydlenni. 

Maen nhw wedi gotten llawer gwell am y peth yn ddiweddar, ond arferai fod yn wir bod pryd bynnag y byddwch eisiau atal eich ffrindiau o luniau gweld, byddai'n rhaid i chi fynd drwy cymhleth iawn 5-cam proses o fod fel, gadewch i mi cliciwch ar y ddolen hon, nawr gadewch i mi cliciwch eto, gadewch i mi cliciwch eto, gadewch i mi nodi na all pobl weld fy lluniau. Nid yw hynny'n arbennig o dda ar Facebook rhan oherwydd bod cymaint am brofiad y defnyddiwr mewn gwirionedd yn rhoi iddynt y rhyddid i reoli'r hyn y gall pobl weld. Rydym yn galw hyn reolaeth i'r defnyddiwr a rhyddid. Os nad ydych chi'n gadael eich defnyddwyr gwneud hynny mewn ffordd sy'n effeithlon ac yn haws, yna nid yw eich profiad y defnyddiwr yn iawn bod fawr o gwbl.  A fyddech yn hoffi guys i ddweud unrhyw beth am Facebook? Sut ydw i'n troi hwn i ffwrdd? [Ong] Ni allwch droi hwn i ffwrdd, ac mae hynny'n wendid defnyddioldeb enfawr ar ran Facebook. Mae hyn yn nodwedd - Fi 'n weithredol yn edrych i mewn iddo ddoe - mae'n naill ai nad allwch chi ei wneud neu y bydd yn ei gladdu yn rhywle iawn, iawn ddwfn yn y cilfachau o Facebook oherwydd ni allaf ffigwr sut i analluogi y swyddogaeth hon o gwbl. [Malan] Ond weithiau nid y penderfyniadau hyn yn amlwg oherwydd eich bod guys wedi rhoi llawer o adborth defnyddiol ar amrywiol CS50 geisiadau a gwefannau bod y cwrs yn defnyddio. Nid ydym wedi gweithredu pob un o'r ceisiadau hyn ac awgrymiadau. 

Rhan o hwnnw ar gyfer cael ceisiadau cymaint ei fod yn ffwythiant o amser, ond weithiau rydym yn unig yn gwneud penderfyniad ymwybodol fel, "Diolch am yr awgrym, ond rydym yn anghytuno." Felly, sut ydych chi'n mewn gwirionedd yn penderfynu beth y dylech ei wneud os yw eich defnyddwyr yn meddwl y dylech chi wneud rhywbeth hyd yn oed os nad ydych o reidrwydd? Mae'n gydbwysedd gofalus rhwng gwirionedd yn gwrando ar yr hyn eich defnyddwyr yn dweud ac mewn gwirionedd yn cael rhyw fath o linell lle'r ydych yn dweud, "Dydyn ni ddim yn mynd i wneud beth mae'r defnyddwyr yn ei ddweud." Ac yn benodol, yr wyf yn meddwl roedd dyfyniad gan Henry Ford sy'n crynhoi hyn yn eithaf da. "Os wyf wedi gofyn i bobl beth maent ei eisiau, byddent wedi dweud eu bod eisiau ceffylau yn gyflymach." A all unrhyw un didoli o bryfocio ar wahân yr hyn y dyfyniad ei olygu mewn gwirionedd? Nid yn unig bod defnyddwyr yn gwybod yr hyn y maent ei eisiau, ond mae'n fwy na - [Myfyrwyr] Nid ydynt yn gwybod beth sy'n bosibl. Yn rhannol nad ydynt yn gwybod yr hyn sy'n bosibl. Ymhelaethu ar y mater ar wahân ychydig yn fwy. Beth ydych chi'n ei olygu wrth hynny? [Ymateb y myfyrwyr Anghlywadwy] Mae hynny'n dda. Beth wyf yn credu ein bod yn ceisio ei ddweud yma yw bod pobl yn gwybod yr hyn y maent ei eisiau. Maent am ceffylau yn gyflymach. Yr hyn y maent eisiau mewn gwirionedd yw y gallu i symud yn gyflymach, ond nid ydynt yn wir yn gwybod y cyfrwng a ddefnyddir gan i gyflawni hynny. Pan fyddwch yn dod i'ch defnyddwyr a defnyddwyr eich dweud wrthych rhywbeth ac maent yn dweud wrthych, "Rydym am nodweddion hyn ac mae'r rhain yn nodweddion a nodweddion hyn," nad ydych am i reidrwydd yn meddwl am, "Gadewch i mi fynd yn ei flaen "A gweithredu'r hyn y maent yn benodol yn dweud," ond yr hyn rydych am feddwl amdano yw, "Pa fath o syniadau a gaf gan hynny?" Beth maen nhw'n ei eisiau mewn gwirionedd? 

Ac oddi yno yr hyn y gallwch ei wneud yw dylunio rhywbeth sy'n bodloni ceisiadau hynny ond nid o reidrwydd yn y ffordd y mae'r defnyddiwr yn disgwyl iddo gael ei fodloni. Felly, ar gyfer rhywbeth fel prosiectau terfynol, mewn termau real iawn, beth a hewristig ddefnyddiol pan ddaw i wneud rhywbeth yn well, yn enwedig os yw'r dylunydd wedi hyn arrogance amdano lle rydych fath o yn gwybod beth sydd orau, efallai y byddwch yn cymryd mewnbwn gan eich defnyddwyr, ond sut ydych chi'n mewn gwirionedd yn mynd ati i gael yr adborth? Mewn prosiectau terfynol, yn concretely, yr hyn yn cynhyrchu canlyniadau gorau posibl yma? Beth cynhyrchu canlyniadau gorau posibl - a byddaf yn mynd dros hyn mewn ail - yn y broses hon o ddatblygu ac yna profi ac yna ailadrodd. Beth allaf i ei olygu wrth brofi fel arfer pan fyddwch yn dylunio rhywbeth ydych yn meddwl ei fod yn eithaf da, fel, "Rwy'n o'r fath dylunydd gwych. Mae pawb yn mynd i garu hwn." Ac yna i chi ei roi allan yno ac nid yw pobl yn wir yn ei hoffi am ryw reswm. Beth sy'n rhaid i chi ei wneud yw yn rhaid i chi gymryd y rhannau o'r pethau y mae pobl yn hoffi ac ailwampio pethau nad yw pobl yn hoffi. Mae'n swnio fel proses amlwg iawn, ond mae'r broses o ailadrodd yn gyson ar ben yr hyn rydych wedi adeiladu eisoes yn broses sy'n eich helpu i nid yn unig yn mireinio eich sgiliau dylunio eu hunain, ond hefyd yn eich helpu mireinio'r dyluniad fel bod pobl yn gwerthfawrogi eich cynnyrch hyd yn oed yn fwy nag yr oeddent o'r blaen. 

Byddaf yn mynd dros enghreifftiau mwy pendant o'r hyn y gallech ei wneud mewn gwirionedd. Fel math o enghraifft olaf o gynnyrch, gadewch i ni edrych ar caiac. Caiac pan ddaeth allan yn iawn, yn boblogaidd iawn. All unrhyw un ddyfalu pam? Beth yw'r mathau o bethau chi'n ei hoffi am hyn os ydych wedi defnyddio ei neu beth yw'r mathau o bethau nad ydych yn hoffi? Ydw. >> [Anghlywadwy ymateb y myfyrwyr] >> Iawn. Dyna rhan ohono yn gadael i'r defnyddiwr gennych ymholiad sy'n fwy eang nag un gyfyngol iawn fel, "Mae'n rhaid i chi ddewis eich dyddiad dechrau "Ac mae'n rhaid i chi ddewis eich dyddiad diwedd." Yn wir, mae'n gadael i chi fod yn hyblyg ynghylch hyn, ac mae'n rhoi i chi i gyd y teithiau yn yr ystod. Unrhyw beth arall? [Myfyrwyr] Maent yn cynnwys y ffioedd yn y pris. Maent yn gwneud cynnwys y ffioedd yn y pris. Mae'r trethi a phethau mewn gwirionedd yn mynd yn syth i mewn i'r pris yn y chwith uchaf fel na chewch eich twyllo i feddwl eich bod mewn gwirionedd yn talu am hedfan $ 240 pan mae'n wirioneddol $ 330. Unrhyw beth arall? Ydw. [Ymateb y myfyrwyr Anghlywadwy] Nid wyf yn sicr os ydynt mewn gwirionedd yn gadael i chi wneud hynny. Efallai fy mod yn anghywir. Gallai hynny fod yn beth diddorol os ydych eisiau rhoi mwy o bwysau ar hidlyddion penodol fel eu bod yn gwthio canlyniadau cysylltiedig i'r hidlydd i'r brig. Gall ond gall unrhyw un ddweud wrthyf beth sydd mor arbennig am y ochr chwith? Sut wnaethoch chi draddodiadol chwilio am hedfan ar wasanaeth Rhyngrwyd cyn hyn? 

Ydw. A all >> [Anghlywadwy ymateb y myfyrwyr] >> ydych yn dweud hynny - [Myfyrwyr] Mae pob cwmni hedfan. >> Yeah. Each cwmni hedfan ei gwefan ei hun. Mae hyn yn atgyfnerthu pethau. A? [Myfyrwyr] Rydych chi'n gwybod yn union beth amser ydych yn gadael. Chi ddim yn gwybod yn union beth amser ydych yn gadael, ond yn gysylltiedig â'r hidlwyr yn arbennig. Gadewch i mi dynnu i fyny caiac. O Dduw, pop-ups. Profiad y defnyddiwr Gwael. Beth sy'n digwydd pan fyddaf yn symud y llithrydd? [Myfyrwyr] diweddariadau Awtomatig. >> [Ong] diweddariadau Awtomatig. Mae hynny'n rhywbeth sy'n bwysig iawn. Cyn hyn, pryd bynnag y byddwch eisiau edrych i fyny hedfan, bu'n rhaid i chi roi yn eich, lleoliad mewnbwn eich lleoliad allbwn, y wasg Chwilio, byddai'n ei brosesu hynny a dangos eich canlyniadau. Os ydych am newid eich ymholiad, byddai'n rhaid i chi bwyso yn ôl ddwywaith, fynd i mewn ymholiad newydd o'r dechrau, ac yna ei wneud drosodd a throsodd. Y peth braf am rywbeth fel hyn yn ei defnyddio yn beth [annealladwy] yn y canol. Pryd bynnag y byddwch yn gwneud rhywbeth fel hyn, mae'n saethu oddi ar y cais ac mae'n dychwelyd i chi i gyd y canlyniadau ar unwaith. Mae'r math hwn o adborth ar unwaith yn rhywbeth a wnaeth caiac wyllt yn boblogaidd oherwydd ei fod yn hawdd iawn i mi yn unig newid fy ymholiad ac i chyfrif i maes y pethau sydd o gwmpas ystod benodol heb orfod mynd yn ôl ac ymlaen, yn ôl ac ymlaen, yn ôl ac ymlaen. Felly, mae'r rhain i gyd math o bethau yr hoffech feddwl am pan fyddwch yn cynllunio eich gwefan. Sut alla i wneud yn effeithlon iawn ar gyfer fy defnyddwyr i fynd drwy beth bynnag y maent yn gweithio ar ac i gyrraedd eu nod yn y pen draw cyn gynted â phosibl? [Malan] Ac i Joseff pwynt yn gynharach am ddefnyddwyr nid o reidrwydd yn gwybod yr hyn y maent ei eisiau, yn seiliedig ar yr hyn yr ydych guys yn gwybod am HTML a bod gennych blychau ticio, botymau radio, menus dethol, caeau mewnbwn ac ati, sut fyddech chi weithredu'r syniad o ddewis un amser cychwyn ar gyfer hedfan? 

Pa o'r mecanweithiau gwahanol UI rydych yn ei ddefnyddio? Os ydych yn unig yn gwybod faint o HTML a dysgu cyn a ydych yn gwybod y mewnbynnau yn botymau radio, blychau ticio, galw-i-downs, a blwch mewnbwn, beth fyddai eich dewis naturiol wedi bod ar gyfer casglu dyddiadau? [Myfyrwyr] Mewnbwn. Mewnbwn >>. Neu efallai hyd yn oed galw heibio i lawr gyda'r holl ddyddiadau, dde? Felly, gyda mecanweithiau UI mwy cymhleth fel hyn ar yr ochr chwith y gallwch gweithredu, gallwch wneud y broses hon yn llawer mwy 'n athrylithgar gyda slider gan fod amser yn ddi-dor, a phobl nad ydynt fel arfer yn meddwl am y peth yn nhermau ddarnau ar wahân. Mae pob hawl. Peth diwethaf. Deg hewristeg defnyddioldeb. Mae'r holl bethau yr ydym yn siarad am yn ôl pob tebyg yn dod o dan un o'r categorïau hyn. Os byddwch yn mynd i'r cyswllt hwn, y bydd y safleoedd yn cael eu postio ar-lein, byddwch mewn gwirionedd yn gallu, wrth i chi ddylunio eich safle, cadwch hyn mewn cof hewristeg ac mae'r rhain yn rheolau bawd. Ar gyfer eich prosiectau, yr hyn yr wyf yn awgrymu eich bod yn ei wneud er mwyn cynllunio eich app yn well yw gwneud prototeipio papur cyntaf. Pan fyddwch chi'n meddwl am eich cais, yn gyflym iawn sketch beth rydych eisiau iddo edrych fel a gwneud yn siŵr bod yr holl flychau yn cael eu trefnu mewn ffordd sy'n iawn 'n athrylithgar ar gyfer y defnyddiwr i ddefnyddio and hyd yn oed yn dangos y prototeipiau papur at eich ffrindiau a dechrau grwpiau ffocws. Dim ond cael 2 neu 3 o bobl at ei gilydd a gofynnwch iddyn nhw dim ond tap ar y prototeipiau papur, a dangos iddynt sgriniau newydd i weld a ydynt mewn gwirionedd yn deall beth sy'n mynd ymlaen. 

Beth ydych chi eisiau ei wneud yw rhoi tasg, cymell y dasg honno, a dim ond rhoi iddynt y app a gadael iddyn nhw ei ddefnyddio. Peidiwch â rhoi cyfarwyddiadau iddynt y tu hwnt i hynny. Rydych am i mewn gwirionedd yn gadael iddyn nhw ryngweithio gyda'ch app mewn ffordd sy'n gadael i chi weld sut y byddent yn ei defnyddio os nad ydych yn sefyll wrth eu hymyl. Ac mae hynny'n bwysig iawn. Bydd hynny'n rhoi i chi lawer o fewnwelediadau i bobl symud o gwmpas pethau penodol mewn ffordd nad oeddwn yn bwriadu iddynt? A ydynt yn defnyddio mecanweithiau UI penodol ar y sgrîn mewn ffordd sy'n fath o hacky? Nid oeddwn yn bwriadu iddynt wneud felly. Ac unwaith y byddwch chi'n ei wneud gyda hynny, beth ydych chi eisiau ei wneud? Eich creigiau dylunio, dde? Beth ydych chi eisiau ei wneud yw ydych am ddatblygu ac yna gwneud y broses honno dros eto. Felly, ei ddangos i ffrindiau unwaith y byddwch wedi ei ddatblygu, ei brofi, datblygu, profi, datblygu, profi, ailadrodd, ymlaen ac ymlaen ac ymlaen. Mae dylunio yn broses iterus iawn yn yr ystyr hwn. Chi mewn gwirionedd yn cael i adeiladu rhywbeth ac yna sylweddoli pethau am y peth nad oeddech yn sylweddoli cyn ac yn mynd yn ôl ac yn gwella o hynny. Yn awr, fel ar gyfer y rhan datblygu, dyna beth Tommy yn mynd i ddangos i chi ar ôl yr egwyl a sut y gallech fod yn gallu gweithredu rhywbeth fel awtogwblhau mewn ffordd sy'n weddol syml. [Malan] Fel Tommy yn gosod i fyny yma, mae cwestiwn yna. Mae llawer o wefannau cynharaf - a phan ddywedodd Joseff 1990au gwefan arddull, oedd gweithrediadau lle os ydych eisiau i ddewis amser dechrau ac amser diwedd, dweud y gwir, yn ôl yn y dydd a hyd yn oed ar rai gwefannau heddiw, y ffordd yr ydych yn gwneud hyn yn eich bod yn dewis awr o galw heibio i lawr, eich bod yn dewis cofnodion o galw heibio i lawr, efallai byddwch yn dewis AM, PM, ac yna rydych yn gwneud hynny 3 gwaith yn fwy. Ac felly gyda 6 chleciau ac efallai rhywfaint o sgrolio gall eich defnyddiwr mewn gwirionedd yn darparu rhyw fath o ddyddiad a / neu ystod amser yn yr ystyr hwn. 

Felly, yn bendant suboptimal ac eto hyd yn hyn rydym wedi gweld unrhyw galluoedd mynegiannol yn unrhyw un o'r ieithoedd yr ydym wedi edrych ar wneud rhywbeth sexier fel hyn llithrydd o amser dechrau ac amser diwedd. Ond os ydych yn meddwl yn ôl i wythnos 0 pan buom yn siarad am Scratch, yno hefyd nad oedd widgets mai dim ond gwneud pethau penodol. Rydych yn wir dim ond cael y rhain hanfodion fel dolenni ac amodau ac yn y blaen. Felly fath o ddim ond yn meddwl yn haniaethol yn awr, yn annibynnol ar y manylion o HTML, yr hyn sy'n digwydd mewn gwirionedd gyda rhywbeth fel hyn amser dechrau a llithrydd ddiwedd amser? Pan fyddaf yn symud fy llygoden a fyddaf yn clicio ar y symbol moron bach ar y chwith a dechrau llusgo, programmatically, beth ydyw ydych am fod yn gallu gweithredu i wneud i hynny ddigwydd? Pa gwestiynau, yr hyn y mynegiadau Boole ydych chi am fod yn gallu gofyn? Beth sy'n digwydd mewn gwirionedd? Sammy? [Myfyrwyr] Ble mae'r sefyllfa y cyrchwr? >> Da. Ble yw'r sefyllfa y cyrchwr? Roedd hyn yn rhywbeth roedd angen i ni fynegi yn ôl yn Scratch, a oedd yn seiliedig ar leoliad neu hyd yn oed liw neu debyg. Efallai y byddwch yn cofio erioed mor fyr ar ddydd Llun, roedd yr holl bethau hyn a elwir yn ddigwyddiadau yn y byd y We, ac felly mae pethau fel onclick a onkeypress a onkeyup a onmouseover a onmouseout. Felly, yn sylweddoli bod hyd yn oed y pethau hyn rydym wedi bod yn cymryd yn ganiataol ar y We gyda safleoedd fel Facebook a Gmail, hyd yn oed os nad oes gennych syniad sut y byddech o bosibl yn gweithredu'r oherwydd does dim byd hyd yn oed fel yn darlith neu Broblem Set 7, yn sylweddoli bod hyn yn sylfaenol union yr un, gyda HTTP a paramedrau a GET a SWYDD, gyda mewnbynnau sylfaenol HTML ein bod wedi edrych ar hyd ac mewn moment gyda'r mecanweithiau rhaglennol that Tommy ynglŷn i gyflwyno gallwch ddechrau i fynegi eich hun yn union fel yr oeddech yn wythnos 0 gan reddfol iawn lusgo a gollwng. 

Felly, gyda dweud hynny, Tommy MacWilliam a rhai darnau pos newydd i ni ar gyfer y We. Mae pob hawl. Fy enw i yw Tommy a dw i'n mynd i fod yn siarad am JavaScript. Dim ond ymwadiad: Yr wyf o'r farn bod JavaScript yn iaith raglennu gorau yn y byd cyfan i gyd. Mae llawer o bobl sy'n anghytuno â mi, ond mae'r un anhygoel. Unwaith y byddwch yn mynd yn ôl i C, os oes rhaid i chi ysgrifennu C ar gyfer dosbarth arall neu rhai ieithoedd eraill, 'i' jyst yn rhwystredig iawn yn yr holl fanylion lefel isel yn rhaid i chi gael ein llethu mewn Felly os ydych chi'n erioed wedi teimlo'n drist am pa mor annifyr C yw i ysgrifennu, yn unig yn mynd yn ôl, ysgrifennu rhai JavaScript. Mae'n Nirvana. Byddwch yn teimlo'n llawer gwell am eich diwrnod gwael. Mae llawer o hud y JavaScript yn deillio o'i gallu i drin pethau sydd eisoes ar y dudalen. Pan oeddem yn ysgrifennu ein sgriptiau PHP, eu bod yn gweithredu ar y gweinydd, ac yn y pen draw yn PHP sgript yn ôl pob tebyg allbwn rhywfaint o HTML. That HTML cael ei anfon i'r cleient, ac yna dyna ni. Os PHP i eisiau ychwanegu botwm i dudalen, er enghraifft, ni all 'n sylweddol wneud hynny. Byddai'n rhaid i rendro ffeil HTML gyfan newydd ac anfon y at y porwr. Gyda JavaScript rydym yn gwybod y gallwn ddiweddaru pethau tra eu bod eisoes ar y dudalen, ac oherwydd hyn, gallwn ddarparu adborth llawer mwy ar unwaith, a fydd yn wir yn gwella profiad y defnyddiwr ar ein gwefan. Dim ond ailadrodd cyflym o ddetholwyr JavaScript. Rydym yn gwybod bod pan fyddwn yn lawrlwytho tudalen HTML, mae hynny'n mynd i gael eu cynrychioli yn y DOM. 

Mae'r DOM cofiwch yn unig y goeden fawr lle mae elfennau yn gysylltiedig yn y hierarchaeth mawr. Pan fyddwn yn gweithio gyda chronfeydd data yn pset 7, un o'r pethau cyntaf roedd angen i ni wybod sut i wneud oedd holi y gronfa ddata. Mae gennym y tabl hwn defnyddwyr mawr, ac weithiau rydym yn unig am ei ddweud, "Dim ond am i rai o'r defnyddwyr hyn sy'n cyfateb i rai cyflwr." Yn yr un modd, pan fyddwn yn cael y DOM mae angen rhyw ffordd o ymholi iddo. Mae angen rhyw ffordd o ddweud, "Rwyf am i bob un o'r botymau sy'n edrych fel hyn "Neu bob un o'r delweddau ar y dudalen." Ac mae'r rhain yn dewiswyr yn ein galluogi i wneud hynny. Felly, dim ond ailadrodd cyflym. Mae hyn yn un cyntaf yma, mae hyn # gyflwyno, beth yw hynny yn mynd i ddewis? A oes unrhyw un yn cofio? [Ymateb y myfyrwyr Anghlywadwy] >> Yeah, yn union. Mae hyn yn mynd i ddewis elfen ar y dudalen sydd â ID y cyflwyno. Ac felly y tag hash dweud y bydd hyn dewisydd yn mynd i weithio gyda IDs. Beth am yr ail un, mae hyn. Ganolog, beth fydd y dewis? Yeah. >> [Myfyrwyr] Dosbarth. >> Yn union. Mae hyn yn awr yn mynd i ddewis yn ôl dosbarth. Y gwahaniaeth rhwng ID a dosbarth yma yn gyffredinol dylai'r ID fod yn unigryw o fewn pa bynnag faint rydych chi'n chwilio drosodd. Felly, os ydych yn chwilio dros tudalen we gyfan, dylech mewn gwirionedd dim ond 1 elfen gyda'r ID penodol, felly yn yr achos hwn o gyflwyno. Gyda dosbarthiadau, ar y llaw arall, gallwn gael mwy nag 1 elfen ar yr un dudalen gyda'r un dosbarth. Gallai hyn fod yn ddefnyddiol ar gyfer ddweud rwyf am i ddewis popeth sy'n canolbwyntio ar y dudalen yn hytrach na dim ond 1 peth. 

Ac yn olaf, mae hyn yn un olaf yma yn ychydig yn fwy cymhleth, ond beth mae hyn yn mynd i ddewis o'r DOM? [Ymateb y myfyrwyr Anghlywadwy] >> Beth sy'n bod? [Myfyrwyr] Unrhyw beth mae hynny'n tag. >> Mae gennym 2 ran yma. Mae'r ail ran yn mynd i ddweud fy mod am i ddewis tagiau hyn â thag o fewnbwn, felly mae unrhyw elfen sydd yn tag mewnbwn. Ond nid wyf am dewiswch yr holl fewnbynnau oherwydd y gallai rhywbeth fel botwm cyflwyno fod yn fewnbwn a gallai rhywbeth fel blwch testun fod yn fewnbwn. Felly, gyda hyn cromfachau sgwâr i ddim yn dweud mai dim ond am ddewis y rhai elfennau sydd o destun fath. Rhywle yn fy tag HTML gen i o'r enw priodoledd fath, a gwerth y briodoledd fod yn destun. Felly, beth am y rhan cyntaf yma? Mae'r gair cyntaf y detholydd yn ffurflen, yna mae gen i le ac yna mae hyn yn rhan mewnbwn. Beth mae hynny'n ei wneud, gan roi'r ffurf o'i flaen? Mae hyn yn mynd i yn y bôn cyfyngu ar ein ymholiad. Gallai fod yn wir ein bod wedi rhywfaint o fewnbwn ar y dudalen nad ydynt yn ddisgynyddion o ffurflen. Beth fydd hyn yn ei wneud yw y bydd hyn yn dweud fy mod yn unig am i'r tagiau mewnbwn sydd rhywle uwch eu pennau rhyw elfen rhiant ffurflen. Ac felly yn y modd hwn gallwn wneud yr ymholiadau hyn yn fwy hierarchaidd felly nid ydym yn unig yn rhaid i ddewis popeth baru dewisydd a roddir. Gallwn fath o derfyn gwmpas yr ymholiad hwnnw i rywbeth arall. Felly, nawr ein bod yn gwybod sut i ddewis elfennau ar y dudalen, gadewch i ni siarad ychydig am AJAX. AJAX yn acronym dal i fod yn ffasiynol sy'n sefyll am JavaScript asynchronous a XML. Fel mae'n digwydd bod XML yn unig yw rhyw ffordd i gynrychioli data. 

Y math hwnnw o boblogrwydd a gollwyd yn ddiweddar, felly nid yw'r X yn AJAX yn cael ei ddefnyddio drwy'r amser. Yn y bôn, yr hyn AJAX yn caniatáu i ni ei wneud yw gwneud ceisiadau HTTP o gyd-destun o JavaScript. Pan fyddwn ni'n yn ein porwr gwe ac rydym yn lywio o gwmpas tudalennau ac rydym yn cliciwch ar un o'r cyswllt, beth yw ein porwr yn mynd i wneud yw gwneud cais HTTP i ba bynnag ein cyswllt chliciwch. Ond nid yw hynny bob amser yn ddelfrydol oherwydd os yw hynny'n wir, yna fel David yn ei ddweud, rydym bob amser yn rhaid i ni wneud defnyddwyr glicio botwm Cyflwyno neu cliciwch ar ddolen gyswllt er mwyn gwneud unrhyw beth yn digwydd bod yn mynd i gynnwys cais HTTP. Felly, gyda AJAX, gallwn wneud y ceisiadau hyn ar ran JavaScript. Mae hynny'n golygu pryd bynnag y defnyddiwr yn rhyngweithio gyda'r dudalen neu unrhyw beth yn digwydd, gallwn mewn gwirionedd yn gwneud cais rhaglennol i ryw ffeil PHP eraill ar ein gwefan neu unrhyw beth arall ac yn adfer y data bod y ffeil poeri allan. Gadewch i ni edrych ar enghraifft o AJAX. Mae hyn yn ein tudalen Cyllid CS50 y mae gobeithio bydd rhai ohonom yn gyfarwydd. Os ydym yn edrych ar y HTML y dudalen hon, gwelwn yma fy mod i wedi ychwanegu ychydig o bethau, un yr wyf wedi rhoi ffurflen hon ID. Rwyf wedi dweud id = "ffurflen-dyfyniad". Rydw i wedi gwneud hyn dim ond oherwydd ei fod yn mynd i wneud hyn yn dipyn ychydig yn haws i ddewis o blith y DOM gan y gall yr wyf am wneud ymholiad syml iawn. Yr hyn yr wyf eisiau ei wneud yma yw fy mod am i atgyweiria rhyw broblem gyda CS50 Cyllid. Felly, os ydym yn mynd i finance.cs50.net, bob tro rwy'n awyddus i gael dyfynbris, rhaid i mi cliciwch y botwm Dyfyniad Get, a bod Get botwm Dyfyniad wedyn yn mynd â mi i dudalen arall cyfan. Ac os ydw i eisiau arall dyfyniad, rhaid i mi daro y botwm Yn ôl ac yna mi deipio i mewn, I gael dyfynbris, ac yr wyf daro y botwm Back. Mae hyn nid yn wir yn y profiad y defnyddiwr gorau. Pwy fyddai'n wir yn defnyddio safle os yw'n bod yn araf i gael prisiau stoc? Felly beth rydym am ei wneud gyda AJAX yw cael gwared ar y cam o fynd i dudalen ar wahân er mwyn weld y canlyniadau. 

Yr hyn yr ydym yn wir yn unig yn gofyn amdano yw bod pris yn wir bach, a dim ond swm bach iawn o ddata. Felly does dim angen i mi fynd arall dudalen HTML cyfan, lawrlwytho swp newydd o HTML, efallai lawrlwytho delweddau rhai mwy, rhai ffeiliau CSS eraill dim ond i mi ateb y cwestiwn syml iawn o faint mae hyn yn ei gostio stoc. Gyda AJAX gallwn wneud hyn yn llawer haws a. Rydym yn gweld i lawr yma fy mod yn cysylltu mewn ffeil o'r enw JavaScript quote.js. Gadewch i ni mewn gwirionedd yn agor i fyny y ffeil. Nid yno. Mae pob un fy ffeiliau JavaScript yn mynd i gael eu lleoli mewn HTML fel y gall y porwr gwe cael mynediad iddo. Yna, mae gennym cyfeiriadur ar wahân yma ar gyfer JavaScript, ac yn awr dyma quote.js. Ar frig y ffeil hyn yn dweud yma yr wyf am i aros am y dudalen gyfan gael eu llwytho cyn i mi ceisio gwneud unrhyw beth. Pam bod angen? Mae'n troi allan fod y peth nesaf rwy'n mynd i'w wneud yma yw cychwyn chwilio am elfen sy'n cyfateb rhywfaint o dewisydd. Os yw hyn yn JavaScript cael ei gyflawni erioed o'r blaen yr elfen hon yn cael ei lwytho ar y dudalen, yna nid popeth yr wyf yn ceisio ei wneud yw mynd i weithio oherwydd fy mod i'n mynd i geisio i ddewis rhywbeth nad yw'n bodoli eto. Felly y llinell hon i fyny top yn dweud fy mod am i chi aros nes bod popeth yn cael ei lwytho felly rydym yn gwarantu y bydd unrhyw elfennau dwi'n chwilio am mewn gwirionedd ar y dudalen. Mae hyn yn arwydd doler yma yn golygu fy mod i'n defnyddio'r llyfrgell a elwir yn jQuery. Mae'r llyfrgell jQuery yn caniatáu i ni ddefnyddio'r dewiswyr yr ydym yn jyst yn edrych ar. Drwy ddweud $ basio i mewn fel dadl y ffurflen #-dyfyniad, Rwyf nawr yn dewis y ffurf yr ydym yn unig yn cymryd golwg ar. Nawr mae gennyf gynrychiolaeth o'r ffurflen honno yn y cof rhywsut. 

Ar y gwrthrych yn awr, y gynrychiolaeth hon o'r ffurflen, Rwyf nawr yn defnyddio swyddogaeth galw ar. Beth swyddogaeth hon yn ei wneud yw ei fod yn mynd i atodi driniwr digwyddiad. Os byddwn ni'n mynd i wrando ar ei gyfer yn y digwyddiad cyflwyno. Felly, pan fydd y defnyddiwr yn clicio sy'n Cyflwyno botwm neu gweisg Mewnbynnu, y digwyddiad hwn yn mynd i dân. Drwy hooking i mewn i hyn, gallaf yn awr yn drech na'r ymddygiad diofyn y ffurflen. Heb y JavaScript, byddai'r ffurflen cyflwyno i ba bynnag PHP ffeil ddefnyddiwyd gennym yn y priodoledd gweithredu. Ond yn hytrach, rwy'n awr yn dweud, aros, aros, aros, nid wyf ddim eisiau i chi mewn gwirionedd yn gwneud hynny. Wyf am i hyn ddigwydd cyn i chi fynd a rhoi cynnig i gyflwyno i ryw ffeil PHP. Nawr beth ydw i eisiau ei wneud? Ar y pwynt hwn rwyf eisiau defnyddio AJAX rywsut i lwytho yn yr hyn y pris y stoc yn. Y peth cyntaf i mi angen i chi wybod yw beth stoc y defnyddiwr yn edrych i fyny. I wneud fy mod i'n mynd i ddefnyddio dewisydd arall. Mae hyn yn y dewisydd drydedd edrych ar blaen. Mae hwn yn dweud fy mod eisiau dechrau oddi ar yr elfen hon ffurflen gyda ID o ffurflenni dyfynbris. Yna rhywle tu mewn y ffurflen honno mae'n rhaid cael elfen mewnbwn sydd â enw'r symbol. Os ydym yn edrych yn ôl ar ein HTML, gwelsom ein bod yn cael mewnbwn [enw = symbol]. Mae hynny'n golygu bod hyn yn mynd i ddewis y blwch testun bod y defnyddiwr yn teipio i mewn. Dyna 'n glws. Mae gennym y blwch testun. Nawr mae'n rhaid i ni wybod beth sydd tu mewn iddo. Er mwyn gwneud hynny, gallwn alw y dull hwn yma, mae hyn yn Val., ac mae hyn yn dweud fy mod yn gwybod beth blwch testun sydd gennych. Rwyf am i chi ddweud wrthyf beth ydyw y defnyddiwr deipio i mewn i'r blwch testun. Nawr mae gennym llinyn a elwir yn symbol sy'n cyfateb i beth bynnag y defnyddiwr deipio i mewn Dyna 'n glws. Gallwn ddefnyddio'r llinyn yn awr i wneud ein cais. Mae hon yn swyddogaeth newydd yma, mae hyn yn $, ac eithrio ein bod bellach yn mynd i gael eu dewis elfennau, rydym yn mynd i gael eu galw swyddogaeth gwahanol sydd wedi roddwyd i ni gan jQuery. Mae'r swyddogaeth hon yn AJAX yn beth sy'n wir yn mynd i wneud y cais HTTP. Felly, rhaid i ni ddweud ei fod yn ychydig o bethau. Y peth cyntaf yn rhaid i ddweud wrth y swyddogaeth hon yw lle yr wyf am i'r cais i fynd. Rhywle yn fy mhrosiect i, rwy'n cael y ffeil tu mewn i'r cyfeiriadur o'r enw HTML quote.php. Gallaf gael mynediad y ffeil, gwelodd yr ydym ni, yn union fel hyn, os byddaf yn mynd i localhost / quote.php. 

Rwyf am i fy JavaScript i wneud cais i'r dudalen honno. Pa fath o gais yn awr? Gwelsom eisoes fod y ffurflen yn cynnwys y dull hwnnw = "post" priodoledd, ac mae hynny'n golygu ei fod yn mynd i wneud cais POST, felly nid yw'n mynd i roi unrhyw beth yn y URL, yn hytrach na chais GET, fyddai dim ond yn cael ei danio os ydym yn gweld dim ond y dudalen gyda'r porwr gwe, er enghraifft. Nawr rydym wedi dweud yr wyf am wneud cais HTTP POST i dudalen lleoli yn quote.php. Pan fyddwn yn anfon y ffurflen, cofiwch y gallem gael mynediad i'r elfennau mewnbwn tu mewn y ffurflen honno gyda'r newidyn $ _POST. Hyd yn hyn yn y stori, nid ydym wedi anfon mewn gwirionedd ar hyd unrhyw ddata hyd yn hyn. Rydym wedi newydd ddweud ein bod yn gwneud cais AJAX a dyma y math o gais rydym yn ei wneud. Nawr mae angen i ni mewn gwirionedd yn anfon rhywfaint o ddata i'r dudalen. Er mwyn gwneud hynny, gallwn ddefnyddio'r eiddo hwn a elwir data. Mae gwerth yr eiddo hwn mewn gwirionedd arae cysylltiadol. Y rheswm am hyn yw ei fod yn caniatáu i ni anfon mwy na dim ond 1 darn o ddata. Dyna pam ein bod wedi hyn braces cyrliog nythu yma y tu mewn o'r rhain braces cyrliog eraill. Mae'r allweddi yn y araeau cysylltiadol yn mynd i fod yr un peth fel y rhai yn priodoli enw yn ein elfennau ffurflen. Mae hynny'n golygu, os byddaf yn anfon hyd allweddol o symbol, sy'n golygu y gall fy dudalen PHP gael gafael ar y data gyda $ _POST [symbol] yn union fel y gwnaethom o'r blaen pan oeddem yn cyflwyno ffurflen. Ac yn awr y data gwirioneddol ydym am anfon yn mynd i fod y tu mewn gwerth y casgliad cysylltiadol. 

Rydym yn cael ei storio y testun hwn yn symbol o'r enw amrywiol, ac felly rydym yn anfon hyd bellach yn allweddol o symbol a gwerth beth bynnag y defnyddiwr deipio i mewn Nawr rydym wedi gwneud y cais HTTP, ein ffeil PHP wedi cyflawni, ac mae'n mynd i anfon rhywfaint o ddata yn ôl yn awr at y cleient mai dim ond gwneud y cais. Nawr mae angen i ni ymateb i beth bynnag mae'r gweinydd yn ei ddweud wrthym. I wneud hynny mae gennym yr eiddo hwn diwethaf yma a elwir yn llwyddiant. Mae gwerth yr allwedd hon llwyddiant mewn gwirionedd yn mynd i fod yn swyddogaeth, a dyma un o'r pethau 'n sylweddol oera y gallwch ei wneud gyda JavaScript. Nid yn unig y bydd gennych ints neu araeau fel y tu mewn gwerth arae cysylltiadol, gallwn hefyd gael swyddogaeth. Felly, trwy ddweud llwyddiant, mae hyn yn fy allweddol. Mae colon yn dweud yma hon y gwerth, ac yn awr y gwerth hyn mewn gwirionedd yn swyddogaeth. Felly nid oes angen i ni roi swyddogaeth hon enw per se. Gallwn ddweud hyn yn unig yn mynd i fod yn rhyw swyddogaeth. Mae'n mynd i dynnu 1 ddadl. Y ddadl i'r swyddogaeth hon yn mynd i fod beth bynnag y gweinydd anfon yn ôl oddi wrth y cais. Yn union fel pan fydd ein porwr yn gwneud cais, mae'r gweinydd yn anfon rhywbeth yn ôl ac mae'r porwr yn dangos hynny, yng nghyd-destun AJAX rydym yn unig gwneud cais, y gweinydd a anfonwyd rhywbeth yn ôl, ac yn awr rydym wedi cynrychioli hynny fel llinyn. Gyda hynny llinyn Hoffwn i ddangos bod ar y dudalen. I wneud fy mod i'n mynd i gael un dewisydd diwethaf. Rwyf am i ddewis yr elfen sydd â'r pris ID. Mae hyn yn unig yw div wag fy mod i wedi creu ar y dudalen, ac yr wyf am osod y cynnwys y div i fod beth bynnag y gweinydd anfon yn ôl. Rwyf wedi addasu mewn gwirionedd quote.php ychydig. 

Yn hytrach na ffonio rendr a rendro rhai dudalen, quote.php bellach, yn syml, yn mynd i argraffu gwerth y stoc fel llinyn. Felly, os ydych yn i mewn gwirionedd yn ymweld â'r dudalen, byddech ond yn gweld y llinyn bach beth bynnag y pris stoc yn. Un peth olaf mae angen i ni ei wneud yma yn unig yw gwneud yn siŵr bod hyn yn swyddogaeth yn dychwelyd ffug. Beth mae hyn yn ei ddweud yw os wyf tu mewn i driniwr ddigwyddiad a bod y triniwr digwyddiad yn dychwelyd ffug yn hytrach na dychwelyd yn wir, mae hynny'n golygu nad wyf am y digwyddiad gwreiddiol i dân. Yn yr achos hwn, os nad oedd gennym unrhyw JavaScript ac rydym yn cyflwyno ffurflen, ein porwr gwe yn mynd i ddweud, "Rydw i'n mynd i anfon y data hyd," ac maent yn mynd i anfon chi i dudalen arall. Oherwydd ein bod yn defnyddio AJAX yn awr, nid oes angen i anfon y defnyddiwr i dudalen arall. Rydym yn jyst yn mynd i ddangos y canlyniadau ddeinamig ar y dudalen hon yr un. Nid ydym am iddynt fynd i unrhyw le, ac yr wyf am aros ar yr un dudalen. Felly, trwy ddychwelyd ffug, rydym yn sicrhau nad yw'r ffurflen yn gwneud hynny i ni. Gadewch i ni edrych ar beth mae hyn yn mewn gwirionedd yn edrych fel. Mae ein tudalen dyfyniad yn edrych yr un fath. Gadewch i mi dynnu i fyny 'r arolygydd i lawr yma fel y gallwn weld beth sy'n mynd ymlaen. Ei wneud yn ychydig yn llai enfawr. Cofiwch os byddwn yn agor i fyny 'r tab Rhwydwaith, dyma lle gallwn weld yr holl geisiadau HTTP sydd yn digwydd ar y dudalen. 

Am symbol gadewch i mi deipio i mewn aapl a chliciwch Get Dyfyniad. Nawr rydym yn gweld bod cyfran o Apple yn costio tua nifer o ddoleri dim ond yn ymddangos ar y dudalen, ond nid yw'r URL yn newid o gwbl. Yn wir, dyma y cais HTTP yr ydym yn ei wneud. Rydym yn gwneud cais POST i quote.php. Mae hynny'n gwneud synnwyr. Dyma beth mae'r gweinydd anfon yn ôl. Mae'n bellach yn y ddogfen hon HTML enfawr gyda delweddau a phethau fel 'na, mai dim ond llinell o destun, ac yna rydym yn unig arddangos y llinell o destun. Os awn yn ôl at y penawdau a gweld yr hyn yr ydym mewn gwirionedd yn anfon tu mewn y cais hwn HTTP, gallwn weld i lawr yma a anfonwyd gennym ar hyd allweddol o symbol a gwerth aapl, sef yr hyn y defnyddiwr deipio i mewn Mae hyn yn neis, ond mae'n dal i fod ychydig yn blino. Rhaid i mi cliciwch y botwm i gael y dyfynbris stoc. Rydym yn bobl brysur ac nid oes gennym amser i chi glicio botymau. Google sylweddoli hyn ychydig o amser yn ôl pan fyddant yn gweithredu Google Instant. Beth Google Instant yn ei wneud yw wrth i chi deipio dim ond yn dechrau arddangos canlyniadau i chi felly nid oes rhaid i chi boeni am hyd yn oed glicio Chwilio. Mewn gwirionedd, stori hwyliog sy'n gysylltiedig â hynny. Unwaith y daeth Google Instant allan, roedd pobl yn debyg i, "Pwy yw, mae hyn yn super anhygoel." "Mae hyn yn mor oer." Ac yn fyfyriwr i lawr ar Stanford a oedd yn 19 ar y pryd gwneud y safle o'r enw YouTube Instant. Mae pob Instant YouTube yn ei wneud yw chwilio YouTube effeithiol ar unwaith. Felly, yn hytrach na gorfod mynd i YouTube.com a tharo Chwilio, pan fyddaf yn dechrau teipio i mewn i YouTube rhywbeth Instant fel CS50, gallem weld yma ei fod yn ceisio ar gysylltiad rhyngrwyd araf poblogi'r y canlyniadau hyn yn byw. Er mwyn gwneud hynny, gallwn mewn gwirionedd yn gwneud addasiad syml iawn i'n quote.js ffeil. Ar hyn o bryd rydym yn atodi y digwyddiad hwn pan fydd y ffurflen yn cael ei chyflwyno. Dydyn ni ddim wir eisiau gwneud y defnyddiwr cyflwyno'r ffurflen anymore, felly gadewch i ni yn lle tân y digwyddiad hwn bob tro y mae'r defnyddiwr yn pwyso allwedd. I wneud hynny gadewch i ni gyntaf yn newid y digwyddiad o gyflwyno i keyup. Mae hynny'n golygu bod yn hytrach nag aros am y ffurflen hon i gyflwyno, bob tro yr allwedd yn cael ei bwyso, rhywbeth yn mynd i ddigwydd. Mae bellach yn gwneud synnwyr i osod y digwyddiad hwn keyup i'r ffurflen gyfan. Rydym yn wir yn unig yn gofalu am y blwch chwilio. 

I ddewis hynny yn awr, gallwn newid hyn i fod, yn hytrach na ffurf-dyfynbris, ffurflen-dyfynbris a bydd gennym fewnbwn (math = testun) neu gallem ddweud (enwi = symbol) - beth bynnag rydym eisiau. Nawr mae un peth olaf rhaid i ni wneud. Cofiwch i lawr yma pan fyddwn yn dweud dychwelyd ffug rydym yn dweud nad ydym am y digwyddiad diofyn i dân. Ond dim ond fel y digwydd, os ydym yn analluoga hynny yn awr, Nid yw beth bynnag y byddwn deipio i mewn yn mynd i ddangos i fyny yn y porwr anymore oherwydd byddai hynny'n ymddygiad diofyn o deipio i mewn i flwch testun. Nid ydym bellach yn awyddus i ddiystyru hynny, felly gadewch i ddinistrio y ffurflen ffug. Os ydym yn achub hynny a ail-lwytho'r dudalen, yn awr pan fyddaf yn dechrau teipio aapl byddwch yn gweld bod y pris stoc ar y gwaelod yma yn cwblhau yn awtomatig. Felly dyma CS50 Instant Cyllid. A dweud y gwir stori hwyliog am y Instant YouTube yw bod myfyrwyr yn unig fath o ysgrifennu fel prosiect ar 1-nos, a'r ail dydd y cafodd gynnig swydd gan y Prif Swyddog Gweithredol YouTube. Felly, mor syml â hynny, byddwch yn CS50 fyfyrwyr, gall eich prosiectau terfynol gael swydd i chi ar YouTube. Rhywbeth fel 'na yn syniad' n sylweddol oera ar gyfer prosiect terfynol, dde? Rydym yn cael rhywfaint o swyddogaethau presennol ein bod am i integreiddio gyda. Rydym yn gwella profiad y defnyddiwr ychydig bach, ac yn sydyn y gallai chwilio rhywbeth ar YouTube Instant fod yn haws llawer na chwilio amdano ar YouTube rheolaidd. Felly dyna AJAX yn gryno. 

Yn yr enghreifftiau a Joseff oedd yn dangos, gwelsom lawer o awtolenwi, a'r rhai awtolenwi yn iawn, iawn 'n hylaw oherwydd nad oes rhaid i ni gofio - Er enghraifft, os nad ydych yn cofio y pris stoc ar gyfer Apple ac rydym yn unig yn gwybod ei fod yn rhywbeth aa, yn hytrach na dim ond dweud i mi, "Mae cyfran y peth hyn yn costio llawer o arian hwn," Hoffwn fath o hoffi gwybod beth stociau dechrau gyda aa. Gallwn wneud hynny mewn gwirionedd dim â'r llyfrgell Cychwynnydd sy'n cael ei gynnwys eisoes tu mewn CS50 Cyllid. Os ydych yn dod i fyny yma ar y tag JavaScript a sgroliwch i lawr i Typeahead, yn unig yw hwn plugin braf bod rhywun eisoes ysgrifennodd i ni, a gallwn yn hawdd ddefnyddio ei swyddogaeth fel hyn. I deipio mewn A a dyma restr o'r rhai taleithiau sy'n dechrau gyda A. Gadewch i ni ddweud fy mod yn credu bod hyn yn 'n sylweddol oera, ac mae'n amser i mi i gynnwys hyn ar fy nhudalen. Mae'n troi allan bod hyn yn wirioneddol syml. Gadewch i ni neidio dros yma i quote3.js. Mae fy ffeil yn edrych ychydig yn wahanol. Down yma fy holl AJAX pethau yr un fath. Rwyf am barhau i lwytho data stoc heb orfod mynd i dudalen arall. Ond yn awr yr wyf am ddefnyddio'r ategyn. Mae'r dogfennau Cychwynnydd Mae enghreifftiau gwych o sut yn union y gallaf ei wneud hynny. Yr wyf am ddweud, "Dyma y mewnbwn yr wyf am awtogwblhau ymlaen," ac rydw i'n mynd i alw swyddogaeth hon a elwir yn typeahead, ac mae hynny'n mynd i drin yr holl bethau Typeahead i ni. Bydd yn ymgychwyn y rhestr, bydd yn gwneud ein holl hidlo. Yr unig beth mae angen ei wybod yw pa ddata yr ydym ni'n autocompleting ar. Felly wnes i ddarganfod yr allwedd yn unig drwy ddarllen y ddogfennaeth ac edrych ar yr enghreifftiau. Os byddaf yn rhoi ei fod yn allweddol o ffynhonnell, y gwerth yr allwedd hon yn ddim ond rhai amrywiaeth o bethau rwyf am i gwblhau yn awtomatig ar. Mae'r newidyn ddaeth o hyn ffeil arall. I agor symbols.js. 

Mae hyn symbols.js yn unig yw hyn amrywiaeth mewn gwirionedd, fawr iawn sy'n cynnwys llinynnau y rhain i gyd symbolau stoc oddi wrth y NASDAQ. Os ydw i eisiau i neidio yn ôl i'r HTML, felly jharvard, vhosts, globalhost, html, templedi, quote_form. Ers hynny cael ei alw bellach quote3.js, gadewch i mi newid y ffeil JavaScript Rwy'n gan gynnwys yma. Nawr rwyf wedi quote3.js, felly dwi'n mynd i lwytho yn y ffeil JavaScript ar wahân, yr un sydd wedi bod awtogwblhau Cychwynnydd. Nawr pan fyddaf yn neidio yn ôl at y porwr, ail-lwytho'r dudalen, ac yr wyf yn dechrau teipio aa, mae fy AutoComplete. Ac yr oedd mewn gwirionedd mor syml â hynny. Cefais 1 llinell o god sy'n newydd ei ddweud, "Dyma y pethau rwyf am i gwblhau yn awtomatig ar," ac yn sydyn roeddwn yn cael y functionality iawn, iawn 'n glws gyda nid yn llawer iawn o ymdrech o gwbl. Wrth i chi yn datblygu gwefannau ac yn enwedig yr ochr pen blaen o bethau, ydych chi'n mynd i ddod o hyd i hyn yn wir llawer. Mae llawer, llawer, llawer o lyfrgelloedd rhad ac am ddim 'n sylweddol oera i maes' na sy'n ei gwneud yn hynod hawdd i wneud pethau fel hyn. A all unrhyw un feddwl am unrhyw anfanteision syml autocompleting ar y rhestr fawr o symbolau? Beth allai fod yn rhywbeth nad yw'r gorau gyda'r dull hwn? Yeah. >> [Myfyrwyr] Amser, os oes gennych lawer o [Anghlywadwy] Yeah. Ar hyn o bryd rydym yn llwytho i lawr y ffeil JavaScript enfawr ac mae llawer o symbolau. Ac felly os oes gennym tunnell o bethau, y math hwn gallai o gynnydd, yr latency nid yn unig chwilio ond hefyd lwytho i lawr y ffeil ei hun. Great. Unrhyw beth arall? Ar hyn o bryd does dim gwir ymdeimlad o berthnasedd. Os byddaf yn teipio mewn A, y cwmnïau sy'n dangos i fyny yma Efallai na fydd y cwmnïau mwyaf poblogaidd sy'n dechrau gyda A. 

Cyn i mi ddod i Apple, gall gymryd rhai cymeriadau mwy i ddod o hyd i hyn yr wyf i'n chwilio amdano. Nid yw hyn awtogwblhau oes ymdeimlad o berthnasedd. Mae'n jyst yn mynd i ddweud, "Mae unrhyw beth sy'n cyfateb Rydw i'n mynd i ddangos." Yn lle hynny, hoffwn i rhywsut integreiddio rhai perthnasedd i mewn i fy chwiliadau. Os byddaf yn mynd dros yma i Gyllid Yahoo!, finance.yahoo.com, Os byddaf yn ceisio mynd i mewn i symbol ar Yahoo! Cyllid dudalen ac yr wyf yn dechrau teipio GOOG, mae gennyf y rhestr hon 'n glws o bethau. Yn amlwg, mae'n edrych fel Cyllid Yahoo! yn gwneud rhywbeth mwy clyfar yma. Maent yn cael rhywfaint o berthnasol ac mae ganddynt hefyd wybodaeth ychwanegol fel enw'r stoc. Mae hynny'n rhywbeth na allaf ei gael gyda dim ond fy rhestr stoc o symbolau. Rwyf am hyn ac felly dwi'n mynd i'w gymryd. I wneud hynny gadewch i ni wneud ychydig o bethau. Gadewch i ni yn gyntaf yn agor yr arolygydd ar y dudalen hon oherwydd ein bod yn gweld nad oedd y dudalen hon yn ail-lwytho o gwbl, felly mae'n debyg gan ddefnyddio AJAX rhywsut cael ei lwytho ei ddata. Gallwn ganfod pa ddata mae'n llwytho. Os byddaf yn cliciwch ar y tab Rhwydwaith, mae'r rhain yn mynd i fod yr holl geisiadau sy'n dechrau cael eu tanio. Nawr, os wyf deipio i mewn goo, gallwn weld bod Fi jyst got cais HTTP newydd. Mae hyn yn debyg lle bo'r data yn dod o. Cadarn ddigon, os wyf yn edrych ar y URL, sydd bach yn rhyfedd a enwir, gallwn weld bod hyn yn union lle Yahoo yn anfon oddi ar ei data o. 

Rwyf wedi creu ffeil ar wahân o'r enw suggest.php sy'n debyg iawn o ran ysbryd i'r swyddogaeth am-edrych. Mae'n bôn yn mynd i wneud ymholiad i Yahoo yn URL, fynd yn ôl rhywfaint o ddata, a'i anfon yn ôl i mi. Yn awr, yn hytrach na defnyddio'r mawr, rhestr enfawr o symbolau, Gallaf ddefnyddio Yahoo yn bethau perthnasedd 'n glws, ac nid oes gennyf i lwytho i lawr y ffeil JavaScript enfawr. Im 'yn unig yn mynd i dynnu i lawr y symbolau stoc mewn gwirionedd yn berthnasol. Gadewch i ni neidio i mewn i hynny. Felly html, js. Rydym yn awr yn quote4. Nawr rydym yn bellach yn defnyddio'r rhestr fawr o ffeiliau JavaScript. Ond mae 'na fath bach o broblem ddylunio yma. Rydym wedi dweud bod y A yn AJAX yn asynchronous. Beth mae hynny'n ei olygu yw bod pan fyddaf yn gwneud cais AJAX, felly dde yma ar-lein 8, dyma lle fy AJAX cais yn cael ei danio mewn gwirionedd. Gadewch i ni ddweud yn awr yr wyf yn cael rhywfaint o cod i lawr yma sy'n mynd i wneud rhai pethau hoffi gwybod i'r defnyddiwr neu rywbeth newid ar y dudalen. Nid yw Beth sy'n mynd i ddigwydd yw nad yw'r porwr yn mynd i aros am y cais hwn i barhau cyn dod i lawr a bwrw y llinell hon. Dyna y rhan asynchronous. Mae'n mynd i wneud y cais hwn ac yn dweud, "Pryd bynnag fyddwch yn gorffen, "Dod yn ôl a galw swyddogaeth honno yr wyf yn dweud wrthych i alw y tu mewn o lwyddiant." Mae hynny'n golygu na fyddwn ni'n gallu lawrlwytho'r holl stociau ymlaen llaw. Mae angen i ni wneud y cais ac yn aros am rywbeth i ddod yn ôl. Mae hynny'n golygu bod o'r blaen, a allem ddweud Cychwynnydd, "Dyma'r rhestr o bethau rwyf am i chi gwblhau yn awtomatig ar." Ni allwn wneud hynny mwyach oherwydd nad ydym yn gwybod beth rydym am ei mewn gwirionedd AutoComplete ar. Yn ffodus, Cychwynnydd meddwl am hyn oherwydd eu bod yn guys smart dros yno, ac y maent mewn gwirionedd yn rhoi i ni ffordd arall i lwytho hwn plugin Typeahead. Cyn, y gwerth yr eiddo hwn ffynhonnell yn unig oedd hon amrywiaeth mawr o bethau i gwblhau yn awtomatig ar. 

Nawr bod y eiddo ffynhonnell mewn gwirionedd yn swyddogaeth, a diben y swyddogaeth hon yw i chyfrif i maes beth y pethau i gwblhau yn awtomatig ar yn cael eu. Mae'r ffordd y mae'n mynd at chyfrif i hynny yw drwy fod yn mynd i ofyn i Gyllid Yahoo! beth yw'r pethau gorau i'w gwblhau yn awtomatig yn cael eu. I wneud fy mod i'n mynd i wneud cais AJAX yn debyg iawn. Rydw i'n mynd i ofyn am y dudalen hon ar suggest.php. Dw i eisiau anfon ar hyd y symbolau o hyd. Ac yn awr fy llwyddiant, mae'r dogfennau Cychwynnydd wrthyf er mwyn boblogi y rhestr o bethau, i gyd angen i mi ei wneud yw pasio yn y casgliad yn awr at y swyddogaeth galw'n ôl. Ond arhoswch funud. Os yw hyn yn dybiedig i fod yn amrywiaeth a AJAX yn anfon i mi yn ôl testun, sut y mae hynny'n bosibl? Mae hyn yn cyflwyno ffordd newydd o gyfnewid data a elwir yn JSON. Yn yr achos hwn nid ydym yn unig yn dychwelyd llinyn syml o destun. Nawr rydym yn delio â rhestr hon yn fwy cymhleth o symbolau stoc. Gall y symbolau stoc hefyd gynnwys pethau fel enw y cwmni neu y prisiau cyfredol. Dim ond gan ddefnyddio llinyn hir mawr nad ei fformatio mewn unrhyw ffordd ragweladwy nid yw'n mynd i fod yn y ffordd orau i gael y data hwn o Yahoo weinyddwr i mi mewn ffordd y gallaf ei deall yn hawdd. JSON yn dechnoleg sydd yn cymryd mantais o sut yr ydym yn creu araeau cysylltiadol yn JavaScript. Mae hyn yn edrych yn llawer fel amrywiaeth JavaScript cysylltiadol, ac yn wir, mae'n oherwydd ei fod yn. JSON yn sefyll am Nodiant Gwrthrych JavaScript. Hyn yn y bôn yn cytuno ar fformat ar gyfer trosglwyddo data yn ôl ac ymlaen. Yma y gwrthrych JSON hwn neu arae cysylltiadol JSON yn anfon 'm rhywfaint o ddata am gwrs. 

Mae'r bysellau hwn yn amrywiaeth yw pethau fel gwrs sydd â gwerth o cs50, ac i lawr yma, gallwn weld y gallaf gael gwerth sydd yn arae. Nid oes rhaid i mi wneud pethau fel gramadegu allan llinynnau a chwilio am atalnodau ac yn gwneud pethau gwirion fel 'na. Oherwydd bod hyn yn cael ei ddatgan yn y fformat hwn JSON, JavaScript a jQuery eisoes swyddogaethau i drosi llinyn sy'n edrych fel hyn JSON i mewn arae cysylltiadol JavaScript gwirioneddol y gallwn weithio gyda nhw. Wneud hynny yw mor syml â dweud nad ydynt bellach yn y ffeil, suggest.php, anfon 'm yn ôl dim ond llinyn o destun, ond rwy'n gwybod ei fod yn mynd i gael ei anfon i mi yn ôl JSON. Mae hynny'n golygu y gall y JSON ei droi'n amrywiaeth JavaScript cysylltiadol. Ac felly jQuery, hoffwn i chi i wneud hynny i mi. Mae hynny'n golygu bod y paramedr ymateb yma, nid yw hyn yn bellach yn unig linyn. Oherwydd ein bod wedi dweud jQuery fod yma yn dod rhai JSON, jQuery yn mynd i fod yn smart ddigon i ddweud, "Rydych eisiau JSON?" "Rydw i'n mynd i drosi hynny'n arae cysylltiadol i chi." Gadewch i ni mewn gwirionedd yn cymryd golwg ar y tab Rhwydwaith unwaith y byddwn wedi quote4.js. Byddwn yn newid hyn ac ail-lwytho'r dudalen. Nawr rwy'n mynd i deipio mewn-a eto. Rydw i wedi gwneud ceisiadau cwpl i suggest.php, ond yn awr yr ymateb hwn, yn hytrach na dim ond y llinyn, mae'n JSON. Felly, yr wyf yn cael Brace cyrliog agored yn dweud, "Dyma daw amrywiaeth cysylltiadol." 

Y allweddol cyntaf a dim ond y arae cysylltiadol gelwir symbolau, ac yna dyma amrywiaeth o'r holl symbolau perthnasol yn dod yn awr nid o Cyllid Yahoo!, o'r rhestr enfawr. Dyna sut y gallaf syml poblogi'r hon plugin AutoComplete gyda rhywfaint o ddata nad sy'n dod o ffeil lleol sydd wedi pennu ymlaen llaw yn barod ond o rywbeth arall. Mae'n troi allan y gallwn mewn gwirionedd yn cymryd mantais o dechnoleg o'r enw JSONP, neu JSON gyda padding, a fydd yn dileu y middleman suggest.php. Ond yn hytrach na gwneud hynny, gadewch i ni yn lle hynny yn cymryd golwg ar sut y gallaf wella'r hyn hyd yn oed yn fwy. Fi 'n sylweddol yn hoffi Typeahead Cychwynnydd yn. Mae'n neis iawn. Ond rydym yn cael yn dda yn JavaScript ac rydym am fath o wneud hyn ein hunain, efallai yn edrych ar beth y gallai hyn plugin yn ei wneud. Gadewch i ni bellach yn defnyddio'r peth Typeahead, a gadewch i ni geisio gwneud y rhestr hon o stociau yn awgrymu ein hunain. Yma yn quote6.php rydym yn mynd i ddechrau oddi ar yr un ffordd. Mathau rhywun Bob tro rhywbeth, rydym am wneud cais AJAX. Mae hyn yn debyg i'n Instant Cyllid wreiddiol CS50. Yn hytrach na gwneud cais i quote.php, rydym yn awr yn gwneud cais i'r ffeil yr un ag o'r blaen, mae hyn yn suggest.php, sydd yn unig yn mynd i dynnu data gan Gyllid Yahoo!. 

Unwaith eto, rydym yn dal i ddisgwyl JSON, ond yn awr gan nad yw'r Typeahead yn gwneud hyn i ni, angen i ni hefyd anfon ar hyd y gwerth sydd tu mewn i'r blwch testun ar hyn o bryd. Nawr rydym yn gwybod beth i'w ofyn i Gyllid Yahoo! am, ac felly, yn awr dyma 'r swyddogaeth yr ydym am ei gyflawni unwaith y bydd y cais yn cwblhau. Nid oes gennym yr ategyn i wneud y rhestr i ni, felly dyma lle'r ydym yn mewn gwirionedd yn mynd i adeiladu rhestr o awgrymiadau. I wneud hynny, yn llawer fel yn PHP rydym yn cydgadwyno llinynnau hyn yn fawr o HTML yna rydym yn eu hargraffu, gallwn wneud y peth union yr un yn JavaScript. Yn gyntaf rydym yn mynd i ddechrau oddi ar y llinyn a elwir yn awgrymiadau, ac mae'r llinyn yn unig yn mynd i gynnwys rhai HTML. Rydym am iddo fod yn rhestr o bethau, felly rydym yn mynd i ddechrau i ffwrdd gyda tag hwn rhestr, ac yn awr rydym yn mynd i ailadrodd dros yr holl symbolau a ddychwelwyd yn ôl atom. Cofiwch, oherwydd ein bod wedi dweud datatype: 'JSON', nid yw hyn yn llinyn. Mae hyn eisoes arae i ni. Dyna 'n sylweddol oera. Gallwn ddweud yn syml, "Rwyf am i chi atodi elfen rhestr." Byddwn yn ei roi y tu fewn i elfen yn ochr a hynny, byddwn yn rhoi dosbarth o awgrymiadau felly rydym yn gwybod beth ydyw, ac yn awr dyma yw'r symbol ein bod yn got yn ôl o Gyllid Yahoo!. 

Unwaith y byddwn wedi creu elfen ar gyfer pob un o'r symbolau rydym wedi gotten yn ôl, rydym yn unig am gau oddi ar y rhestr. Felly nawr awgrymiadau yn cynrychioli darn hwn yn HTML bach pan rhoi ar dudalen yn mynd i fod y rhestr o bethau yr ydym yn chwilio amdano. Nawr gadewch i ni mewn gwirionedd yn rhoi hynny ar y dudalen. I wneud hynny rwyf wedi creu arall mewn gwirionedd div gwag ac rwyf wedi rhoi ei ID o awgrymiadau. Mae llawer yn hoffi ydym yn gosod cynnwys y div a fyddai'n dangos y pris y data stoc, rydym yn awr yn unig am osod y cynnwys y div i beth bynnag y llinyn yn sy'n cynnwys y symbolau hyn. Trwy ddefnyddio'r dull hwn HTML, mae hyn, amrywiol awgrymiadau llinyn yma, sef cyfres o HTML. Rwyf am i chi gymryd y HTML ac yn ei roi y tu mewn i'r div o'r enw awgrymiadau. Rydym wedi atodi rhywbeth i'r DOM yn awr. Rydym wedi ychwanegu rhai elfennau newydd i'r DOM y gallwn yn awr ddangos ar y dudalen. Gadewch i ni weld beth mae hyn yn edrych fel. Os byddwn yn llwytho yn quote6 ac yn awr rydym yn dod yn ôl, nawr pan fyddaf yn dechrau teipio aapl, nid oes gennym y Cychwynnydd gwblhau yn awtomatig, ond bellach mae gennym y rhestr hon yr ydym yn gwneud ein hunain. Mae hwn yn uglier ychydig na'r Typeahead Cychwynnydd, er enghraifft, ond mae'n caniatáu i ni wneud un peth arall. Pan oeddem yn edrych ar y Cychwynnydd ategyn, gwelsom fod pan fyddwn yn autocompleted, un o werthoedd AutoComplete oedd aapl. Efallai na fydd hynny fod mor barod i helpu. Fel defnyddiwr, efallai na fyddaf yn syth yn cydnabod yr holl symbolau stoc. Beth wyf yn ôl pob tebyg yn fwy tebygol o gydnabod yn enwau y cwmni ei hun. Ni fyddai Felly mae'n wirioneddol ddefnyddiol pe yn hytrach na dweud aapl hyn yn dweud rhywbeth fel Apple Inc Oherwydd ein bod wedi cyflwyno hyn ein hunain, gallwn yn hawdd iawn gwneud hynny. Gadewch i ni agor ein ffeil dyfyniad olaf yma, felly quote7. 

Un peth. Rydw i wedi creu dim ond ffeil arall PHP a fydd yn dychwelyd atom yn fwy na dim ond y symbolau. Bydd hefyd yn rhoi i ni yn ôl enwau y cwmni. Ac felly rydym yn ei wneud yr un peth. Rydym yn gwneud cais AJAX. Unwaith y bydd y cais wedi ei gwblhau, rydym yn mynd i weithredu swyddogaeth hon yma, ac mae'r swyddogaeth yn mynd i adeiladu i fyny cyfres fawr o elfennau. Ond y gwahaniaeth yma yw bod gwerth y rhestrau yn bellach dim ond y symbol, mae bellach yn yr enw. Felly mae gennym un broblem bach. Pan fyddwn yn defnyddio ein lookup, mae angen i ni rywsut yn ei throsglwyddo i'r symbol. Ni allwn basio rhywbeth am-edrych fel Microsoft Corporation. Mae angen i ni ei throsglwyddo MSFT. Pan fyddwn ni'n ysgrifennu HTML, rydym yn cael llawer o braf adeiledig mewn nodweddion. Mae Gallai fod wedi gysylltiedig ag ef yn href neu ddosbarth. Ond yr hyn y mae gwir angen yn awr yw i bob un o'r cysylltiadau i gael symbol stoc sy'n gysylltiedig ag ef. Does dim adeiledig yn y briodoledd HTML ar gyfer symbol stoc, ond yn ffodus, HTML5 yn ein galluogi i greu ein priodoleddau eu hunain i fod beth bynnag rydym eisiau. Drwy ddweud data-symbol, rwyf wedi cyflwyno nodwedd newydd ei enw Fi jyst gwneud i fyny, ac mae hyn yn iawn oherwydd fy mod yn ei rhagair gyda'r data hwn. Rydym yn mynd i storio y tu mewn o yno y symbol o'r stoc yn awr. Beth mae hynny'n ei olygu yw bod hyd yn oed er ein bod yn dangos y gwerth enw'r cwmni tu mewn ein AutoComplete, rydym yn dal i gofio y symbol sy'n gysylltiedig â phob cwmni. Mae'r ffordd yr ydym ni'n gwneud hynny yw tu fewn yr elfen hon ei hun. Felly mae hynny'n golygu mae angen i ni wneud un newid mwy. Pan fyddwn yn clicio yn awr, mae angen i ni mewn gwirionedd yn manteisio ar y priodoledd symbol yn hytrach na dim ond ei werth. Os ydym yn ôl i fyny, rydym yn atodi trin digwyddiad i awgrymiadau. Pryd bynnag y bydd un o'r awgrymiadau hyn yn cael ei glicio yn awr, yr wyf am wneud rhywbeth. Hyn yr wyf am ei wneud yw newid y gwerth y blwch mewnbwn. Nawr rwyf am osod y swyddogaeth hon Val yr un. 

Felly, heb unrhyw ddadleuon swyddogaeth hon val yn dychwelyd i chi beth sydd eisoes yn y blwch testun, ond os byddwch yn rhoi ei fod yn llinyn, mae'n mynd i gymryd y llinyn ac yn ei roi yn y blwch testun. Rwy'n dewis ei flwch testun yn yr un ffordd. Ei enw i yw y tu mewn i symbol o ffurf-dyfynbris. Nawr rwy'n ei anfon gwerth y briodoledd data-symbol. Mae hyn yn peth yma yn newydd, mae hyn yn $ (hyn). Beth mae hyn yn cyfeirio ato yw'r elfen sy'n cael ei glicio. Gallwn weld yma nad ydym yn atodi digwyddiad cliciwch i bob elfen gyda dosbarth o awgrym yn unigol. Yn hytrach, rydym yn agosáu at hyn ychydig yn wahanol. Yn hytrach, rydym yn dweud pryd bynnag y tu mewn i unrhyw beth y div awgrymiadau, sydd cofiwch yn unig y cynhwysydd ar gyfer y rhestr, os oes rhywbeth y tu mewn y div yn cael ei glicio ac mae ganddi ddosbarth o awgrym, Rwyf am y digwyddiad hwn i dân. Yn y bôn beth mae hyn yn golygu y gallwn ei wneud yw y gallwn ailddefnyddio hon trin un digwyddiad gyfer pob un o'r pethau yn y rhestr. Felly nid oes raid i ni gael un sy'n trin digwyddiad ar gyfer yr elfen gyntaf ac yn trin ddigwyddiad gwahanol ar gyfer yr ail elfen. Gallwn yn hytrach na dweud, "Rwyf am i'r trafodwr un digwyddiad i wneud cais i bopeth yn fy rhestr." Ond mae angen i rhywsut wybod pa elfen oedd yn clicio. Mae hyn yn "y" gair allweddol yn cynrychioli ychydig hynny. Mae hwn yn y gwrthrych a chlicio yn unig gan y defnyddiwr. Os Fi jyst clicio ar y ddolen 3ydd hyn yn cynrychioli elfen o sy'n cysylltu 3rd, sy'n golygu y gallaf gael ei priodoledd, data-symbol, yr ydym yn ei adnabod i gynnwys y symbol sy'n gysylltiedig â sawl cwmni Fi jyst clicio. Os byddwn yn neidio yn ôl i'r dudalen cyllid, gallwn weld nawr ar ôl i mi ddechrau teipio rhywbeth fel MSFT, rydym yn bellach yn cael dim ond y symbolau stoc, rydym yn awr yn cael y cwmnïau go iawn. Ond pan fyddaf yn clicio ar un o'r cwmnïau hyn, gallwn weld ein bod mewn gwirionedd nid poblogi y blwch testun gyda'r enw'r cwmni ond gyda beth bynnag yn cael ei storio y tu mewn o'r rhai nodweddion data. Ac felly os wyf mewn gwirionedd yn archwilio un o'r elfennau hyn drwy dde-glicio ei a chlicio Archwilio Elfen, gall y byddwn yn gweld beth mae hyn yn edrych fel. 

Cofiwch hyn yn rhywbeth yr ydym greu y tu mewn o hynny ar gyfer dolen pan oeddem yn adeiladu i fyny y llinyn o HTML. Gallwn weld yma fod y data-symbol y gwerth MSFT, sy'n wych. Dyna beth rydym yn ei ddisgwyl. Dyna y symbol a dyna sut rydym yn cael y gwerth y mae angen i ni ddefnyddio tu fewn y blwch testun. Dyna ddigon am y ffurflen dyfyniad oherwydd dyna math o ddiflas. Gadewch i 'jyst yn gwneud rhai gwelliannau cyflym i'n tudalen portffolio. Os ydych chi wedi defnyddio CS50 Cyllid am gyfnod a byddwch yn dechrau prynu a gwerthu llawer o stociau, yn y pen draw y tabl hwn yn mynd i gael eithaf mawr, a ydych yn mynd i eisiau Ticker stoc, wrth gwrs. Unwaith y bydd y bwrdd yn wirioneddol fawr, gallai fod yn ddefnyddiol ar gyfer y defnyddiwr i geisio chwilio drosto. Y tu mewn i'r blwch chwilio os byddaf yn dechrau teipio rhywbeth fel Disney ac yn chwilio am fy stoc Mouse Mickey, gallwn weld bod y tabl yn awr yn hidlo seiliedig ar yr hyn yr wyf deipio yn unig i mewn Mae'r swyddogaeth yn edrych gymhleth super, ond mae'n wirioneddol, yn hawdd iawn gyda jQuery a JavaScript. Mae'r ffeil hon yn cynnwys portfolio.php ffeil JavaScript enw portfolio.js. Gadewch i ni edrych ar hynny. Felly html, js, portffolio. Dyma lle rydym yn gwneud hynny chwilio ar y bwrdd. Y peth cyntaf i mi angen i chi ei wneud yw atodi trin digwyddiad i fod blwch testun oherwydd gwyddom ein bod am i'n swyddogaeth hidlo i dân bob tro y defnyddiwr gweisg rhywbeth oherwydd nad oes gennym amser i botymau Chwilio. Y peth cyntaf mae angen i ni ei wneud yw chyfrif i maes yr hyn y mae'r defnyddiwr yn chwilio am, yn union fel y gwnaethom o'r blaen. Mae'r gair allweddol yn cyfeirio at yr elfen gyfredol y defnyddiwr yn rhyngweithio â hwy. 

Oherwydd bod y defnyddiwr yn rhyngweithio gyda'r bocs chwilio, $ Hyn yn cynrychioli y blwch chwilio, felly this.val yn rhoi i ni beth sydd tu mewn i'r blwch chwilio ar y defnyddiwr yn teipio ar hyn o bryd. Felly, yn awr yr hyn yr ydym eisiau ei wneud yw ydym am ailadrodd dros yr holl o'r rhesi tu mewn ein tabl. I ddewis pob un o'r rhesi yn ein bwrdd, rhoddais y tabl hwnnw ID o bortffolio tabl, ac mae pob rhes yn cael ei gynrychioli gan elfen TR, felly mae'r dewisydd yn mynd i ddychwelyd i mi amrywiaeth mawr yr holl rhesi yn fy tabl. Nawr rwyf am i ailadrodd dros y casgliad. Gallwn i chi am dolen, ond mewn gwirionedd jQuery yn rhoi i ni y swyddogaeth 'n glws a elwir yn "un." Hyn y mae pob ei wneud yw pob un yn cymryd un ddadl, a bod y ddadl yn un o swyddogaethau. Beth mae'n mynd i wneud yw ei fod yn mynd i wneud cais swyddogaeth honno i bob elfen y tu mewn o'r rhestr hon. Mae'r swyddogaeth hon yn cymryd un ddadl sy'n e, a phan fydd y swyddogaeth hon yn cael ei gyflawni, yr e yn mynd i gael ei ddisodli gan y rhes gyntaf, yna yr ail res, ac yna y drydedd res. Erbyn y modd hwn, dyma'r un peth â rhedeg gyfer dolen ac yna figuring yr elfen gyfredol sy'n seiliedig ar y tu mewn mynegai o'ch gyfer dolen. Ym mhob fersiwn, ar gyfer pob un o'r elfennau hyn yn y tabl, Rwyf am i wirio a yw'r testun yr elfen - destun y gell y tu mewn y rhes - cyfateb i'r hyn yr wyf i'n chwilio amdano. Mae'r llinyn hir o orchmynion mawr yw sut y gallwn i wneud hynny. Yn gyntaf, unwaith eto, mae hyn bellach yn cyfeirio at - oherwydd ei fod y tu mewn swyddogaeth newydd - hyn yn awr yn y rhes ar hyn o bryd yn y tabl. Hoffwn fanteisio ar y rhes ar hyn o bryd yn y tabl, ac yr wyf am gael ei holl blant. Cofiwch, mae'r DOM yn goeden hierarchaidd, sy'n golygu bod elfennau nifer o blant. 

Mae hyn yn. Swyddogaeth plant yn mynd i ddychwelyd i mi yn ôl amrywiaeth o holl elfennau bod yn blant, yn yr achos hwn, mae rhes yn y tabl. Mae hyn yn dim ond dim ond y celloedd y tu mewn y rhes. Fi jyst eisiau i chwilio dros y gell gyntaf. Swyddogaeth hon. Cyntaf yn dweud ei roi i mi yr elfen gyntaf yn y casgliad. Yna y swyddogaeth testun yn dweud fy nghael yn union beth sydd tu mewn y gell ers i mi am i chwilio dros y testun. Yn olaf, gadewch i ni ei drosi i lythrennau bach, fel y gallwn wneud ymholiadau achos testun ansensitif. Yn olaf, rydym am weld os yw'r llinyn tu mewn tabl yn cynnwys y llinyn rydym yn chwilio am. Mae'r swyddogaeth indexOf yn JavaScript yn gwneud hynny. Mae'n dweud wrthym a yw hyn yn cynnwys llinyn arall llinyn. Os yw'n wir bod y gell yn cynnwys yr hyn yr wyf i'n chwilio am, yna rwyf am wneud yn siŵr ei fod yn dangos. Bydd y dull sioe yn dweud, "Dangos yr elfen." Os nad yw hyn yn wir, yna mae hynny'n golygu beth bynnag Dw i'n chwilio am nad yw'n cynnwys o fewn y rhes honno, ac felly rwy'n awyddus i guddio oddi wrth y defnyddiwr. Mae hynny'n cyflawni hynny effaith 'n glws hidlo lle nad oes bellach gwelwn y tabl cyfan. Os oes gennych ddiddordeb mewn sut i wneud hyn yn Ticker yn ogystal, byddwn yn postio'r ffynhonnell ar-lein. Ond mae'n wirioneddol syml. JQuery Mae dulliau anhygoel ar gyfer y animeiddiadau ac eiddo CSS drin. Felly, dyna ni i mi. 

Beth felly sydd o'n blaen? Fel y gwelwch mewn ychydig ddyddiau, y cynnig prosiectau terfynol yn ddyledus. Bydd y cynnig prosiectau terfynol yn gofyn ychydig o gwestiynau, ond bydd yn eu plith bydd tri cerrig milltir - un yn "dda" garreg filltir, un yn garreg filltir yn well, ac un yn orau. Y syniad yw mewn gwirionedd i'ch helpu chi guys gosod eich disgwyliadau fel bod cyn lleied â phosibl byddwch yn hapus gyda'r allbwn eich prosiect terfynol a bydd yn "dda" cyn belled ag y byddwch yn pryderu. Ond wedyn er budd eich cael chi i gyrraedd ychydig bach i rhywbeth gwell neu rywbeth gorau, byddwn hefyd yn trefnu o gwthio i chi tuag at hynny hefyd. Mae'r CS50 Hack-a-thon, yn y cyfamser, mewn ychydig wythnosau. Fel arfer, rydym yn gwneud hyn ar sail loteri sail oherwydd diddordeb, ond groes yw y bydd yn cymryd ychydig gannoedd o ohonom mewn bysiau gwennol o Harvard Square i lawr i Kendall Square lle mae Microsoft wedi gyfleuster hyfryd o'r enw aptly "NERD" - Ymchwil Lloegr Newydd a Datblygu Center. Byddwn yn cyrraedd yno tua 20:00 Bydd gennym rhywfaint o fwyd. Mae tua 1:00 bydd gennym fwyd rhai mwy. Mae tua 5 am os ydych yn dal i fod yn effro byddwn pennaeth drosodd i IHOP neu fynd â chi yn ôl i'r campws. Yr amcan mae i ddeifio i mewn i brosiectau terfynol ochr yn ochr â chyd-ddisgyblion ac o staff. Yna ychydig ddyddiau'n ddiweddarach yn y Ffair CS50, sy'n cael ei olygu mewn gwirionedd i fod yn gyfle i chi guys i arddangos eich gwaith a llwyddiannau ar gyfer y semester wrth rwbio ysgwyddau â'i gilydd a chael ymdeimlad o beth mae pawb yn ei wneud. Gyda dweud hynny, llawer o ddiolch i Tommy ac i Joseph, a byddwn yn eich gweld ar ddydd Llun.  [Cymeradwyaeth]