Что означает ключевое слово «get» перед функцией в классе?

110

Что getзначит в этом классе ES6? Как мне сослаться на эту функцию? Как мне его использовать?

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

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

  calcArea() {
    return this.height * this.width;
  }
}
Мэтью Харвуд
источник
5
Скорее всего, это просто геттер, но внутри класса, а не объекта. Это не совсем специфично для ES6.
user4642212
@Xufox, как вы имеете в виду, что это не специфично для ES6?
Кейт Николас
1
@KeithNicholas: То же самое и в ES5.
Берги
Я думаю, @KeithNicholas Getters существуют со времен ES5. Единственное, что здесь есть в ES6, - это classсинтаксис, но в геттерах нет ничего нового.
user4642212

Ответы:

114

Это означает, что функция является получателем для свойства.

Чтобы использовать его, просто используйте его имя, как любое другое свойство:

'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
Классы неявно находятся в строгом режиме, кстати. ecma-international.org/ecma-262/6.0/#sec-strict-mode-code
Кит Сунде,
1
@KitSunde - по крайней мере, в моем браузере (Chrome, Win7), без этого оператора я получаю консольные ошибки вместо рабочего образца. И это не часть «Ответа», как и кнопка «Выполнить фрагмент кода».
Амит
4
Разве нельзя просто позвонить p. calcArea? если нет, то почему?
ksav
9
Являются ли ключевые слова get / set просто синтаксическим сахаром - поскольку вызов Polygon.calcArea () также будет действовать как геттер?
Craig O. Curtis
так что getключевое слово функции get не может иметь параметра?
jay1234
48

Резюме:

getКлючевое слово связать свойство объекта к функции. Теперь, когда это свойство ищется, вызывается функция получения. Затем возвращаемое значение функции получения определяет, какое свойство возвращается.

Пример:

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
Поднимите палец вверх за практический пример!
Никет Патхак
8
Я думаю, что могу еще больше упростить это. «Get» позволяет вам обращаться с методом класса, как если бы это было простое свойство объекта. Если вы оставите «get», вы все равно сможете получить доступ к значению, вызвав .area () вместо просто .area
dwilbank
21

Это метод получения, такой же, как объекты и классы в объектно-ориентированном JavaScript. Из документации MDN для get:

getСинтаксис связывает свойство объекта в функцию , которая будет вызываться , когда это свойство ищется.

Правин Кумар Пурушотаман
источник
0

или более простой способ просто вызвать функцию без необходимости использовать "()", просто набрав имя функции

две вышеуказанные функции уделяют одинаковое внимание person.fullName () и 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);

Нима Сараян
источник