Qual è la parola chiave "get" prima di una funzione in una classe?


106

Cosa getsignifica in questa classe ES6? Come faccio a fare riferimento a questa funzione? Come dovrei usarlo?

class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  get area() {
    return this.calcArea()
  }

  calcArea() {
    return this.height * this.width;
  }
}

5
Molto probabilmente è solo un getter ma all'interno di una classe invece di un oggetto. Non è realmente specifico per ES6.
user4642212

@Xufox come intendi che non è specifico per ES6?
Keith Nicholas

1
@ KeithNicholas: che ha funzionato allo stesso modo in ES5.
Bergi

@KeithNicholas Getters esistono da ES5, credo. L'unica cosa che è ES6 qui è la classsintassi, ma i getter non sono una novità.
user4642212

Risposte:


109

Significa che la funzione è un getter per una proprietà.

Per usarlo, usa il suo nome come faresti con qualsiasi altra proprietà:

'use strict'
class Polygon {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }

  get area() {
    return this.calcArea()
  }

  calcArea() {
    return this.height * this.width;
  }
}

var p = new Polygon(10, 20);

alert(p.area);


2
Le classi sono implicitamente in modalità rigorosa btw. ecma-international.org/ecma-262/6.0/#sec-strict-mode-code
Kit Sunde

1
@KitSunde - almeno sul mio browser (Chrome, Win7), senza quella dichiarazione ottengo errori della console invece di un campione funzionante. E questo non fa parte di "The Answer", proprio come non lo è il pulsante "Run code snippet".
Amit

4
Non puoi semplicemente chiamare p. calcArea? se no, perché no?
ksav

9
Le parole chiave get / set sono solo zucchero sintattico, poiché una chiamata a Polygon.calcArea () fungerà anche da getter?
Craig O. Curtis

quindi la funzione get getkeyword non può avere parametri?
jay1234

47

Sommario:

La getparola chiave legherà una proprietà dell'oggetto a una funzione. Quando questa proprietà viene cercata, viene chiamata la funzione getter. Il valore restituito dalla funzione getter determina quindi quale proprietà viene restituita.

Esempio:

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName);
// When the fullname property gets looked up
// the getter function gets executed and its
// returned value will be the value of fullname


2
Complimenti per l'esempio pratico!
Niket Pathak,

8
Penso di poterlo semplificare ulteriormente. Il "get" consente di trattare un metodo di classe, come se fosse una semplice proprietà in un oggetto. Se lasci il 'get', puoi comunque accedere al valore chiamando .area () invece di .area
dwilbank

21

È getter, come gli oggetti e le classi in JavaScript OO. Dai documenti MDN per get:

La getsintassi lega una proprietà di un oggetto a una funzione che verrà chiamata quando verrà cercata quella proprietà.


0

o in un modo più semplice chiama semplicemente la funzione senza bisogno di user "()" semplicemente digitando il nome della funzione

le due funzioni di cui sopra sono uguale attenzione a person.fullName () e person.fullName

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName());

const person = {
    firstName: 'Willem',
    lastName: 'Veen',
    get fullName() {
        return `${this.firstName} ${this.lastName}`;
    }

}

console.log(person.fullName);

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.