Konstruktør i JavaScript - dens typer og importerende metoder

Innholdsfortegnelse:

Anonim

Introduksjon til Constructor i JavaScript

Konstruktørmetoden i JavaScript er en spesiell metode som brukes til å lage og initialisere objekter i en klasse. Dette er hva en konstruktør på hvert programmeringsspråk gjør. Det som gjør JavaScript-konstruktør annerledes enn andre er friheten når det gjelder syntaks. For å forstå det bedre, bare åpne nettleserutviklerverktøyene (Ctrl / Cmd + Shift + C) og gå til kategorien Console i vinduet for utviklerverktøy.

Det ser slik ut i Chrome

Dette er lekeplassen for de fleste av JavaScript-relaterte konsepter. Vi vil bruke denne lekeplassen i hele denne artikkelen.

Typer konstruktører i JavaScript

Det er to typer konstruktører i JavaScript

1. Innebygde konstruktører

Dette er de lett tilgjengelige konstruktører som følger med utførelsesmiljøet. Brukeren trenger ganske enkelt å påkalle dem og bratsj, arbeidet er gjort. Eksempler på innebygde konstruktører er Array, Date og Object.

2. Brukerdefinerte konstruktører

Dette er konstruktørene som er erklært og definert av programmereren som skal brukes i hele applikasjonen. En programmerer kan også definere egenskaper og metoder for sine egne tilpassede typer. De er også kjent som tilpassede konstruktører. I samsvar med dette, er alle JavaScript-konstruktører setningsomhyllet. Dette for å fortelle personen som bruker dem at denne funksjonen må påberopes ved hjelp av det nye nøkkelordet.

Hvordan fungerer konstruktører i JavaScript?

Før vi ser på syntaksen til JavaScript-konstruktører, må vi forstå et veldig grunnleggende JavaScript-konsept -

  • Objektklassen oppsummerer i sammenheng med denne artikkelen, alle JavaScript-objekter er opprettet av Objektkonstruktøren. Hvis verdien som leveres mens du oppretter objektet, er null eller udefinert, oppretter objektkonstruktøren et tomt objekt. Ellers vil det opprette et objekt av typen definert mens du oppretter objektet.
  • Hver gang et nytt objekt av klassetypen blir erklært, returnerer det nye søkeordet en referanse til det nyopprettede objektet. Det objektet åpnes ved hjelp av dette nøkkelordet inne i konstruktøren for å initialisere egenskapene til objektet.
  • Skjønt, JavaScript har ikke noen klasser, men har konstruktører og prototyper for å gi lignende funksjonalitet. I ECMAScript 2015 ble konseptet klasser introdusert i JavaScript. Dette var ganske enkelt et syntaktisk tillegg til eksisterende prototypebasert arv og la ikke til noen ny funksjonalitet til språket.

Syntaks og eksempler på konstruktør i Javascript

1) Konstruktørmetode

Nedenfor er konstruktormetoden. Denne metoden brukes i prototypen til klassen.

syntax

constructor((arguments))( … )

Kode

class Employee(
constructor(id, name)(
this.id = id;
this.name = name;
))
var emp1 = new Employee(123, "John");
console.log(emp1.name);

Produksjon:

2) Objektkonstruktør (innebygde konstruktører)

Objektkonstruktøren kalles direkte når et objekt av klassen Objekt opprettes. Dette skaper et objekt av klasseobjekt hvis null eller udefinerte parametere sendes som argumenter. Ellers opprettes et objekt av typen gitte parametere.

syntax

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);

Produksjon:

3) Array og Date konstruktører

På lignende måte kan Array- og Date-konstruktørene også brukes til å lage objekter av respektive typer.

Kode:

var alphabets = new Array('Apple', 'Ball', 'Cat');
console.log(alphabets);

Produksjon:

Kode:

var now = new Date();
console.log(now);

Produksjon:

Kode:

var err = new Error("A user-defined error has occurred.");
console.log(err);

Produksjon:

4) Tilpassede konstruktører

Vi kan også erklære og definere egne konstruktører som skal brukes i hele applikasjonen. La oss se på hvordan dette kan oppnås.

syntax

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);

Produksjon:

Betydningen av det nye søkeordet

Nå lurer du kanskje på hva om jeg ikke bruker det nye søkeordet? Kan jeg utelate det nye søkeordet? Vel, min venn, nei. Å bruke det nye nøkkelordet er veldig viktig.

  • JavaScript-konstruktører er vanlige funksjoner. De er ledsaget av et nytt nøkkelord for å fortelle JavaScript-motoren at et nytt objekt må konstrueres med de gitte egenskapene. Uten det nye nøkkelordet, ville du ganske enkelt lage flere og flere globale objekter.
  • Det nye nøkkelordet returnerer en referanse til det nyopprettede objektet. Vi lagrer deretter denne referansen i en variabel. Uten det nye nøkkelordet opprettes objektet, men ingen henvisning til objektet returneres. Objektet antar et globalt omfang. Den eneste referansen til dette objektet er gjennom vinduobjektet.
  • Forvirret? La oss forstå bedre med eksempler. Tenk på eksemplet over på nytt. Vi fjernet det nye nøkkelordet fra objektdeklarasjonene. Resultatet var et unntak fra udefinerte variabler. Dette er fordi, uten det nye nøkkelordet, ble de nyopprettede objektenes referanse ikke returnert og dermed ikke lagret i variablene vår bok1, bok2 og bok3. Da vi prøvde å få tilgang til disse variablene i visningsbokmetoden, kastes unntaket.

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);

Produksjon:

I det samme eksemplet, hvis vi modifiserer visningsbokmetoden for å få tilgang til objektene gjennom vindusomfang, får vi en ikke-forventet utgang.

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);

Produksjon:

Gjør litt idémyldring som en øvelse for å finne ut hvorfor vi får dette resultatet!

Omfangsikre konstruktører

De innebygde konstruktørene i JavaScript er omfangssikre konstruktører. De oppretter ikke global omfangsvariabler når de kalles uten et nytt nøkkelord. Dermed kan disse objektene trygt opprettes med eller uten et nytt nøkkelord.

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å lage brukerdefinerte omfangssikre konstruktører. Fortsett, lag en omfangssikker konstruktør for bøkene våre i eksemplet ovenfor.

Konklusjon

Denne artikkelen ga en grundig demonstrasjon av JavaScript-konstruktørene. Dette hjelper deg også med å forstå JavaScript-bruken. Det viktigste å huske her er at selv om det teknisk ikke er noen klasser i JavaScript, gir metodene og prototypene lignende funksjonalitet til utviklerens disposisjon. Og ja, det nye nøkkelordet er viktig.

Anbefalte artikler

Dette har vært en guide til Constructor i JavaScript. Her diskuterer vi dens typer og viktige metoder med Hvordan lage en omfangssikker konstruktør. Du kan også gå gjennom artiklene våre for å lære mer-

  1. Hva Javascript kan gjøre?
  2. Hva er JavaScript?
  3. Slik installerer du JavaScript
  4. Destructor i Java
  5. Regex-funksjoner i Python (eksempel)
  6. Eksempler på dette nøkkelordet
  7. Working & Rules of instansOf i Java med eksempel