Detta "Nyckelord i JavaScript - Hur man använder" detta "Nyckelord? - Exempel

Innehållsförteckning:

Anonim

Vad är "detta" nyckelord i JavaScript?

Eftersom vi vet att objekt är de grundläggande byggstenarna i JavaScript finns det ett speciellt objekt som kallas 'detta' objekt och värdet på 'detta' kan ses i varje rad av JavaScript-exekvering som återigen beslutas baserat på hur koden är avrättas. I det här ämnet kommer vi att lära oss om "detta" sökord i JavaScript.

Betydelsen av "detta" sökord i JavaScript

  • Objektet "detta" i JavaScript har många viktiga roller och användningsområden. Det används främst för att peka på ett exempel på ett objekt från sin egen metod eller konstruktör. Tillsammans med att peka kan 'detta' också användas för att hålla reda på exekvering av kontext som är baserat på var funktionen heter.
  • Nästa sak med "denna" -funktionen i JavaScript är att länken till exekveringskontext kan ändras. Och slutligen kan länken till exekveringskontext också upprättas när den hänvisas till av en återuppringningsfunktion, även om funktionen definieras i konstruktörobjektet.

Varför använda "detta" sökord i JavaScript?

  • I JavaScript används "detta" nyckelord i många sammanhang för att utnyttja kontexterna på bästa sätt. I grund och botten används "detta" nyckelord för att hänvisa till något objekt eller funktion i JavaScript. Som med själva ordet (detta) kan vi förstå att det hänvisar till något. För att förstå "detta" bättre på ett praktiskt sätt kan vi överväga ett exempel som Mr. X spelade Cricket och han vann matchen.
  • Så här i stället för att använda Mr. X igen, använde vi 'han' som bara hänvisar till Mr. X. Det hjälper oss att inte fortsätta att nämna samma sak om och om igen. På samma sätt, även i JavaScript, kan vi använda "den här" funktionen eller objektet för att hänvisa till någon annan funktion eller objekt med det värde som anropas i den funktionen eller objektet. Vanligtvis används 'detta' i en funktion eller metod men det kan också användas utanför funktionen (under global omfattning).

Hur använder jag "detta" sökord?

  • Eftersom vi vet att JavaScript är ett skriptspråk så det inte finns något behov av en sammanställning av koderna, körs den under körning. Det kan köras direkt av tolkaren, rad för rad. Och miljön eller omfattningen i vilken JavaScript-koderna körs kallas "Exekveringskontext".
  • JavaScript runtime upprätthåller en bunt exekveringskontekster och den håller den aktuella stacken på toppen. Objektet som hänvisas till av "detta" ändras varje gång Exekveringskontext ändras.
  • Vi kan helt enkelt anta att när en funktion skapas samtidigt skapas också ett nyckelord "detta" (bakom scenen) som länkar till objektet där funktionen fungerar. Nyckelordet "detta" fungerar annorlunda i JavaScript från andra programmeringsspråk.

Den har olika värden beroende på var vi använder den, till exempel:

  • "detta" hänvisar till ägarobjektet i en metod.
  • "detta" hänvisar till det globala objektet i enbart situationen.
  • "detta" avser också de globala föremålen i en enkel funktion.
  • "detta" avser ett element i en händelse som tar emot händelsen.
  • "detta" är odefinierat i en strikt lägesfunktion.

1. Används med ett fält

Exempel : Nedan avser "detta" ett objekt som kallas personen. Och personen är ägaren till metoden fullName.

var employee = (
firstName: “Raju”,
lastName: “Chaudhury”,
id: 123
fullName: function() (
return this.firstName + “ ” + this.lastName;
)
)

Ett kort exempel på ett formulärfält:


check to alert this object name

Sätt namn och kontrollera radioalternativet nedan för att varna din post

Markera detta för att varna textfältet

Lägg märke till händelsehanteraren när du öppnar formuläret för att se vilken åtgärd som vidtas när du klickar på skicka

2. Används för att åberopa en konstruktör

Vanligtvis, när vi använder nyckelordet "nytt" för att skapa en instans för ett funktionsobjekt, använder vi funktionen som en konstruktör.

I exemplet nedan förklarar vi en Bike-funktion och åberopar den sedan som en konstruktör:

function Bike(name)(
this.name = name;
)
Bike.prototype.getName = function()(
return this.name;
)
var bike = new Bike('Pulsar');
console.log(bike.getName());

I exemplet ovan är den nya cykeln ('Pulsar') en konstruktör av Bike-funktionen. Här skapar JavaScript ett nytt objekt och sätter 'detta' nyckelord till det nyskapade objektet. Så nu kan vi åberopa Bike () som funktionen eller som konstruktören. Om vi ​​tar bort det "nya" nyckelordet kommer det att visa något fel enligt nedan:

var bajaj = Bike('Bajaj');
console.log(bajaj.name);

/ * Det kommer att visas som TypeError: Kan inte läsa egenskapens 'namn' för odefinierad * /

För att denna funktion i Bike () sätts till det globala objektet, blir bajaj.name undefined.

För att göra att Bike () -funktionen alltid åberopas med konstruktören, kontrollerar vi vid starten av Bike () -funktionen enligt nedan:

function Bike(name)(
if( ! (this instanceof Bike)(
throw Error(“We should use new operator to call a function”);
)
this.name = name;
)

Det finns en metaproperty känd som "new.target" som gör det möjligt att upptäcka om en funktion åberopas som en enkel kallelse eller konstruktör.

Här kan vi redigera Bike () -funktionen som använder new.target metaproperty enligt nedan

function Bike(name)(
if( ! new.target)(
throw Error(“We should use new operator to call a function”);
)
this.name = name;
)

3. Används för att returnera den aktuella klassinstansen

Ett klassuttryck är också ett sätt att definiera en klass i JavaScript. Det kan också namnges eller inte namnges. Den nämnda är den lokala för dess klasskropp och t kan hämtas av klassegenskaperna.

/ * exempel för ett icke namngivet klassuttryck * /

let Mobile = class (
constructor(cost, weight)(
this.cost = cost;
this.weight = weight;
)
);
console.log(Mobile.name); //Output: Mobile

/ * exempel för ett namngivet klassuttryck * /

let Mobile = class Mobile2(
constructor(cost, weight)(
this.cost = cost;
this.weight = weight;
)
);
console.log(Mobile.name);

Utgång: Mobile2

4. Används som metodparameter

När vi kallar en metod för ett objekt lägger JavaScript 'detta' till objektet som äger metoden.

Exempel:

var Bike = (
name: 'Pulsar',
getName: function()(
return this.name;
)
)
console.log(bike.getName()); /*Pulsar*/

Här hänvisar den här metoden getName () till ett cykelobjekt.

Slutsats

Nyckelordet "detta" i JavaScript är ett kraftfullt verktyg som vanligtvis hjälper utvecklarna att hänvisa till egenskaperna i specifika sammanhang, men ibland kan det vara ganska svårt också när man använder olika nivåer. Värdet på "detta" kan också ställas in uttryckligt med samtalet (), bind () och tillämpas () också. Vanligtvis bestäms värdet på "detta" av funktionens exekveringskontekst. Pilfunktioner binder vanligtvis inte "detta" och istället för "detta" är det lexiskt bundet.

Rekommenderade artiklar

Detta är en guide till "detta" sökord i JavaScript. Här diskuterar vi vikten och hur man använder "detta" nyckelord i JavaScript tillsammans med exemplet. Du kan också titta på följande artikel.

  1. Inkapsling i JavaScript
  2. Insättning Sortera i JavaScript
  3. Palindrome i JavaScript
  4. JavaScript-kompilatorer
  5. detta nyckelord i java | Exempel på detta sökord
  6. Exempelregler för i Java med exempel