JavaScript erbjuder många möjligheter för att skapa och manipulera objekt. Den traditionella användningen av klasser och prototyper är utbredd, men det finns också alternativa tillvägagångssätt som ofta är mer flexibla och enklare. Denna handledning visar dig hur du kan skapa effektiva objekt i JavaScript utan att använda klasser skapa. Vi kommer att använda Douglas Crockfords metod, som baseras på funktionsbaserad objektorientering och erbjuder ett intressant perspektiv på Es6 och de efterföljande versionerna.

Viktigaste insikter

  • Objekt kan skapas utan att använda klasser och this
  • Funktionsbaserad objektorientering möjliggör flexibilitet och mer läsbar kodstruktur
  • Genom destrukturering av objekt blir hanteringen mer effektiv och enklare

Steg-för-steg-guide för att skapa objekt utan klasser

Börja med att skapa en funktion som returnerar ett objekt. Detta kan du göra genom att använda en grundläggande funktionssyntax.

Skapa objekt utan klasser i JavaScript

I detta exempel definierar vi en funktion createShape. I denna funktion skapar vi ett nytt objekt som har olika egenskaper, som id, x och y. Du kan också lägga till fler metoder för att utöka objektets funktionalitet.

Se till att du överlämnar de parametrar som definierar objektet till funktionen. På så sätt kan du skapa en instans av objektet med specifika attribut.

För att göra objektet användbart kan du också definiera metoder som är integrerade i objektet. Till exempel kan du lägga till en print-metod som skriver ut objektets egenskaper.

Skapa objekt utan klasser i JavaScript

Här utökar du createShape-funktionen med print-metoden. Se till att implementera metoden korrekt så att den kan referera till objektets egenskaper.

Ett annat element är implementeringen av en move-metod. Denna metod kan användas för att förändra x och y-koordinaterna för objektet. Glöm inte att ge parametrarna unika namn för att undvika missförstånd.

Du kan också använda funktioner för destrukturering av objekt. Istället för att överlämna parametrar en och en, överlämna bara ett objekt och använd destrukturering för att extrahera egenskaperna.

Denna teknik gör din kod inte bara mer läsbar, utan också mer flexibel. Du kan enkelt lägga till nya parametrar och delvis ta bort befintliga utan att behöva omskriva hela funktionaliteten.

När du överväger att integrera fler funktioner kan du definiera en andra funktion createBaseShape som implementerar vissa grundläggande beteenden och kallas från det första objektet.

Screenshot_目330

Med den vidare tillvägagångssättet kan du antingen få tillgång till printBase eller andra funktioner och använda dem utan att behöva använda this eller liknande.

Som en sista förbättring kan du frysa objektet för att säkerställa att dess egenskaper inte kan förändras efter skapandet. Detta görs genom att använda metoden Object.freeze().

Dessa tekniker visar att det finns många sätt att skapa och hantera objekt i JavaScript utan att behöva återgå till klassmodellen.

Sammanfattning – Objekt utan klasser i JavaScript

I denna handledning har du lärt dig hur du effektivt kan skapa objekt i JavaScript utan klasser. Metoden för funktionsbaserad objektorientering erbjuder mycket flexibilitet och kontroll. Genom olika metoder som destrukturering och Object.freeze har du möjlighet att utveckla robusta och underhållbara strukturer som gynnar din kod.

Vanliga frågor

Hur skapar jag ett objekt i JavaScript utan klasser?Du kan definiera en funktion som skapar och returnerar ett nytt objekt.

Vad är fördelarna med funktionsbaserad objektorientering?Det möjliggör en mer flexibel hantering av objekt, enkla utvidgningar genom destrukturering och förhindrar oönskade förändringar genom Object.freeze.

Kan jag definiera metoder i objektorienterade funktioner?Ja, du kan skapa metoder direkt i returfunktionen för objektet.

Erstätter denna metod det traditionella klassmodellen helt?Det är en alternativ metod som kan vara mer användbar i många specifika fall, men gör inte anspråk på att helt ersätta klasser.