A JavaScript egyik legnagyobb kihívást jelentő és leggyakrabban használt fogalma a „ ez ” kulcsszó. A JavaScript a ' ez ” kulcsszót másképp, mint más nyelveken. Ez azonban elengedhetetlen a fejlettebb JavaScript kód létrehozásához. Kezdőként valahogy nehéz lehet megérteni az említett kulcsszó használatát, de ne aggódj!
Ez a bejegyzés elmagyarázza a „ ez ” kulcsszó és annak használata JavaScriptben.
Mi az 'ez' a JavaScriptben?
' ez ” a JavaScript kulcsszava, amely egy olyan objektumra utal, amely végrehajtja a meglévő kódblokkot. Olyan objektumot jelöl, amely az aktuális függvényt hívja meg. Többféle forgatókönyvben használják, különböző módokon, például:
-
- A módszerben
- Rendezvénykezelésben
- A függvényekben
Nézzük meg egyenként az említett felhasználási módokat!
Hogyan kell használni az „ezt” a JavaScript-módszerekben?
' ez ” a JavaScript metódusokban implicit kötésként használatos. Ha a függvényt egy objektum és egy pont segítségével hívjuk meg, az implicit kötésnek minősül, és „ ez ” mutat rá az objektumra a függvényhívás során.
Példa
Először létrehozunk egy objektumot néhány tulajdonsággal és metódussal, majd használjuk a ' ez ” kulcsszó az objektum tulajdonságainak értékeinek lekéréséhez:
var personInfo = {
név: 'János' ,
életkor: húsz ,
info: funkció ( ) {
console.log ( 'Hé! én vagyok' + ez.név + ' és én vagyok ' + ez.kor + ' éves' ) ;
}
}
Ezután hívja a „ info() ” metódus az objektumnévvel együtt:
Látható, hogy az aktuális objektum megadott tulajdonságértékei sikeresen megjelennek:
Ha használni szeretné a „ ez ” eseménykezelésben kövesse az alábbi részt.
Hogyan kell használni az „ezt” a JavaScript-eseménykezelésben?
Ebben a példában ellenőrizze a „ ez ” kulcsszó az eseménykezelésben. Ehhez vegyünk egy példát, amelyben egyetlen kattintással elrejtjük a gombunkat. Ehhez hozzon létre egy gombot, és csatoljon egy „ kattintásra() ” eseményt a „style.display” tulajdonság eléréséhez ez ” kulcsszó, amely elrejti a gombot kattintáskor:
< h3 > Kattintson a gomb elrejtéséhez h3 >< gomb kattintásra = 'this.style.display='none'' > Kattints ide ! gomb >
Kimenet
Ha zavarban van a „ ez ” kulcsszó a felhasználó által definiált függvényekben a JavaScriptben, kövesse az adott részt.
Hogyan kell használni az „ezt” a JavaScript függvényekben?
A „ ez ” függvényekben háromféle kötés létezik a JavaScriptben, beleértve:
-
- Alapértelmezett kötés
- Implicit kötés
- Explicit kötés
Értsük meg őket egyenként!
1. példa: Ennek a kulcsszónak a használata az alapértelmezett kötésben
Az alapértelmezett kötésben a „ ez ” kulcsszó globális objektumként működik. Leginkább önálló funkciókban használják.
Értsük meg a megfogalmazott fogalmat egy példával.
Először létrehozunk egy változót ' x ', és rendelje hozzá a '' értéket tizenöt ”:
var x = tizenöt ;
Ezután definiáljon egy '' nevű függvényt functionDB() ' és annak függvénydefiníciója, hozzon létre egy azonos nevű változót ' x 'és adjon hozzá egy értéket' 5 ”, majd nyomtassa ki az értékét a „ console.log() ' módszer a ' ez ” kulcsszó:
var x = 5 ;
console.log ( ezt.x ) ;
}
Végül hívja a „ functionDB() ” funkció:
A „ ez ' kulcsszó, a kimenet a '' értékét jeleníti meg x ' mint ' tizenöt ', mert globális objektumként működik, és a folyamatot ' Dinamikus kötés ”:
2. példa: Ennek a kulcsszónak a használata az Implicit Bindingben
Ha a függvényt objektum vagy pontszimbólum hívja meg, ' ez ” kulcsszó implicit kötésként működik. A függvényhívás során rámutat az objektumra.
Ebben a példában egy függvényt fogunk definiálni info() ', és használja a ' ez ” kulcsszó a függvénydefinícióban:
funkció info ( ) {console.log ( 'Hé! én vagyok' + ez.név + ' és én vagyok ' + ez.kor + ' éves' )
}
Ezután hozzon létre egy objektumot ' personInfo ” meghatározott tulajdonságokkal:
név: 'János' ,
életkor: húsz ,
info: info
}
Most hívja meg a függvényt az objektum mentén:
Kimenet
3. példa: Ennek a kulcsszónak a használata az Explicit Bindingben
Az explicit kötés más néven ' kemény kötés ', mert a függvény kényszeresen meghívott egy adott objektumot a ' ez ” kötés, anélkül, hogy tulajdonságfüggvény hivatkozást helyezne az objektumra. Erre a célra a call(), apply() és bind() metódusok használhatók.
Most ugyanazt a funkciót fogjuk használni, a ' info() ” az előző példában meghatározott. Ezután hozzon létre egy objektumot ' personInfo ” a következő értékekkel:
var personInfo = {név: 'János' ,
életkor: húsz
}
A ' nevű függvény meghívásához info() ”, a „ hívás() ” metódussal, és adja át a létrehozott objektumot argumentumként:
Mivel az info() nem része az objektumnak, továbbra is kifejezetten hozzáfértünk hozzá:
Egy függvény explicit meghívásához használhatja az apply() és a bind() metódusokat is. Az apply() metódus megegyezik a call() metódussal, míg a bind() metódus egy új függvényt hoz létre azonos törzstel és hatókörrel, amely ugyanúgy viselkedik, mint az eredeti függvény. A bind() metódus felhasználható egy olyan függvény visszaadására, amelyet később használhat.
Az info()-nak az apply() metódussal történő meghívásához használja a következő utasítást:
info.apply ( personInfo ) ;
Ugyanazt a kimenetet adja, mint a call() metódus:
'Hívásért' info() ' a ... val ' bind() ” módszerrel használja a megadott utasítást:
Kimenet
Összegyűjtöttünk minden lényeges információt a „ ez ” kulcsszó.
Következtetés
' ez ” a JavaScript kulcsszava, amely egy olyan objektumra utal, amely végrehajtja a meglévő kódblokkot. Az aktuális függvényt meghívó objektumot képviseli. Számos forgatókönyvben, különböző módokon használják, beleértve a módszereket, az eseménykezelést és a funkciókat. Ebben a bejegyzésben elmagyaráztuk a „ ez ” kulcsszó a JavaScriptben.