сетер

Оператор set прив'язує властивість об'єкта до функції, яка буде викликана під час спроби присвоїти значення даній властивості.

Синтаксис

{set prop(val) { . . . }}
{set [expression](val) { . . . }}

Параметри

prop
Ім'я властивості, котра має бути прив'язана до даної функції.
val
Псевдонім змінної, що містить значення, для якого виконується спроба присвоїти його властивості prop.
expression
Починаючи від ECMAScript 2015, можна також використовувати вираз для обчислюваного імені властивості, до якої буде прив'язана дана функція.

Опис

У JavaScript сетер можна використати для виконання функції під час здійснення спроби змінити певну властивість. Найчастіше сетери використовуються у поєднанні з ґетерами для створення свого роду псевдовластивостей. Не можна водночас мати сетера на властивості, яка містить фактичне значення.

Зауважте особливість використання синтаксису set:

Приклади

Визначення сетерів на нових об'єктах у об'єктних ініціалізаторах

Наступний код визначає псевдовластивість current об'єкта language. Коли current присвоюється значення, це змінює log на таке саме значення:

const language = {
  set current(name) {
    this.log.push(name);
  },
  log: []
}

language.current = 'EN';
console.log(language.log); // ['EN']

language.current = 'UA';
console.log(language.log); // ['EN', 'UA']

Зверніть увагу, що  властивість current не визначена, і будь-які спроби звернутись до неї повернуть значення undefined.

Видалення сетера оператором delete

Якщо вам потрібно прибрати сетер, ви можете його просто видалити:

delete o.current;

Визначення сетера на існуючому об'єкті за допомогою defineProperty

Щоб додати сетер до існуючого об'єкта, використовуйте Object.defineProperty().

const o = {a: 0};

Object.defineProperty(o, 'b', {
 set: function(x) { this.a = x / 2; } 
});

o.b = 10; 
// Запускає сетер, який присвоює 10 / 2 (5) властивості 'a'

console.log(o.a) 
// 5

Використання обчислюваного імені властивості

const expr = 'foo';

const obj = {
  baz: 'bar',
  set [expr](v) { this.baz = v; }
};

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

obj.foo = 'baz';      
// запустити сетер

console.log(obj.baz); 
// "baz"

Специфікації

Специфікація
ECMAScript (ECMA-262)
The definition of 'Method definitions' in that specification.

Сумісність з веб-переглядачами

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
setChrome Full support 1Edge Full support 12Firefox Full support 1.5IE Full support 9Opera Full support 9.5Safari Full support 3WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 14Safari iOS Full support 1Samsung Internet Android Full support 1.0nodejs Full support Yes
Computed property namesChrome Full support 46Edge Full support 12Firefox Full support 34IE No support NoOpera Full support 47Safari Full support 9.1WebView Android Full support 46Chrome Android Full support 46Firefox Android Full support 34Opera Android Full support 33Safari iOS Full support 9.3Samsung Internet Android Full support 5.0nodejs Full support Yes

Legend

Full support  
Full support
No support  
No support

Див. також