扩展 setter 默认对象 [英] Extend setter default object
问题描述
就像你们都知道的按钮是一个按钮......点击,向上,向下,做这个,做那个.所以我写了一些默认的按钮行为类/对象".
Like you all know a button is a button... click, up, down, do this, do that. So I wrote some default button behavior "class/object".
外部默认 button.js:
external default button.js:
function Button(parent) {
var self = this;
this.enabled = true;
this.visible = true;
...
this.initialized = false;
f_createButton(parent, self);
this.initialized = true;
...
}
Button.prototype = {
get initialized () {
return this._initialized;
},
set initialized(bool){
this._initialized = bool
if(this.initialized === true) {
... do default stuff
}
},
get enabled(){
return this._enabled;
},
set enabled(bool){
this._enabled = bool;
if(document.getElementById(this.id)) { // is button defined?
var mClassName = document.getElementById(this.id).children[0].className;
document.getElementById(this.id).className = (this.enabled === false) ? "button button-Gray_disabled" : "button button-" + this.defaultStyle;
document.getElementById(this.id).children[0].className = (this.enabled === false) ? mClassName + "_disabled" : mClassName.replace("_disabled","");
}
}
}
function f_createButton("", obj) {
.... create DOM element
}
在 html 中包含 button.js &扩展按钮类/对象":
include button.js in html & extend Button "Class/Object":
Object.defineProperty(Button.prototype,"buttonStyle", {
get : function() {
return this._buttonStyle;
},
set : function(str) {
this._buttonStyle = str;
if(this.id !== "undefined" && document.getElementById(this.id)) { // is button defined?
document.getElementById(this.id).style.backgroundImage = 'url(Images/'+this.buttonStyle+'/buttons.png)';
}
}
});
这几乎可以工作,但它会杀死初始化的原始按钮.
This almost works, but it kills the original Button initialized.
Object.defineProperty(Button.prototype,"initialized", {
set : function( bool ) {
this._initialized = bool;
if(this.initialized === true) {
this.buttonStyle = "NONE";
}
}
});
如何扩展原来的 setter?
How can I extend the original setter?
推荐答案
您的问题似乎不寻常,但让我们尝试一下.首先,考虑这个基类,它会在你的外部 js 文件中:
What you're asking seems unusual, but let's try. First of all, consider this base class, which would be in your external js file:
// Constructor
function Button() {
var self = this;
var _initialized = false; // 'private' property manipulated by the accessors
this.initialized = false;
this.createButton();
this.initialized = true;
}
// Default prototype
Button.prototype = {
createButton: function() {
console.log(' create DOM element ');
}
}
// Default getter/setter on prototype
Object.defineProperty(Button.prototype,"initialized", {
set : function( bool ) {
console.log('this is the original setter');
this._initialized = bool;
if(this._initialized === true) {
console.log('do default stuff')
}
},
get : function() {
return this._initialized;
},
configurable : true // IMPORTANT: this will allow us to redefine it
});
如果我明白你在问什么,你想重新定义 initialized
访问器(getter/setter),但仍然有对旧访问器的引用.也许有更好的方法可以做到这一点,但您可以将原始访问器复制到一个新访问器中,然后重新定义它:
If I understand what you're asking, you want to redefine the initialized
accessor (getter/setter), but still have a reference to the old one. Maybe there's a better way to do that, but you could copy the original accessor into a new one, then redefine it:
// Keep reference to the old accessors
var original = Object.getOwnPropertyDescriptor(Button.prototype, 'initialized');
Object.defineProperty(Button.prototype, "oldInitialized", {
set : original.set,
get : original.get
});
// Redefine getter and setter
Object.defineProperty(Button.prototype, "initialized", {
set : function( bool ) {
console.log('this is the new setter');
this.oldInitialized = bool;
},
get : function() {
return this._initialized;
}
});
这是工作中的代码:http://jsfiddle.net/aTYh3/.
这篇关于扩展 setter 默认对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!