Vad är en JavaScript-klass och hur använder jag den?

I objektorienterad programmering är en klass en utdragbar programkodmall för att skapa objekt. klasser kan främst ses på som ett syntaktiskt socker över JavaScript: s befintliga prototypbaserade arv. I den här artikeln kommer vi att gå in på djupet av JavaScript-klassen och lära oss hur man använder dem i följande ordning:

• Vad är en JavaScript-klass?
• Hur använder jag JavaScript-klass?
  • Definiera en klass
  • Definiera metoder
  • Utöka en klass

Vad är en JavaScript-klass?

I JavaScript är en klass en typ av funktion och deklareras med klassnyckelordet. Du måste använda syntax för funktionsuttryck för att initiera en funktion och klassuttryckssyntax för att initialisera en klass.

javascript längd för en matris

// Initiera en funktion med ett funktionsuttryck const a = function () {}

// Initiera en klass med ett klassuttryck const b = class {}

I JavaScript använder vi nyckelordsklassen istället för att använda nyckelordsfunktionen för att initiera den. Egenskaperna tilldelas också i en konstruktör () -metod.

Hur använder jag en JavaScript-klass?

Koden deklarerad med fungera och klass returnerar båda en funktion [[Prototyp]]. Med prototyper kan vilken funktion som helst bli en konstruktörsinstans med det nya nyckelordet. Till exempel:

const a = class {} // Initiera en constructor från en class const constructorFromClass = new a () console.log (constructorFromClass)

Produktion:

en {} konstruktör: klass

Nu finns det tre olika sätt att använda klass i JavaScript. Låt oss gå in i detaljerna för varje metod med ett exempel.

Definiera en klass

En konstruktörsfunktion initieras med ett antal parametrar, som tilldelas som egenskaper för 'detta' , med hänvisning till själva funktionen. Den första bokstaven i identifieraren är verserad enligt konvention.

// Initiera en anställd för konstruktionsfunktionen (namn, empid) {detta.namn = namn detta.empid = empid}

Nu, om vi översätter detta till klassens syntax, kommer du att se att strukturerna är mycket lika.

// Initiera en klassdefinition klassanställd {constructor (name, empid) {this.name = name this.empid = empid}}

Vi kan säga att klassnyckelordet kommunicerar på ett enklare sätt. Den enda skillnaden i syntaxen för initialiseringen är att använda klassnyckelordet istället för funktionen. Det tilldelar också egenskaperna i en konstruktör () -metod.

Definiera metoder

En annan vanlig praxis med konstruktörfunktioner är att tilldela metoder direkt till prototypen istället för i initialiseringen. Vi tar ett exempel och ser hur det fungerar:

funktionsanställd (namn, empid) {this.name = namn this.empid = empid} // Lägga till en metod till konstruktören medarbetare.prototype.greet = funktion () {return `$ {this.name} säger hej.`}

När du skriver samma kod med klass förenklas den och metoden läggs till direkt.

klassanställd {constructor (name, empid) {this.name = name this.empid = empid} // Lägga till en metod till konstruktörhälsningen () {return `$ {this.name} säger hej.`}}

Även om klasser möjliggör en mer enkel och kortfattad syntax, kan du ibland behöva kompromissa med tydligheten i processen.

Utöka en klass

Fördelen med konstruktörfunktioner och klasser är att de kan utökas till nya objektritningar baserat på föräldern. Detta hjälper till att förhindra upprepning av kod för objekt som liknar men behöver ytterligare eller mer specifika funktioner.

Nya konstruktörfunktioner kan skapas från föräldern med hjälp av metoden call (). Till exempel:

javascript-kontrollens längd

// Skapa en ny konstruktör från informationen om föräldrafunktionen (namn, empid, lön) {// Kedjekonstruktör med samtal medarbetare.call (detta, namn, empid) this.salary = lön}

Nu, när vi skriver samma kod med klass, används supernyckelordet i stället för samtal för att komma åt föräldrafunktionerna.

// Skapa en ny klass från föräldraklassinformationen utökar anställd {konstruktör (namn, empid, lön) {// Kedjekonstruktör med super super (namn, empid) // Lägg till en ny egendom this.salary = lön}}

Klasser ger dig ett mer koncist sätt att skapa objekt ritningar och konstruktionsfunktioner beskriver vad som händer under huven på ett mer specifikt sätt.

Med detta har vi kommit till slutet av vår artikel. Jag hoppas att du förstod hur du använder JavaScript-klass.

Nu när du känner till JavaScript-klass, kolla in av Edureka. Webbutvecklingscertifieringsträning hjälper dig att lära dig att skapa imponerande webbplatser med HTML5, CSS3, Twitter Bootstrap 3, jQuery och Google API: er och distribuera den till Amazon Simple Storage Service (S3).

Har du en fråga till oss? Vänligen nämna det i kommentarsektionen i “JavaScript-klass” så återkommer vi till dig.