Hemsida » Kodning » Ultimate Guide to Getters and Setters i JavaScript

    Ultimate Guide to Getters and Setters i JavaScript

    Getter och sett är funktioner eller metoder som används skaffa sig och uppsättning Värdena för variablerna. Getter-setterkonceptet är vanligt vid datorprogrammering: nästan alla högnivå programmeringsspråk levereras med en uppsättning syntax för att implementera getters och setters, inklusive JavaScipt.

    I det här inlägget ser vi vad getters setters är och hur skapa och använda dem i JavaScript.

    Getters-setters och inkapsling

    Idén om getters och setters nämns alltid i samband med inkapsling. Encapsulation kan vara förstås på två sätt.

    För det första är det upprättandet av Data-getters-sett trio för att komma åt och ändra den data. Denna definition är användbar när vissa operationer, såsom validering, måste vara utförd på data innan du sparar eller tittar på det-getters och setters ger det perfekta hemmet för det.

    För det andra finns det en strängare definition enligt vilken inkapsling görs dölja data, för att göra det otillgängligt från annan kod, utom genom getters och setters. På så sätt hamnar vi inte av misstag överskriva viktiga data med någon annan kod i programmet.

    Skapa getters och setters

    1. Med metoder

    Eftersom getters och setters är i grunden funktioner som hämtar / ändrar ett värde finns det mer än ett sätt att skapa och använda dem. Det första sättet är:

     var obj = foo: 'detta är värdet av foo', getFoo: function () returnera this.foo; , setFoo: funktion (val) this.foo = val;  console.log (obj.getFoo ()); // "detta är värdet av foo" obj.setFoo ('hej'); console.log (obj.getFoo ()); // "Hej"

    Detta är det enklaste sättet att skapa getters och setters. Det finns en egendom foo och det finns två metoder: getFoo och setFoo till returnera och ange ett värde till den egendomen.

    2. med nyckelord

    En mer “officiell” och robust sätt att skapa getters och setters är att använda skaffa sig och uppsättning nyckelord.

    Till skapa en getter, placera skaffa sig nyckelord framför en funktionsdeklaration som ska fungera som getter-metoden och använda uppsättning nyckelord på samma sätt till skapa en setter. Syntaxen är som följer:

     var obj = fooVal: 'detta är värdet av foo', få foo () returnera this.fooVal; , set foo (val) this.fooVal = val;  console.log (obj.foo); // "detta är värdet av foo" obj.foo = 'hej'; console.log (obj.foo); // "Hej" 

    Observera att uppgifterna endast kan vara lagras under ett fastighetsnamn (fooVal) det är annorlunda från namnet på getter-setter-metoderna (foo) eftersom en fastighet som innehar getter-setter kan inte hålla data också.

    Vilket sätt är bättre?

    Om du väljer att skapa getters och setters med nyckelord, kan du använda uppdragsoperatör för att ställa in data och den dot operator för att få data, På samma sätt som du skulle få tillgång till / ställa in värdet på en vanlig fastighet.

    Men om du väljer det första sättet att koda getters och setters, måste du ringa setter och getter metoder använda synkroniseringsfunktionen eftersom de är typiska funktioner (inget speciellt som de som skapats med hjälp av skaffa sig och uppsättning nyckelord).

    Det finns också en chans att du kanske hamnar oavsiktligt tilldela något annat värde till de egenskaper som innehöll dessa getter-setter metoder och förlora dem helt! Något du inte behöver oroa dig för i den senare metoden.

    Så kan du se varför jag sa andra tekniken är robustare.

    Överskrivningsförebyggande

    Om du av någon anledning föredrar den första tekniken, gör egenskaperna med getter-setter-metoderna Skrivskyddad genom att skapa dem använder sig av Object.defineProperties. Egenskaper skapade via Object.defineProperties, Object.defineProperty och Reflect.defineProperty konfigurera automatiskt till skrivbar: false som betyder Skrivskyddad:

     / * Överskrivningsförhindrande * / var obj = foo: 'detta är värdet av foo'; Object.defineProperties (obj, 'getFoo': värde: funktion () return this.foo;, 'setFoo': värde: funktion (val) this.foo = val;); obj.getFoo = 66; // getFoo kommer inte att skrivas över! console.log (obj.getFoo ()); // "detta är värdet av foo" 

    Verksamheten inom getters och setters

    När du har introducerat getters och setters, kan du gå vidare och utföra operationer på data innan du ändrar eller returnerar den.

    I koden nedan är data i getter-funktionen sammanfogade med en sträng innan den returneras, och i setterfunktionen en validering av om värdet är ett tal eller inte utförs före uppdatering n.

     var obj = n: 67, få id () return 'ID:' + this.n; , ange id (val) om (typ av val === 'tal') this.n = val;  console.log (obj.id); // "ID är: 67" obj.id = 893; console.log (obj.id); // "ID: 893" obj.id = 'hej'; console.log (obj.id); // "ID: 893" 

    Skydda data med getters och setters

    Hittills täckte vi användningen av getters och setters i det första sammanhanget av inkapsling. Låt oss gå vidare till andra, dvs hur dölja data från extern kod med hjälp av getters och setters.

    Oskyddad data

    Upprättandet av getters och setters betyder inte att data endast kan nås och ändras via dessa metoder. I följande exempel är det ändras direkt utan att röra getter och setter metoder:

     var obj = fooVal: 'detta är värdet av foo', få foo () returnera this.fooVal; , set foo (val) this.fooVal = val;  obj.fooVal = 'hej'; console.log (obj.foo); // "Hej" 

    Vi använde inte setter men direkt ändrade data (fooVal). De data vi ursprungligen satt inuti obj är borta nu! För att förhindra att detta händer (oavsiktligt), du behöver lite skydd för dina data. Du kan lägga till det genom begränsa omfattningen av var dina uppgifter är tillgängliga. Du kan göra det av antingen blockering eller funktionsomfattning.

    1. Blockera scoping

    Ett sätt är att använd ett blockomfattning inom vilken data kommer att definieras med hjälp av låta sökord som begränsar dess räckvidd till det blocket.

    en blockera räckvidd kan skapas genom att placera din kod inuti ett par lockiga hängslen. När du skapar ett blockomfattning, se till att Lämna en kommentar ovanför det ber om att hängslen ska lämnas ensam, så att ingen tar bort hållarna misstänkt att de är några extra överflödiga hängslen i koden eller lägg till en etikett till blockområdet.

     / * BLOCK SCOPE, lämna hävarna ensamma! * / let fooVal = 'detta är värdet av foo'; var obj = get foo () return fooVal; , set foo (val) fooVal = val fooVal = 'hej'; // inte kommer att påverka fooVal inuti block console.log (obj.foo); // "detta är värdet av foo"

    Ändra / skapa fooValutanför blocket kommer inte att påverka de fooVal hänvisas inuti getters setters.

    2. Funktionsscoping

    Det vanligaste sättet att skydda data med scoping är av hålla data inuti en funktion och återvänder ett objekt med getters och setters från den funktionen.

     funktion myobj () var fooVal = 'detta är värdet av foo'; returnera get foo () return fooVal; , set foo (val) fooVal = val fooVal = 'hej'; // inte kommer att påverka vår ursprungliga fooVal var obj = myobj (); console.log (obj.foo); // "detta är värdet av foo"

    Föremålet (med foo () getter-setter inuti den) returnerad av myObj () funktionen är sparas i obj, och då obj är van att ringa getter och setter.

    3. Dataskydd utan överenskommelse

    Det finns också ett annat sätt att skydda dina data från att skrivas över utan att begränsa dess omfattning. Logiken bakom den går så här: Hur kan du ändra en bit data om du inte vet vad som kallas?

    Om data har a inte så lätt reproducerbar variabel / egenskapsnamn, chansen är ingen (även oss) kommer att sluta skriva över det genom att tilldela något värde till den variabeln / egenskapsnamnet.

     var obj = s89274934764: 'detta är värdet av foo', få foo () returnera detta.s89274934764; , set foo (val) this.s89274934764 = val;  console.log (obj.foo); // "detta är värdet av foo" 

    Se, det är ett sätt att arbeta ut saker. Även om namnet jag valde inte är en riktigt bra, kan du också använd slumpmässiga värden eller symboler att skapa fastighetsnamn som det föreslås av Derick Bailey i denna blogginlägg. Huvudmålet är att Håll datan gömd från annan kod och låt ett getter-setter-par komma åt / uppdatera det.

    När ska du använda getters och setters?

    Nu kommer den stora frågan: börjar du tilldela getters och setters till alla dina data nu?

    Om du är gömma data, då finns det inget annat val.

    Men om dina data ses av annan kod är bra, behöver du fortfarande använda gettersättare bara för att paketera upp det med kod som utför vissa operationer på den? jag skulle säga ja. Koda lägger upp mycket snart. Skapa mikroenheter av enskild data med sin egen getter-setter ger dig ett visst oberoende att arbeta med nämnda data utan att påverka andra delar av koden.