Javascript, redefine unlimited number of setters with same function
Suppose you have an object:
var o = {
a: 3
b: 4
}
And you want to save or do something with it whenever a property of this object is changed. This is possible by defining special setters in javascript.
Observe first that means we will need two object: one to actually store the data, one to contain the special getters. (Is there an elegant way to avoid it?)
However, the annoying thing is that - if you read the above API page, setters have to be set by hand. Luckily, Object.defineProperty
will help us redefine unlimited number of setters as follow:
var create_custom_setter = function(destination, source, custom_setter){
destination = destination || {};
for(var prop in source){
if(typeof(source[prop]) === "object"){
var sub_destination = create_custom_setter({}, source[prop]);
destination[prop] = sub_destination;
}else{
// javascript scope problem:
var maker_set = function(source, prop){
return function(value) {
source[prop] = value;
custom_setter(value, prop, destination, custom_setter);
}
}
// default setter:
var maker_get = function(source, prop){
return function(){
return source[prop];
}
}
Object.defineProperty(destination, prop, {
set: maker_set(source, prop),
get: maker_set(source, prop)
});
}
}
return destination;
}
The, I can create a front-facing object of o
like this with a custom global setter:
var front_facing = create_custom_setter({}, o, function(value, prop){
console.log(prop + " has been set");
})
Written by Yannik Messerli
Related protips
Have a fresh tip? Share with Coderwall community!
Post
Post a tip
Best
#Javascript
Authors
Sponsored by #native_company# — Learn More
#native_title#
#native_desc#