¿Cuál es la palabra clave "get" antes de una función en una clase?

105

¿Qué getsignifica en esta clase de ES6? ¿Cómo hago referencia a esta función? ¿Cómo debo usarlo?

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

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

  calcArea() {
    return this.height * this.width;
  }
}
javascript methods getter Matthew Harwood
fuente
5
Lo más probable es que sea solo un captador, pero dentro de una clase en lugar de un objeto. No es realmente específico de ES6.
user4642212
@Xufox, ¿cómo quieres decir que no es específico de ES6?
Keith Nicholas
1
@KeithNicholas: Que funcionó en ES5 igual.
Bergi
@KeithNicholas Getters existen desde ES5, creo. Lo único que es ES6 aquí es la classsintaxis, pero los captadores no son nada nuevo.
user4642212

Respuestas:

108

Significa que la función es un captador de una propiedad.

Para usarlo, simplemente use su nombre como lo haría con cualquier otra propiedad:

'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);
Expandir fragmento

Amit
fuente
2
Las clases están implícitamente en modo estricto por cierto. ecma-international.org/ecma-262/6.0/#sec-strict-mode-code
Kit Sunde
1
@KitSunde: al menos en mi navegador (Chrome, Win7), sin esa declaración, obtengo errores de consola en lugar de una muestra de trabajo. Y esto no forma parte de "La respuesta", al igual que el botón "Ejecutar fragmento de código".
Amit
4
¿No puedes simplemente llamar p. calcArea? ¿si no, porque no?
ksav
9
¿Son las palabras clave get / set simplemente azúcar sintáctico, ya que una llamada a Polygon.calcArea () también actuará como un getter?
Craig O. Curtis
¿Entonces la función get getpalabra clave no puede tener parámetro?
jay1234
46

Resumen:

La getpalabra clave vinculará una propiedad de objeto a una función. Cuando se busca esta propiedad, ahora se llama a la función getter. El valor de retorno de la función getter determina qué propiedad se devuelve.

Ejemplo:

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
Expandir fragmento

Willem van der Veen
fuente
2
¡Aprobado por el ejemplo práctico!
Niket Pathak
8
Creo que puedo simplificarlo aún más. El 'get' le permite tratar un método de clase, como si fuera una propiedad simple en un objeto. Si deja el 'get', aún puede acceder al valor llamando a .area () en lugar de solo a .area
dwilbank
21

Es getter, al igual que Objects y Classes en OO JavaScript. De MDN Docs para get:

La getsintaxis vincula una propiedad de objeto a una función que se llamará cuando se busque esa propiedad.

Praveen Kumar Purushothaman
fuente
0

o una forma más simple, simplemente llama a la función sin necesidad de usar el usuario "()" simplemente escribiendo el nombre de la función

las dos funciones anteriores son igual atención a person.fullName () y person.fullName

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

}

console.log(person.fullName());
Expandir fragmento

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

}

console.log(person.fullName);
Expandir fragmento

nima sarayan
fuente