We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

Questa traduzione è incompleta. Collabora alla traduzione di questo articolo dall’originale in lingua inglese.

La sintassi get  associa una proprietà dell'oggetto a una funzione che verrà chiamata quando la proprietà verrà richiesta.

Sintassi

{get prop() { ... } }
{get [expression]() { ... } }

Parametri

prop
Il nome della proprietà da associare alla funzione specificata.
espressione
A partire da ECMAScript 2015, è anche possibile utilizzare espressioni per un nome di proprietà calcolato per associarsi alla funzione specificata.

Descrizione

A volte è preferibile consentire l'accesso a una proprietà che restituisce un valore calcolato in modo dinamico, oppure è possibile che si desideri riflettere lo stato di una variabile interna senza richiedere l'uso di chiamate esplicite al metodo. In JavaScript, questo può essere realizzato con l'uso di un getter. Non è possibile avere simultaneamente un getter legato a una proprietà e avere quella proprietà contenuta in un valore, anche se è possibile usare un getter e un setter insieme per creare un tipo di pseudo-proprietà.

Tieni presente quanto segue quando lavori con la sintassi get:

Un getter può essere rimosso usando l'operatore  delete

Esempi

Definizione di un getter sui nuovi oggetti negli inizializzatori di oggetti

Questo creerà una pseudo-proprietà latest più recente per object obj, che restituirà l'ultimo elemento dell'array in log.

var obj = {
  log: ['example','test'],
  get latest() {
    if (this.log.length == 0) return undefined;
    return this.log[this.log.length - 1];
  }
}
console.log(obj.latest); // "test".

Si noti che il tentativo di assegnare un valore a latest non lo cambierà.

Cancellare un getter usando l'operatore delete

Se vuoi rimuovere il getter, puoi semplicemente usare delete :

delete obj.latest;

Definire un getter su un oggetto esistente usando defineProperty

Per aggiungere un getter a un oggetto esistente in un secondo momento, usa Object.defineProperty().

var o = {a: 0};

Object.defineProperty(o, 'b', { get: function() { return this.a + 1; } });

console.log(o.b) // Runs the getter, which yields a + 1 (which is 1)

Utilizzando un nome di proprietà calcolato

var expr = 'foo';

var obj = {
  get [expr]() { return 'bar'; }
};

console.log(obj.foo); // "bar"

Smart / self-overwriting / lazy getters

I getter ti danno un modo per definire una proprietà di un oggetto, ma non calcolano il valore della proprietà finché non avviene l'accesso. Un getter rinvia il costo del calcolo del valore fino a quando il valore è necessario e, se non è mai necessario, non si paga mai il costo.

Un'ulteriore tecnica di ottimizzazione per lazificare o ritardare il calcolo di un valore di una proprietà e memorizzarla nella cache per un accesso successivo sono smart o memoized getters. Il valore viene calcolato la prima volta che viene chiamato il getter e viene quindi memorizzato nella cache in modo che gli accessi successivi restituiscano il valore memorizzato nella cache senza ricalcolarlo. Questo è utile nelle seguenti situazioni:

  • Se il calcolo di un valore di una proprietà è costoso (richiede molta RAM o tempo di CPU, genera thread di lavoro, recupera file remoto, ecc.).
  • Se il valore non è necessario solo ora. Sarà usato più tardi, o in alcuni casi non è usato affatto.
  • Se viene utilizzato, sarà accessibile più volte e non è necessario ricalcolare il valore che non verrà mai modificato o non dovrebbe essere ricalcolato.

Ciò significa che non si dovrebbe usare un getter pigro per una proprietà il cui valore si prevede possa cambiare, poiché il getter non ricalcola il valore.

Nell'esempio seguente, l'oggetto ha un getter come proprietà propria. Quando si ottiene la proprietà, la proprietà viene rimossa dall'oggetto e riaggiunta, ma questa volta implicitamente come proprietà dei dati. Alla fine il valore viene restituito.

get notifier() {
  delete this.notifier;
  return this.notifier = document.getElementById('bookmarked-notification-anchor');
},

Per il codice di Firefox, vedere anche il modulo del codice XPCOMUtils.jsm, che definisce la funzione defineLazyGetter().

Specificazioni

Specification Status Comment
ECMAScript 5.1 (ECMA-262)
The definition of 'Object Initializer' in that specification.
Standard Definizione iniziale.
ECMAScript 2015 (6th Edition, ECMA-262)
The definition of 'Method definitions' in that specification.
Standard Aggiunti nomi di proprietà calcolate.
ECMAScript Latest Draft (ECMA-262)
The definition of 'Method definitions' in that specification.
Draft  

Compatibilità con il browser

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support1 Yes299.53
Computed property names46 Yes34 No47 No
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support11 Yes4 Yes Yes Yes
Computed property names4646 Yes34 Yes No5.0

Guarda anche

Tag del documento e collaboratori

Hanno collaborato alla realizzazione di questa pagina: matteogatti
Ultima modifica di: matteogatti,