扩展 setter 默认对象 [英] Extend setter default object

查看:14
本文介绍了扩展 setter 默认对象的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

就像你们都知道的按钮是一个按钮......点击,向上,向下,做这个,做那个.所以我写了一些默认的按钮行为类/对象".

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆