The
set
syntax binds an object property to a function to be called when there is an attempt to set that property.Syntax
{set prop(val) { . . . }}
{set [expression](val) { . . . }}
Parameters
prop- The name of the property to bind to the given function.
val- An alias for the variable that holds the value attempted to be assigned to
prop. - expression
- Starting with ECMAScript 2015, you can also use expressions for a computed property name to bind to the given function.
Description
In JavaScript, a setter can be used to execute a function whenever a specified property is attempted to be changed. Setters are most often used in conjunction with getters to create a type of pseudo-property. It is not possible to simultaneously have a setter on a property that holds an actual value.
Note the following when working with the
set
syntax:- It can have an identifier which is either a number or a string;
- It must have exactly one parameter (see Incompatible ES5 change: literal getter and setter functions must now have exactly zero or one arguments for more information);
- It must not appear in an object literal with another
setor with a data entry for the same property.
({ set x(v) { }, set x(v) { } }and{ x: ..., set x(v) { } }are forbidden )
A setter can be removed using the
delete
operator.Examples
Defining a setter on new objects in object initializers
This will define a pseudo-property
current
of object o
that, when assigned a value, will update log
with that value:var language = {
set current(name) {
this.log.push(name);
},
log: []
}
language.current = 'EN';
console.log(language.log); // ['EN']
language.current = 'FA';
console.log(language.log); // ['EN', 'FA']Note that
current
is not defined and any attempts to access it will result in undefined.Removing a setter with the
delete
operator
If you want to remove the setter, you can just
delete
it:delete o.current;Defining a setter on existing objects using
defineProperty
To append a setter to an existing object later at any time, use
Object.defineProperty().var o = {a: 0};
Object.defineProperty(o, 'b', { set: function(x) { this.a = x / 2; } });
o.b = 10; // Runs the setter, which assigns 10 / 2 (5) to the 'a' property
console.log(o.a) // 5Using a computed property name
var expr = 'foo';
var obj = {
baz: 'bar',
set [expr](v) { this.baz = v; }
};
console.log(obj.baz); // "bar"
obj.foo = 'baz'; // run the setter
console.log(obj.baz); // "baz"Specifications
| Specification | Status | Comment |
|---|---|---|
| ECMAScript 5.1 (ECMA-262) The definition of 'Object Initializer' in that specification. |
STStandard | Initial definition. |
| ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Method definitions' in that specification. |
STStandard | Added computed property names. |
| ECMAScript 2017 Draft (ECMA-262) The definition of 'Method definitions' in that specification. |
DDraft |
Browser compatibility
SpiderMonkey-specific notes
- Starting with JavaScript 1.8.1, setters are no longer called when setting properties in object and array initializers.
- From SpiderMonkey 38 on, a setter with a
rest parameter
is a
SyntaxErroras per the ES2015 specification.
See also
- getter
deleteObject.defineProperty()__defineGetter____defineSetter__- Defining Getters and Setters in JavaScript Guide