V tomto výukovém programu se na příkladech dozvíte o tomto klíčovém slovu JavaScriptu.
V JavaScriptu thisklíčové slovo odkazuje na objekt, kde je voláno.
1. tento Inside Global Scope
Když thisse používá samostatně, thisodkazuje na globální objekt ( windowobjekt v prohlížečích). Například,
let a = this; console.log(a); // Window () this.name = 'Sarah'; console.log(window.name); // Sarah
Tady this.nameje to stejné jako window.name.
2. tato vnitřní funkce
Když thisje použito ve funkci, thisodkazuje na globální objekt ( windowobjekt v prohlížečích). Například,
function greet() ( // this inside function // this refers to the global object console.log(this); ) greet(); // Window ()
3. tato funkce Inside Constructor
V JavaScriptu se funkce konstruktoru používají k vytváření objektů. Když se funkce používá jako funkce konstruktoru, thisodkazuje na objekt, ve kterém se používá. Například,
function Person() ( this.name = 'Jack'; console.log(this); ) let person1 = new Person(); console.log(person1.name);
Výstup
Osoba (jméno: "Jack") Jack
Zde se thisodkazuje na objekt person1. Proto person1.namenám dává Jacku.
Poznámka : Při thispoužití s třídami ES6 odkazuje na objekt, ve kterém je použit (podobně jako funkce konstruktoru).
4. tato metoda Inside Object
Když thisse používá uvnitř metody objektu, thisodkazuje na objekt, ve kterém leží. Například,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); console.log(this.name); ) ) person.greet();
Výstup
(jméno: „Jack“, věk: 25 let, pozdrav: ƒ) Jack
Ve výše uvedeném příkladu thisodkazuje na personobjekt.
5. tato vnitřní vnitřní funkce
Když přistupujete thisuvnitř vnitřní funkce (uvnitř metody), thisodkazuje na globální objekt. Například,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); // (name: "Jack", age… ) console.log(this.age); // 25 // inner function function innerFunc() ( // this refers to the global object console.log(this); // Window (… ) console.log(this.age); // undefined ) innerFunc(); ) ) person.greet();
Výstup
(jméno: „Jack“, věk: 25 let, pozdrav: ƒ) 25 Okno (…) undefined
Zde thisinside innerFunc()odkazuje na globální objekt, protože innerFunc()je uvnitř metody.
Nicméně this.agemimo innerFunc()odkazuje na personobjekt.
6. tato funkce Inside Arrow
Uvnitř funkce šipky thisodkazuje na nadřazený obor. Například,
const greet = () => ( console.log(this); ) greet(); // Window (… )
Funkce šipek nemají své vlastní this. Když použijete thisuvnitř funkce šipky, thisodkazuje na její nadřazený objekt oboru. Například,
const greet = ( name: 'Jack', // method sayHi () ( let hi = () => console.log(this.name); hi(); ) ) greet.sayHi(); // Jack
Tady this.nameuvnitř hi()funkce odkazuje na greetobjekt.
Můžete také použít funkci se šipkou k vyřešení problému s undefinedpoužitím funkce uvnitř metody (jak je vidět v příkladu 5). Například,
const person = ( name : 'Jack', age: 25, // this inside method // this refers to the object itself greet() ( console.log(this); console.log(this.age); // inner function let innerFunc = () => ( // this refers to the global object console.log(this); console.log(this.age); ) innerFunc(); ) ) person.greet();
Výstup
(jméno: „Jack“, věk: 25 let, pozdrav: ƒ) 25 (jméno: „Jack“, věk: 25 let, pozdrav: ƒ) 25
Zde innerFunc()je definována pomocí funkce šipky. Trvá to thisz jeho nadřazeného rozsahu. Proto this.agedává 25 .
Při použití funkce se šipkou thisse odkazuje na vnější rozsah.
7. tato vnitřní funkce s přísným režimem
Když thisse používá ve funkci s přísným režimem, thisje undefined. Například,
'use strict'; this.name = 'Jack'; function greet() ( // this refers to undefined console.log(this); ) greet(); // undefined
Poznámka : Při použití thisuvnitř funkce s přísným režimem můžete použít JavaScript Function call ().
Například,
'use strict'; this.name = 'Jack'; function greet() ( console.log(this.name); ) greet.call(this); // Jack
Při předání thisse call()funkce, greet()je považována za metodu k thisobjektu (globální objekt v tomto případě).
