>> Okay, så i dag, Jeg har tænkt mig at tale
om JavaScript og hvordan det er forskellig fra andre sprog
at du kan blive bruges til at lide PHP.
Så i den sidste forelæsning om Mandag talte vi lidt
om, hvad der ligner, hvad er fortrolig mellem JavaScript
og PHP eller Python eller Ruby eller C eller andre sprog
at du allerede er bekendt med.
Men JavaScript det faktisk har en virkelig unik take
på objektet, der muliggør det slags helt anderledes
end de fleste sprog, du kommer til at beskæftige sig med.
Så funktioner er en slags
af underappreciated koncept i JavaScript.
De er langt mere magtfulde end de er i andre sprog
fordi de kan i - for en grund,
de er i stand til at være indstilles som værdier.
Så lige her har vi var x lig funktion
og det er en første klasses værdi, der kan videregives
rundt som et argument.
Så du behøver ikke at erklære funktionen x
og bare bruge x i dette omfang.
Du kan passere værdien af ​​x hvor som helst i hele, du ved,
som et argument i en anden funktion
hvor du kan modul eksport som David nævnt i node.
Så næste punkt er
at en funktion er en objekt i JavaScript.
Så du kan faktisk indstillet egenskaber som værdier
på en funktion og bare behandle det, som det er et objekt.
Så når du arbejder med jQuery, du ved, at dollaren
og så du passerer en vælger ind i det
og påberåbe sig det som en funktion.
Men så skal du også have dollar dot AJAX.
Og som ikke slags mening, hvis du tror
en funktion, lige som noget du kan påberåbe sig
eller ring.
Men JavaScript kan du indstille egenskaber på funktioner
som statiske egenskaber med blot x dot someProp
da jeg påpegede derude.
Det næste punkt, som vi er vil gå ind i en lidt mere
i dybden, er det faktum, at funktioner kan behandles
som klasser i JavaScript.
Så der er konceptet af denne nye operatør
som skaber en ny instans af funktionen sammen med en slags
ligesom klasse legeme der kommer sammen med det
og vi kommer til at gå ind i det lidt mere,
det hedder prototypen.
Og det er hvad der er fabrikater JavaScript meget unikt i forhold
til andre sprog som er klasse baseret på,
JavaScript er en prototype baseret på.
Og så bare på bunden der,
Funktionen kan bare blive kaldt tydeligt som vi er vant til.
Så det er ikke noget nyt.
En anden ting, der er unik, er
at arrays er faktisk objekter.
De er ikke som de er i PHP
hvor du bare oprette et nyt array.
Dette er faktisk en forkortelse for at sige nyt array.
Og array er faktisk en underklasse af et objekt.
Så det er noget anderledes, og jeg vil gå
i lidt mere detalje på det.
Og debugging kapaciteter
med JavaScript er virkelig uovertruffen så vidt jeg har set.
Dette er et skærmbillede af Chrome Inspector
som vi kommer til at skal bruge for resten
af præsentationen i dag.
Og for at komme til dette, skal du bare gå til fil udviklingsværktøjer
og åben Chrome Inspector eller du kan højreklikke
og klik på Vis element I synes, det er på HTML-side
eller jeg synes det er kommando option J åbner det op.
Men vi vil gå ind i dette, og du kan faktisk sætte breakpoints
som du kører igennem JavaScript-koden og sortere
af vurdere, hvad de lokale variabler er, hvad værdien
dette er, og det gør det måde lettere at debug kode.
Og lad være - det er ikke begrænset til browser-side kode
men du kan faktisk køre et eksempel
denne Chrome inspektør for din service side kode
som er virkelig nydelige, fordi du kan træde igennem linje for linje
som en anmodning kommer ind i dit server og se, hvad der sker
og lege med de variabler i konsollen hernede.
Så som jeg nævnte, JavaScript er en prototype-baseret sprog
hvilket betyder, at der er et sæt standardværdier, som er sortere
skjult for hver funktion
i objektet dot prototype ejendom.
Så det er en slags hash af bare forskellige standardværdier
at når du starter en fungere med den nye søgeord,
der er fastsat af standard som funktioner
der er tilgængelige på subsystemet.
Så der faktisk er virkelig effektiv for -
Det er en effektiv måde Oprettelse af objekter hukommelse klogt
fordi JavaScript runtime kun at holde styr
af prototypen af ​​objektet.
Den slags peger på, at
når du cretae en ny instans af en klasse.
Og du kan også efterligne arv, som er kendt
i klasse-baserede sprog hvor du har slags
ligesom en dette udvider dette, strækker sig, at du kan efterligne
at i JavaScript gennem hvad der kaldes den
prototype kæden.
Og vi vil se eksempler om det.
Så hvis din - jQuery plugins faktisk de anbefaler jQuery
forfattere til at anvende dollar prik fn at tilføje funktionalitet
til jQuery biblioteket.
Og vi faktisk kommer til at springe til - Så på denne side,
vi har dollaren - Jeg inkluderet jQuery.
Og hvis du gør dollar dot i konsollen
som jeg nævnte bringe dig op gennem kommando skift J
eller bare gå til Vis, Udvikler, Developer Tools
og gå til fanen Kilder.
[Lydløs Bemærkning]
Oh sikker. Så da jeg startede at skrive i en variabel,
det er auto-udfyldt for mig hvad der er tilgængeligt der.
Så jeg har skrevet i dollar, og jeg kan se Jeg tror Chrome har nogle
indbygget dollar, dollar og dollar x.
Så lige nu er jeg bare vil have dollar og jeg sat i en prik.
Og så viser mig alle de egenskaber,
der er tilgængelige på jQuery objekt.
Men hvis jeg gør dollar dot prototype
Jeg ser nu alle de metoder at jeg er vant til at bruge
når jeg har dollaren, selector og så vil jeg kæde det med,
du ved, tilføje klasse eller føje eller sløre eller nogen af ​​lignende.
De er alle faktisk på prototypen
der under kølerhjelmen jQuery opretter en ny instans af sig selv
og det slags skjuler alle disse oplysninger fra dig.
Så pointen, at jeg var gør tilbage herovre
med den funktion, de faktisk skjule prototype fra dig
og bare alias den til dollar dot fn.
Så de fleste mennesker faktisk ikke klar
at der er en prototype under kølerhjelmen that -
at du kan indpasses i og tilføje ekstra funktionalitet
hver jQuery eksempel hvis du gerne vil.
Så den "nye" operatør er virkelig slags svært
at forstå først.
Når du ringer til en funktion med "nye",
det er en helt anden måde at kalde funktionen
som hvis du blot kaldes det tydeligt.
Så den "nye" operatør skaber hvad der kaldes en ny instans
af et objekt eller et nyt forekomst af, kan du tænke
af objektet som en klasse.
Og når det sker, at værdien af dette, som kan være bekendt
med fra jQuery, de slags indstille denne
til, hvad der er praktisk på det tidspunkt.
De normalt skal den indstilles til nuværende DOM node, at du er
på som du går igennem som hver eller noget lignende.
De - Denne værdi er meningen at være værdien af ​​eksempel
som du har oprettet med "nye", der omfatter alt
på prototypen kæden og alle af de metoder, som du vil finde
som prototype egenskaber.
Så det afhænger af, hvordan en funktion kaldes,
hvad værdien af ​​denne er.
Og det er virkelig forvirrende hvis du er ny til JavaScript.
Men hver funktion, der hedder har en - har på denne værdi.
Så selvom du ikke har oprettet en ny udgave af noget,
at det antages at være global.
Eller du kan ringe til en funktion ved hjælp af call metode
hvor anvende metode i JavaScript.
Du kan funktionen og specificere, hvad det skal være.
Så du kan gøre det dynamisk, som er virkelig kraftfuld
men giver dig også mulighed for at gøre ting, som kan være vildledende
og forvirrende for andre udviklere
hvis de ikke er brug for den kendsgerning.
Og jQuery, jeg vil hævde gør det endnu mere forvirrende
ved at gøre det praktisk og sætte den
til den aktuelle DOM node.
Men den enkle regel at huske hvad værdien af ​​denne er
når du leder
ved en funktionel opkald er hvad der er tilbage af den prik.
Så hvis du har et objekt
og det er noget prik noget er funktionen
at du ringer derefter første værdi er, hvad værdien
af denne er.
Så her er en kode eksempel
hvor jeg skaber et nyt objekt bogstavelig
som er lige genstand oprettes med de krøllede parenteser
og jeg sætte navn til Bob
og så har jeg en sayName metode her som -
så inde i denne sayName hvis jeg x dot sayName,
værdien af ​​denne er lig til x fordi venstre
af dot er x. Så hvis Jeg kalder det x prik sayName,
det ville sige Hej Bob.
Og så et andet eksempel
hvor jeg faktisk tildele x prik sayName funktionen
variablen Y, der som jeg nævnte
i JavaScript dig kan tildele funktioner
variabler når du vil, det er virkelig fleksibel på den måde,
men nu når jeg kalder Y, det har mistet forbindelse med x.
Så dette er nu global eller hvis du er i streng tilstand,
Jeg tror, ​​det er null eller udefineret.
Men - So Y er ikke, hvad du er forventer her, hvis du søger
ved x og du kommer at kalde sayName,
du forventer dette navn formodes at være Bob.
Men hvis du trak det objektet og kaldte det
af sig selv, det er nu globale.
Og det er hvad jeg nævne når du ser dollar dot dette,
du ofte ikke tænker på hvad der rent faktisk foregår.
Men jQuery slags har deres eget domæne-specifikke sprog
til at løse dette og det er ikke, hvad du er vant
i JavaScript.
Og jeg påpege dette fordi det er virkelig vigtigt
for at skrive velstruktureret objektorienteret kode
i JavaScript til virkelig at have en god forståelse og forståelse
på, hvordan det fungerer, og hvordan objektmodellen værker
og hvordan den nye operatør fungerer.
Ellers vil du ende op med jQuery spaghetti
hvor alt er en slags af over det hele
og kun beskæftiger sig med DOM.
Hvis du kan faktisk skrive JavaScript
på en mere struktureret måde, det gør det meget lettere
at arbejde med, for at sortere af adskille bekymringer
af handlerne med opdatering af DOM og beskæftiger
med den faktiske logik og kode.
Så lad os tage et kig på en par eksempler omkring dette.
Så jeg har nogle eksempler her.
Så dette er blot et enkelt eksempel at bruge et JavaScript objekt
og tilføje et par funktioner til det, og derefter oprette slags
ligesom en miniature ansøgning.
Så det er meget simpelt faktisk.
Det eneste, det gør, er først det beder dit navn.
Så jeg vil sige Tim og så skal du kan ændre dit navn til Bob.
Og det er alt dette ansøgning gør.
Men hvad jeg gerne vil pege ud er, hvordan det gør det.
Så jeg har dette navn generator genstand, der har en start metode
der beder brugeren for deres navn
ved blot at kalde dette askForName
som hernede det gør prompt
hvis navn ikke er blevet tildelt spørger så det for det igen
ved at kalde denne askForName.
Og så når det bliver navnet, det kræver denne opdatering navn.
Så, det sætter brugerens navn i H1 tag.
Og hvis navnet ikke er indstillet, det kaster en fejl.
[Lydløs Bemærkning]
Oh sikker. Så det sætter brugerens navn i H1 tag
ved at kalde setDisplayName der sætter HTML
i JS navn beholderen og Jeg prefixing alle mine HTML
med JS vælgere, bare fordi det er en god vane at komme
ind bare for at gøre det ikke så forvirrende
, når du bruger vælgere som ID'er eller klasser
for både stil og logik
i dit JavaScript frontend applikationer.
Fordi hvis du har forskellige grupper af mennesker, der arbejder
på kodebase, og du har en vælger der
at designeren beslutter at ændre sig, fordi Det er -
ser ikke stor, så de vil til at sætte i en ny klasse og tage
ud din, og du er afhængig på det for JavaScript formål,
så din kode pauser.
Det er godt at præfiks og sortere
ligesom namespace næsten JavaScript-relaterede klasser
eller attributter med et præfiks af JS.
Så det er temmelig simpelt, og du kan se
i alle disse tilfælde, jeg er ringer returnere dette i slutningen.
Så dette er en god vane at komme ind,
til at give dig det en gyldigt returværdi.
I askForName Jeg er ikke fordi det giver mening
at du ville få navn tilbage.
Men hvad der gør det muligt du så gøre
hvis du vender tilbage denne opdatering navn, er det returnerer værdien
af setDisplayName som er returnere værdien af ​​denne.
Og det giver dig mulighed for at sortere af kæde, som du er vant
i jQuery ved at returnere værdien af ​​denne hver gang.
Dette refererer til den nuværende objekter
så man kunne kalde denne prik askForName dot setDisplayName
og det ville holde værdien af ​​dette og giver dig mulighed
at have en dejlig kæde der.
Og så - så i dette andet eksempel.
[Pause]
Ok.
OK. Så lad os gå videre og åbne op konsollen
og gå til min fane Kilder.
Vi pop dette ud faktisk.
Så i Chrome developer værktøjer, som jeg har nævnt,
er dette stykke til højre og en -
du kan se dette stopskilt selv som standard, det er sort.
Men når du fører musen over det, er det siger "Du må ikke holde pause på undtagelser.
Klik på pause på alle undtagelser. "
Og når du klikker på det igen, det bliver blå.
Og nu når som helst at der er en fejl smidt
i din JavaScript-kode, vil det stopper ved det punkt, og giver dig mulighed
at vurdere, hvad der foregår.
Så - Og det er virkelig en nyttig Konceptet er ved at påpege.
Og hvis du klikker på igen, det bliver lilla
og dette er normalt hvad jeg holder det i.
Det bryder kun koden når der er en undtagelse
som ikke er blevet fanget.
Så en masse gange i jQuery for eksempel behøver de forsøger fangster
at teste, om en browser eller ej har en form for kapacitet
og fortsætte derfra.
Det er kun, når der er en fejl
der har ikke været fanget i en prøve fangst.
Så lad os prøve og indsende et navn, der er tomt.
Så jeg kan se, at koden er nu stoppet
ved updateName metode og jeg kan musen over navne
og se, det er tomt til blank.
Der er det lig med blank.
Så hvis ikke navngive smide en ny fejl og nu kan jeg træde tilbage
gennem funktionen kolonne og sige, "OK,
hvor kom det fra, "og se, hvad værdien af ​​kunden er.
Så det har askForName metode,
setDisplayName starten og updateName.
Og dette er bare en rigtig nyttig måde kan du se have alle
variable, der er til rådighed i dette omfang samt
som variabler lukningen så noget, der er lukket
i løbet af denne funktion.
Og så kan jeg godt se - hvad værdien af ​​kunden er
og hvad værdien af ​​denne er.
Så dette fordi vi er i jQuery er lig
til den aktuelle DOM element.
Men det er virkelig nyttigt for debugging kode
at bryde den fejl som denne.
Et andet træk ved Chrome Inspector er
at du på et tidspunkt kan Klik på de forskellige linjer
i rækken, og det vil pause på de steder
hvor du har sat breakpoints de er benævnt.
Så hvis jeg klikker den linje bliver blå.
Så lad mig fortsætte henrettelse her, OK, der brød.
Og lad os nu sætte navn til Alice og ramte Send.
Så nu kan jeg se selv før det kom til det punkt,
for at opdatere alt, er det nu stoppet lige her så jeg kan se
at mit dette navn er Alice og så kan jeg fortsætte -
lad mig genindlæse siden.
Okay, så nu, at det er begyndende ved begyndelsen igen,
det har stoppet på denne linje, og jeg kan se
dette navn er i øjeblikket udefineret.
askForName er, hvilken funktion det er, så det er også ofte nyttigt
hvis du har funktioner, der er kommer fra forskellige filer
eller forskellige steder i kode, kan du se, hvor det er,
og derefter hoppe til det, det vil fremhæve det.
Så godt at komme i vane at bruge debuggingværktøjer
, der ikke blot konsol dot log.
OK, så lad os tage et se på et andet eksempel
som gør mere brug af prototyper som jeg havde hentydet til.
Så i dette eksempel,
vi skaber en ny funktion kaldet CS
og det er kapitaliseret så konventionen standard
i JavaScript er, hvis en funktion er meningen skal anvendes
som en konstruktør, i modsætning
at bare en normal funktion, skal du udnytte det.
Så jeg har kapital CS og dette tager en variabel courseId
og courseTitle som Jeg er indstillet til denne courseId,
denne courseTitle i constructoren.
Og så har jeg også sat studerende og foredrag som tomme arrays.
Så grunden til at du -
OK, så prototypen egenskaber blev derefter defineret
hernede med - så skabelon er blot en simpel understregning
skabelon, en understregning skabelon være en måde, som du kan -
svarende til skabelonerne at David havde nævnt
på serveren, kan du bare skrive et script-tag
som ikke er et JavaScript script men en tekst HTML
og hvad jeg gør med jQuery er -
det gør ikke holde disse åben, ja, der går vi.
Med jQuery, er det at få det HTML-værdi af denne skabelon
og derefter køre den gennem underscore nytteværdi biblioteker
skabelon motor.
Så dokumentationen for det er hernede
under nytte skabelon
men dybest set kan du læse lidt mere om det.
Men det vurderer denne streng og forvandler det til en funktion
som vi kan derefter sende data ind i, og det kalder dynamisk.
De næste to metoder, jeg har er addStudent og addLecture.
Disse bare tilføje dem til interne arrays, som jeg har sat
i konstruktøren og derefter gøre metoden.
Så lad os skabe den nye forekomst af CS kaldet 164
der har dette kursus nummer 164 og titel.
Og så CS50, som har CS50 og intro til CS1
og derefter tilføje et par foredrag studerende
og derefter kalde CS50 gengive.
Og hvis jeg køre kode, så Jeg gør det med Eval.
Du har aldrig virkelig ønsker at bruge Eval, men jeg er bare sortere
at træffe alle de JavaScript, der er herinde
og køre den på farten.
Det gør i dette skabelon disse nye forekomster
af CS klasse, som har egenskaber, så vi har gået
igennem og gjort addLecture og addStudent til hver.
Og som jeg nævnte fordi jeg returnere dette,
Jeg kan faktisk kæde disse addLecture og addStudent opkald
og det vil arbejde lige så godt.
Den anden funktion i JavaScript der er endnu mere nyttigt
på serveren side, hvor du virkelig på ethvert givet tidspunkt
Hvis din ansøgning bliver større ved ikke hvor du er
og det er sværere at sætte disse individuelle breakpoints
som jeg nævnte i Chrome Inspector er
at bruge debugger søgeord.
Så det er bare D-E-B-U-G-G-E-R.
Og når du sætter en debugger søgeord i din kode
og du har den - der går vi, to Gs.
Når du lægger den debugger søgeord i din kode
og du kører en debugger
såsom Chrome Inspector her
eller server side Chrome Inspector, det fortæller JavaScript
til at stoppe henrettelse på denne linje af kode og derefter det giver dig
for at gå gennem resten af gennemførelsen af ​​koder.
Så hvis jeg klikker køre kode her, det er nu stopper
på dette debugger linje og jeg kan se OK, her er værdien af ​​CS50
og det er en fik kursus titel, kursus-id,
det har fået nogen foredrag, ingen studerende.
Og så kan jeg gå gennem hele addLecture,
Jeg kan se det presser på disse foredrag,
musen over det, "Hello World".
Jeg kan faktisk i konsol gør dette, så dette er indstillet
til det aktuelle objekt at du er i.
Dette foredrag er "Hello World".
Og holde stepping igennem så meget som jeg vil.
Hvis jeg ikke ønsker at træde
ind i en funktion opkald fordi Jeg ved, hvad der kommer
at gøre at gå ind addLecture, der er denne knap lige her
som siger "Step over de næste funktion opkald ", og så jeg kan gå
til det punkt, var jeg måske gad vide om noget.
Ligesom for eksempel 164 gengive.
Så på dette punkt, er det kommer til at blive gjort.
Jeg kan se denne skabelon er kompileret skabelon.
Jeg kan se på dette punkt, jeg skal have to elever
og to foredrag.
Og så er der prototypen kæde, som jeg henviste til.
Så standard en, der kommer sammen med blot et objekt
i JavaScript i almindelighed,
det kommer med to snor værdien af ​​konstruktør.
Og så dem, der Jeg har tilføjet på mig selv
med addLecture, addStudent og derefter egenskaber
der er unikke for dette instans af klassen
som det blev påberåbt med den nye søgeord.
Så lad os gøre bare én endnu et eksempel på dette
og så vil vi gå til nogle mere interessante ting
på serveren side.
Så lad os gå videre og åbne det sidste eksempel, som er -
lad os se, hvor er koden?
Jeg ved ikke, hvor det gik.
OK, godt, vi kunne bare springe i løbet af denne kode derefter rent faktisk -
oh holde på, jeg tror jeg savnede typografiark for koden.
OK, så lad os gøre dette lidt større.
I dette eksempel, jeg viser lidt mere på indstillingen
op prototypen kæde,
så etablering arv med JavaScript.
Så i dette tilfælde har vi et katalog, som går
til formentlig fastholde flere kurser.
Og så et katalog har en addCourse metoder.
Så det kontrollerer, om kurset der er gået i er en instans
selvfølgelig som påberåbes med den nye søgeord.
Så hvis du prøver og sende
i noget andet, det vil råbe på dig.
Render metode, som vil gengive hver af de kurser
ved at indsamle sin skabelon nedenfor.
Og vi har kurset som adgang
i dette tilfælde basen klassen enkelte afdeling kurser.
Og i stedet for at sætte hver
af kurset prik prototype dot metode
eller ejendom ved hjælp af forlænge hjælper i understregning biblioteket
at sortere opkald udvide denne prototype med alle
af disse egenskaber, som er nyttigt, lidt lettere at læse.
Og derefter ned her gør hvad der er kendt som indstilling
op prototypen kæden.
Så det er faktisk lidt vanskelig at folk ved første
og endda stadig have gjort dette for en stund, det er lidt hårdt
at pakke dit hoved rundt.
Men lad det ikke skræmme dig.
Så jeg oprette en ny -
en helt ny klasse indsigelse her, KS.
Og i konstruktøren,
Jeg siger selvfølgelig anvende denne argumenter.
Så argumenterne er en særlig værdi, jeg gætte, du kunne kalde det
i JavaScript, den søgeord, som har alle
af alt, hvad der er gået sammen er argumenter
denne funktion findes med argumenterne ringer,
med argumenter søgeord.
Så som jeg ringer med kursus dot gælde,
det er den aktuelle kontekst som CS bliver kaldt.
Så når jeg påberåbe sig det med nye det er en - det er en værdi på CS.
Og jeg siger kalde dette kursus metode heroppe.
Åh undskyld - kalder dette kursus metode lige her
men sætte værdien af ​​denne at være, hvad værdien
dette er lige her.
Så gælder søgeordet tillader dig at slags ændre tilstanden
af dette, som er, hvordan jQuery får lov til at sortere af switch
ud af dette på dig som du går gennem
og gøre en DOM elementer stedet for jQuery objekt.
Så nu har jeg tænkt mig at sætte en midlertidig funktion
der vil gribe prototype af kurset.
Og slags sætte det til dets prototype
og derefter indstille prototypen på CS funktion objekt
til en ny forekomst af denne.
Så dybest set er jeg siger i stedet -
hvis jeg hernede gjorde CS prik prototype er lig med nyt kursus.
Så det ville være ringer alt
i denne constructor-funktion,
som jeg ikke ville nødvendigvis ville.
Så alt jeg gør er slags skabe næsten
som en surrogat-funktion, som vil have kurser prototype
om det, og sådan efterligne prototypen -
løbet, men uden at gøre alt i konstruktøren
og sætte det til prototypen.
Og så er jeg bare tilføjer så afdelingen
i dette tilfælde er Computer Videnskab for CS objektet.
Og så har jeg en slags bridge-version af at gøre det.
Det virker ikke i IE9.
Så det er derfor, jeg ønskede at vise slags hvordan -
hvad det gør under kølerhjelmen.
Men du kan indstille den på samme måde
hvor Econ lig funktion Kurset anvender disse argumenter
og derefter sige Econ dot prototype lig objekt dot CreateCourse
dot prototype.
Så det er opretter et nyt objekt som er lige prototypen
for kurset, og derefter indstille afdeling der.
Så lad os nu bare gå indstille en debugger her og klik på Kør.
Der vi går.
Så CS164 kan vi se prototype kæde vi har fået den
egenskaber, som var sat i konstruktøren.
Så værdier af disse, der blev sat og derefter på den prototype kæde
for CS objektet havde afdeling Datalogi indstillet.
Og derefter på den underliggende prototype kæde,
så har vi alle metoder og egenskaber
der er unikke for løbet objekt.
Og så har vi basen objekter.
Så den slags en hurtig eksempel af prototypen kæden.
Og som du kan se her, der er to værdier pr afdeling.
Så der er afdeling af datalogi
og derefter afdeling ikke er opført som jeg sagde
som standard værdi her.
Så prototypen kæde er faktisk bare en enkeltvis
link liste.
Og som den forsøger at finde en ejendom,
det vil starte på det øverste niveau værdi.
Så hvad er defineret i konstruktøren funktionen
og derefter sortere af gå ned prototype kæde derfra.
Så fordi det konstateret, så -
hvis lige her, siger jeg CS50 dot Department,
det vil sige datalogi.
Men hvis jeg siger var -
[Pause]
Men hvis jeg siger humaniora lig nyt kursus
og så siger jeg humaniora dot afdeling,
Jeg vil se afdeling ikke er opført fordi det gik først -
Jeg kan se på prototypen kæde her faktisk.
Så det gik først til kurset objekt og så er der ikke noget
på prototypen kæden på dette niveau for afdelingen
eller for Department værdier, så så er det springer til det næste niveau,
kurset og udseende videresende der og finder det.
Så det bare lidt ligesom går ned fra toppen og ned
og det er en slags noget, der er unikt
om JavaScript er at du kan ændre noget
disse værdier på ethvert givet tidspunkt.
Så i konstruktøren eller i en individuel metode på objektet
hvis jeg ønsker at sætte dette afdeling til noget nyt,
eller hvis jeg selv ønsker at sætte en af ​​disse funktioner
, der allerede eksisterer
til noget nyt, Jeg er fri til at gøre det.
Så lige nu har jeg CS50 prik addLecture, ligner det.
Og hvis jeg ønsker at indstille den til CS50 addLecture bare lig
til funktionen blank.
Så nu kan jeg se, det er bare fuldstændig ændret
som du ikke er i stand at gøre en anden sprog
hvor du har en strengere klasse baserede arv
og alt er slags oprettet.
JavaScript er meget, meget fleksibel med hensyn til det.
OK, lad os hoppe tilbage i dias.
Så hvis for eksempel du vil altid gerne have en funktion
at have en særlig denne værdi sat for den.
Du kan ringe funktion dot binder
og angive, hvad værdien af dette skal være.
Du kan tænke på det som -
"Jeg forsøger at tænke på en godt reelt eksempel verden, men "
hvis du ønsker at beskytte din kode
mod nogen potentielt kalde det med en værdi
det ville ikke være dette.
Ligesom for eksempel AJAX tilbagekald ligesom overskud eller fejl.
De er typisk ikke kaldes
med en god semantisk værdien af ​​dette.
Og du er ligesom, "OK, jeg altid ønsker, at dette at være værdien
af kurset objekt at jeg arbejder med.
Eller den opfattelse, som jeg er arbejder med i min kode
der repræsenterer det DOM-node, kan du indstille -
man kan binde forbindelse til denne og så når det hedder senere
af jQuery og det ikke har en god værdi af dette er det vil holde
til, hvad du afgrænses det med.
Så er der funktion opkald blev du kan angive sammenhæng
og angiv enhver variabel antal argumenter.
Og så er der funktion gælder som du kan passere
i forbindelse med og derefter enten et array
eller de argumenter indvendt, at Jeg nævnte som du ser der.
Og argumenterne i enhver funktion, du ringer,
du kan bare skrive i ordet "argumenter"
og det vil have alle argumenterne.
Det har en "længde" ejendom
som er, hvordan mai argumenter var rent faktisk kommer til at metoder
siden i JavaScript du kan sortere opkald
med varierende antal argumenter.
Det er nyttigt for at sige hvis dette havde et argument,
Følg derefter denne kode vej.
Hvis det havde to, kan du ønsker at følge en anden måde.
Det giver dig mulighed for at have virkelig dynamiske API'er til dine metoder.
Du kan tænke på at med jQuery
ligesom når du har dollar prik på eller binde.
Og det slags gør forskellige ting
på, om du sætte en argument eller to eller tre
eller starte det med en funktion.
Det er ved hjælp argumenterne ejendom
og argumenterne længde i mange tilfælde
at få denne magiske funktionalitet ske.
De ting, du ikke kan gøre med argumenter er at bruge det bare
som standard som en matrix.
Så du kan sige argumenter tre og sæt den til noget
som du kunne bruge array opgave.
Du kan bruge - en masse af understregningstegn metoder
for enten samlinger eller for at arbejde med arrays,
du kan passere i argumenter og det vil indse
at det er en argumentation objekt og sortere
af at tage sig af det for dig.
Men hvis du ønsker at bruge argumenter, der er gået
gennem en funktion som en matrix,
kan du bruge understregning dot to array.
En af antallet af nyttefunktioner
der er bygget i at understrege.