Question

//namespace
if (!window.SlidePanel) {
    window.SlidePanel = (function () {
        var SlidePanel = {};

        return SlidePanel;
    })();
}   

SlidePanel.panel = function (el) {
    this.$ = el;
}
SlidePanel.panel.prototype = {
    insert: function () {
    },
    show: function () {
    },
    hide: function () {
    }        
}

SlidePanel.up = new SlidePanel.panel($('div#up-panel'));
SlidePanel.bottom = new SlidePanel.panel($('div#bottom-panel'));
SlidePanel.left = new SlidePanel.panel($('div#left-panel'));
SlidePanel.right = new SlidePanel.panel($('div#right-panel'));

我希望能够在某些代码位置设置show和hide函数。我想将setShowFn和setHideFn功能添加到SlidePanel.panel.prototype，就像这样

  SlidePanel.panel.prototype = {
        ...
        setShowFn: function (fn) {
            this.show = fn;
        },
        setHideFn: function (fn) {
            this.hide = fn;
        }
  }

这是一个好方法还是有更优雅的方法来做到这一点？

Answer 1

如果您只想在show的一个实例上覆盖hide或SlidePanel.panel函数，则可以自由更新该实例：

SlidePanel.up.show = function() { /* ... */ };

这会破坏该特定实例的show继承，而不会更改仍使用原型中show属性的任何其他实例。

如果您要为使用继承版本的所有实例更新show，您可以随时执行此操作：

SlidePanel.panel.prototype.show = function() { /* ... */ };

...因为实例有一个返回原型的引用，所以对原型的更改发生了“实时”。请注意，您完成上述第一个示例的任何实例都不会受到影响，因为它不再使用原型中的show版本。

是的，如果您愿意，可以将其封装在setShowFn和setHideFn函数中;请注意，除了约定/文档之外，没有任何内容可以防止代码直接分配给属性，即使你这样做了。

能够在JavaScript中设置对象功能的好方法是什么？

1 个答案: