Introduktion til Constructor i JavaScript
Konstruktormetoden i JavaScript er en speciel metode, der bruges til at oprette og initialisere objekter i en klasse. Dette er, hvad en konstruktør i hvert programmeringssprog gør. Hvad der gør JavaScript-konstruktør forskellig fra andre er friheden med hensyn til syntaks. For at forstå det bedre skal du blot åbne browserudviklerværktøjerne (Ctrl / Cmd + Shift + C) og gå til fanen Console i vinduet med udviklerværktøjer.
Det ser sådan ud i Chrome
Dette er legepladsen for de fleste af JavaScript-relaterede koncepter. Vi bruger denne legeplads i hele denne artikel.
Typer af konstruktører i JavaScript
Der er to typer konstruktører i JavaScript
1. Indbyggede konstruktører
Dette er de let tilgængelige konstruktører, der leveres sammen med udførelsesmiljøet. Brugeren har simpelthen brug for at påkalde dem og viola, værket er udført. Eksempler på indbyggede konstruktører er Array, Date og Object.
2. Brugerdefinerede konstruktører
Dette er de konstruktører, der er erklæret og defineret af programmereren, der skal bruges i hele applikationen. En programmerer kan også definere egenskaber og metoder til deres egne brugerdefinerede typer. De er også kendt som brugerdefinerede konstruktører. I henhold til konventionen er alle JavaScript-konstruktører sætning indkapslet. Dette for at fortælle den person, der bruger dem, at denne funktion skal aktiveres ved hjælp af det nye nøgleord.
Hvordan fungerer konstruktører i JavaScript?
Inden vi ser på syntaksen til JavaScript-konstruktører, skal vi forstå et meget grundlæggende JavaScript-koncept -
- Objektklassen opsummerer i sammenhæng med denne artikel alle JavaScript-objekter oprettet af Objektkonstruktøren. Hvis den leverede værdi under oprettelse af objektet er null eller udefineret, opretter Objektkonstruktøren et tomt objekt. Ellers vil det oprette et objekt af den definerede type, mens objektet oprettes.
- Hver gang et nyt objekt af klassetypen erklæres, returnerer det nye nøgleord en henvisning til det nyoprettede objekt. Dette objekt får adgang til ved hjælp af dette nøgleord inde i konstruktøren til at initialisere objektets egenskaber.
- Selvom teknisk set JavaScript ikke har nogen klasser, men har konstruktører og prototyper for at bringe lignende funktionalitet. I ECMAScript 2015 blev konceptet med klasser introduceret i JavaScript. Dette var simpelthen en syntaktisk tilføjelse til eksisterende prototypebaseret arv og tilføjede ikke nogen ny funktionalitet til sproget.
Syntaks og eksempler på konstruktør i Javascript
1) Konstruktormetode
Nedenfor er konstruktionsmetoden. Denne metode bruges i prototypen af klassen.
Syntaks
constructor((arguments))( … )
Kode
class Employee(
constructor(id, name)(
this.id = id;
this.name = name;
))
var emp1 = new Employee(123, "John");
console.log(emp1.name);
Produktion:
2) Objektkonstruktør (indbyggede konstruktører)
Objektkonstruktøren kaldes direkte, når der oprettes et objekt i klassen Objekt. Dette skaber et objekt af klasseobjekt, hvis null eller udefinerede parametre sendes som argumenter. Ellers oprettes et objekt med typen af givne parametre.
Syntaks
new Object(( value ))
Eller
new Array(( value ))
Eller
new Date(( value ))
Eller
new String(( value ))
Eller
new Number(( value ))
Eller
new Boolean(( value ))
Eller
new Function(( value ))
Eller
new Error(( value ))
Eller
new RegExp(( value ))
og så videre…
Kode:
var name = new Object("John");
var age = new Object(28);
console.log("Name : "+name+" & Age : "+age);
Produktion:
3) Array- og Date-konstruktører
På lignende måde kan Array- og Date-konstruktører også bruges til at oprette objekter af respektive typer.
Kode:
var alphabets = new Array('Apple', 'Ball', 'Cat');
console.log(alphabets);
Produktion:
Kode:
var now = new Date();
console.log(now);
Produktion:
Kode:
var err = new Error("A user-defined error has occurred.");
console.log(err);
Produktion:
4) Brugerdefinerede konstruktører
Vi kan også erklære og definere vores egne konstruktører, der skal bruges i hele vores applikation. Lad os se på, hvordan dette kan opnås.
Syntaks
function FunctionName((arguments))( … )
Kode
function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + book.name + '\' authored by ' + book.author + ' in the year ' + book.year + '.');
)
var book1 = new Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = new Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = new Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);
Produktion:
Betydningen af det nye søgeord
Nu undrer du dig måske, hvad hvis jeg ikke bruger det nye søgeord? Kan jeg udelade det nye nøgleord? Nå, min ven, nej. Det er meget vigtigt at bruge det nye nøgleord.
- JavaScript-konstruktører er regelmæssige funktioner. De ledsages af et nyt nøgleord, der fortæller JavaScript-motoren, at et nyt objekt skal konstrueres med de givne egenskaber. Uden det nye nøgleord, ville du blot oprette flere og flere globale objekter.
- Det nye nøgleord giver en henvisning til det nyoprettede objekt. Vi gemmer derefter denne reference i en variabel. Uden det nye nøgleord oprettes objektet, men ingen henvisning til objektet returneres. Objektet antager et globalt omfang. Den eneste henvisning til dette objekt er gennem vindueobjektet.
- Forvirret? Lad os forstå bedre med eksempler. Overvej ovenstående eksempel igen. Vi fjernede det nye nøgleord fra objekterklæringerne. Resultatet var en undtagelse fra udefinerede variabler. Dette skyldes, at uden det nye nøgleord, blev de nyoprettede objekter 'reference ikke returneret og dermed ikke lagret i vores variabler book1, book2 og book3. Da vi forsøgte at få adgang til disse variabler i displaybogsmetoden, kastes undtagelsen.
Kode:
function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + book.name + '\' authored by ' + book.author + ' in the year ' + book.year + '.');
)
var book1 = Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);
Produktion:
I det samme eksempel, hvis vi ændrer visningsbogsmetoden for at få adgang til objekter gennem vinduesomfang, får vi en ikke-forventet output.
Kode:
function Book(name, author, year) (
this.name = name;
this.author = author;
this.year = year;
)
function displayBook(book)(
console.log('\'' + window.name + '\' authored by ' + window.author +' in the year ' + window.year + '.');
)
var book1 = Book('Java - The Complete Reference', 'Herbert Schildt', 2006);
var book2 = Book('Let Us C', 'Yashavant Kanetkar', 2002);
var book3 = Book('Data Structures', 'Seymour Lipschutz', 2005);
displayBook(book1);
displayBook(book2);
displayBook(book3);
Produktion:
Som en øvelse skal du lave en lille idédugning for at finde ud af, hvorfor vi får dette output!
Scope-Safe konstruktører
De indbyggede konstruktører i JavaScript er konstruktionssikre konstruktører. De opretter ikke globale scoped-variabler, når de kaldes uden et nyt nøgleord. Disse objekter kan således oprettes sikkert med eller uden et nyt nøgleord.
Kode
function SampleFn(argument) (
// if "this" is not an instance of the constructor
// it means it was called without new
if (!(this instanceof SampleFn)) (
// call the constructor again with new
return new SampleFn(argument);
)
// The code to construct properties and methods
)
Ja, du kan også oprette brugerdefinerede omfangs sikre konstruktører. Gå videre, opret en omfangssikker konstruktør til vores bøger i ovenstående eksempel.
Konklusion
Denne artikel gav en dybtgående demonstration af JavaScript-konstruktører. Dette hjælper også med at forstå JavaScript-funktionen. Den vigtigste ting at huske her er, at selvom der teknisk set ikke er nogen klasser i JavaScript, giver metoderne og prototyperne lignende funktionalitet til rådighed for udvikleren. Og ja, det nye nøgleord er vigtigt.
Anbefalede artikler
Dette har været en guide til Constructor i JavaScript. Her diskuterer vi dets typer og vigtige metoder med Sådan opretter du en omfangssikker konstruktør. Du kan også gennemgå vores givne artikler for at lære mere-
- Hvad Javascript kan gøre?
- Hvad er JavaScript?
- Sådan installeres JavaScript
- Destructor i Java
- Regex-funktioner i Python (eksempel)
- Eksempler på dette nøgleord
- Arbejds- og forretningsregler for i Java med eksempel