Геттеры и Сеттеры

Геттеры - это свойства, которые на самом деле вызывают скрытую функцию для получения значения.
Сеттеры - это свойства, которые на самом деле вызывают скрытую функцию для задания значения.

Когда вы задаете свойству геттер или сеттер, оно определяется как «дескриптор доступа» (в противовес «дескриптору данных»). Для дескрипторов доступа, характеристики дескриптора valueи writableигнорируются, а вместо этого JS рассматривает характеристики свойства setи get(а также configurableи enumerable).

Пример:

var user = {
  firstName: "Вася",
  surname: "Петров"
}

Object.defineProperty(user, "fullName", {
  get: function() {
    return this.firstName + ' ' + this.surname;
  }
});

alert(user.fullName); // Вася Петров

Обратим внимание, снаружиfullName– это обычное свойствоuser.fullName. Но дескриптор указывает, что на самом деле его значение возвращается функцией.

Также можно указать функцию, которая используется для записи значения, при помощи дескриптораset.

Например, добавим возможность присвоенияuser.fullNameк примеру выше:

var user = {
  firstName: "Вася",
  surname: "Петров"
}

Object.defineProperty(user, "fullName", {

  get: function() {
    return this.firstName + ' ' + this.surname;
  },

  set: function(value) {
      var split = value.split(' ');
      this.firstName = split[0];
      this.surname = split[1];
    }
});

user.fullName = "Петя Иванов";
alert( user.firstName ); // Петя
alert( user.surname ); // Иванов

Указание get/set в литералах

Если мы создаём объект при помощи синтаксиса{ ... }, то задать свойства-функции можно прямо в его определении.

Для этого используется особый синтаксис:get свойствоилиset свойство.

Например, ниже объявлен геттер-сеттерfullName:

var user = {
  firstName: "Вася",
  surname: "Петров",

  get fullName() {
    return this.firstName + ' ' + this.surname;
  },

  set fullName(value) {
    var split = value.split(' ');
    this.firstName = split[0];
    this.surname = split[1];
  }
};

alert( user.fullName ); // Вася Петров (из геттера)

user.fullName = "Петя Иванов";
alert( user.firstName ); // Петя  (поставил сеттер)
alert( user.surname ); // Иванов (поставил сеттер)

<<< back