1

我在用 Javascript 编写对象构造函数时遇到问题。当我在一个实例化对象上调用函数时，它总是返回实例化对象的值。流程是这样的：

blue = tool('blue');
blue.jDom();     // returns '[<div id="blue" class="tool">...</div>]'
red = tool('red');
red.jDom();     // returns '[<div id="red" class="tool">...</div>]'
blue.jDom();     // returns '[<div id="red" class="tool">...</div>]'

我相信这是由于我在原型声明中包含的私有变量。如果我将原型声明移到构造函数中，一切正常，但这只是掩盖了这样一个事实，即我的对象似乎通过为每个对象创建一个新原型来影响原型的属性，而不是它们本身。这是我的相关代码：

function beget(oPrototype) {
    function oFunc() {};
    oFunc.prototype = oPrototype;
    return new oFunc()
};    

var tool = (function (){
        var protoTool = function(){

            var oTool = {},
                that = this,
                _bVisible = true,
                _oParentPane = 'body',
                _aoComponents,
                _sName = 'tool',
                _sSelector = '#' + _sName,
                _jDomElement;



            // this is the private tab object, needs to be refactored
                            // descend from a single prototype  
            function _tab() {

                var oTab = {},
                    _sHtml = '<li><a href="' + _sSelector + '">' + _sName + '</a></li>',
                    _jDomElement = $(_sHtml);

                function jDom() {
                    return _jDomElement;
                }

                oTab.jDom = jDom;

                return beget(oTab);
            };

            // this builds the jDom element 
            function _jBuild() {
                var sHtml = '<div id="' + _sName + '" class="tool"></div>';
                _jDomElement = $(sHtml)
                return _jDomElement;
            };

            // this returns the jQuery dom object
            function jDom() {
                if (typeof _jDomElement === 'undefined') {
                    _jBuild();
                }
                return _jDomElement;
            };

            function configure (oO){
                if (typeof oO !== 'undefined') {
                    if (typeof oO === 'string') {
                        var name = oO;
                        oO = Object();
                        oO.sName = name;
                    } 


                    _bVisible = oO.bVisible || _bVisible,
                    _oParentPane = oO.oParentPane || _oParentPane,
                    _aoComponents = oO.aoComponents || _aoComponents,
                    _sName = oO.sName || _sName,
                    _sSelector = '#' + _sName,
                    _jDomElement = undefined;
                    _oTab = _tab();

                    _oTab.jDom()
                        .appendTo(jDom())
                        .draggable({
                        revert: 'invalid',
                        containment: '#main',
                        distance: 10,
                    });
                } 

            };

            oTool.tMove = tMove;
            oTool.bVisible = bVisible;
            oTool.uOption = uOption;
            oTool.jDom = jDom;
            oTool.configure = configure;    

            return oTool;   
        }();

        var tool = function (oO) {
            that = beget(protoTool);
            that.configure(oO);
            that.configure = undefined;
            return that;
        };

        return tool;
    })();
4

1 回答 1

0

首先：在内部工具 var 定义中，由 'that = beget(protoTool);' 你一定是说'var that = beget(protoTool);'

你的代码发生了什么？：
工具定义被评估以便给工具一个值。在此评估期间，围绕protool 进行了闭包。
但是这个闭包只在这个评估期间进行一次：所有以后对 protool 的调用（通过调用以 protools 作为原型的 'that' 进行），将改变这个第一个也是唯一一个闭包的值。
这就是你看到这种行为的原因：最近看到的对象将得到所有关注，因为它更新了闭包的值。
解决方案是在“工具”内部 var 函数定义中创建正确的闭包。

但如果可以的话，我建议完全使用经典的 javascript 类定义，然后使用 new 运算符，我相信这更容易编码/理解/调试。

另一个 rq ：beget === Object.create 在最新的javascript规范（1.8.6）

于 2013-07-04T16:37:16.740 回答