Jedným z najnáročnejších a často používaných konceptov v JavaScripte je „ toto kľúčové slovo. JavaScript používa „ toto “, inak ako v iných jazykoch. Je to však nevyhnutné na vytváranie pokročilejšieho kódu JavaScript. Ako začiatočník môže byť pre vás trochu ťažké pochopiť použitie spomínaného kľúčového slova, ale žiadny strach!
Tento príspevok vysvetlí „ toto ” kľúčové slovo a jeho použitie v JavaScripte.
Čo je to „toto“ v JavaScripte?
“ toto “ je kľúčové slovo v JavaScripte, ktoré odkazuje na objekt, ktorý vykonáva existujúci blok kódu. Predstavuje objekt, ktorý vyvoláva aktuálnu funkciu. Používa sa vo viacerých scenároch rôznymi spôsobmi, napríklad:
-
- V metóde
- Pri manipulácii s udalosťami
- Vo funkciách
Pozrime sa postupne na každé z uvedených použití!
Ako používať „toto“ v metódach JavaScriptu?
“ toto ” sa používa v metódach JavaScript ako implicitná väzba. Keď sa funkcia volá pomocou objektu a bodky, považuje sa za implicitnú väzbu a „ toto “ poukazuje na objekt počas volania funkcie.
Príklad
Najprv vytvoríme objekt s niektorými vlastnosťami a metódou a potom použijeme „ toto ” kľúčové slovo na získanie hodnôt vlastností objektu:
var personInfo = {
názov: 'John' ,
Vek : dvadsať ,
Info: funkciu ( ) {
konzola.log ( 'Hej! Ja som' + toto.meno + ' a ja som ' + tento.vek + ' rokov starý' ) ;
}
}
Ďalej zavolajte na „ Info() ” metóda spolu s názvom objektu:
Je vidieť, že zadané hodnoty vlastností aktuálneho objektu sú úspešne zobrazené:
Ak chcete použiť „ toto “ pri manipulácii s udalosťami postupujte podľa nižšie uvedenej časti.
Ako používať „toto“ pri spracovaní udalostí JavaScript?
V tomto príklade skontrolujte použitie „ toto ” kľúčové slovo pri spracovaní udalostí. Za týmto účelom zvážte príklad, v ktorom skryjeme naše tlačidlo jediným kliknutím. Ak to chcete urobiť, vytvorte tlačidlo a pripojte „ po kliknutí() ” udalosť s ním na prístup k vlastnosti style.display s “ toto ” kľúčové slovo, ktoré po kliknutí skryje tlačidlo:
< h3 > Kliknutím skryjete tlačidlo h3 >< tlačidlo po kliknutí = 'this.style.display='none'' > Kliknite tu ! tlačidlo >
Výkon
Ak ste zmätení ohľadom používania „ toto ” kľúčové slovo v užívateľsky definovaných funkciách v JavaScripte, postupujte podľa danej sekcie.
Ako používať „toto“ vo funkciách JavaScriptu?
Pri používaní „ toto ” vo funkciách existujú v JavaScripte tri typy väzieb vrátane:
-
- Predvolená väzba
- Implicitná väzba
- Explicitná väzba
Pochopme ich individuálne!
Príklad 1: Použitie tohto kľúčového slova v predvolenej väzbe
V predvolenej väzbe je „ toto Kľúčové slovo ” funguje ako globálny objekt. Väčšinou sa používa v samostatných funkciách.
Pochopme uvedený koncept na príklade.
Najprv vytvoríme premennú „ X “ a priraďte mu hodnotu „ pätnásť “:
var x = pätnásť ;
Potom definujte funkciu s názvom „ functionDB() “ a jeho definíciu funkcie, vytvorte premennú s rovnakým názvom “ X “ a priraďte mu hodnotu “ 5 “, potom vytlačte jeho hodnotu pomocou „ console.log() “ metóda s “ toto ” kľúčové slovo:
var x = 5 ;
konzola.log ( toto.x ) ;
}
Nakoniec zavolajte na „ functionDB() Funkcia ”:
Vzhľadom na použitie „ toto “, výstup zobrazí hodnotu “ X “ ako “ pätnásť “, pretože pôsobí ako globálny objekt a proces sa nazýva „ Dynamická väzba “:
Príklad 2: Použitie tohto kľúčového slova v implicitnej väzbe
Keď je funkcia volaná objektom alebo symbolom bodky, “ toto Kľúčové slovo ” funguje ako implicitná väzba. Upozorňuje na objekt počas volania funkcie.
V tomto príklade definujeme funkciu „ Info() “ a použite „ toto ” kľúčové slovo v definícii funkcie:
funkciu Info ( ) {konzola.log ( 'Hej! Ja som' + toto.meno + ' a ja som ' + tento.vek + ' rokov starý' )
}
Potom vytvorte objekt s názvom „ info o osobe “ s definovanými vlastnosťami:
názov: 'John' ,
Vek : dvadsať ,
info: info
}
Teraz zavolajte funkciu pozdĺž objektu:
Výkon
Príklad 3: Použitie tohto kľúčového slova v explicitnej väzbe
Explicitná väzba sa tiež nazýva „ tvrdá väzba “, pretože funkcia je násilne volaná, aby využila konkrétny objekt na „ toto väzba ” bez uvedenia odkazu na funkciu vlastnosti na objekt. Na tento účel možno použiť metódy call(), apply() a bind().
Teraz použijeme rovnakú funkciu s názvom „ Info() “ definované v predchádzajúcom príklade. Potom vytvorte objekt s názvom „ info o osobe “ s nasledujúcimi hodnotami:
var personInfo = {názov: 'John' ,
Vek : dvadsať
}
Na vyvolanie funkcie s názvom „ Info() “, budeme používať „ hovor() ” a odovzdať vytvorený objekt ako argument:
Keďže info() nie je súčasťou objektu, stále sme k nemu explicitne pristupovali:
Na explicitné volanie funkcie môžete použiť aj metódy apply() a bind(). Metóda apply() je identická s metódou call(), zatiaľ čo metóda bind() vytvára novú funkciu s rovnakým telom a rozsahom, ktorá sa správa rovnako ako pôvodná funkcia. Metódu bind() možno použiť na vrátenie funkcie, ktorú môžete použiť neskôr.
Na volanie info() pomocou metódy apply() použite nasledujúci príkaz:
info.prihlásiť sa ( info o osobe ) ;
Poskytuje rovnaký výstup ako metóda call():
Za volanie' Info() “ s „ bind() “, použite daný príkaz:
Výkon
Zozbierali sme všetky podstatné informácie týkajúce sa „ toto kľúčové slovo.
Záver
“ toto “ je kľúčové slovo v JavaScripte, ktoré odkazuje na objekt, ktorý vykonáva existujúci blok kódu. Predstavuje objekt, ktorý vyvoláva aktuálnu funkciu. Používa sa vo viacerých scenároch rôznymi spôsobmi, vrátane metód, spracovania udalostí a funkcií. V tomto príspevku sme vysvetlili „ toto ” kľúčové slovo v JavaScripte.