Javascript中的OOP原则答案

【问题标题】：OOP Principles in JavascriptJavascript中的OOP原则
【发布时间】：2013-10-26 17:39:18
【问题描述】：

我在使用 oo javascript 时遇到了一些问题。我正在创建一个新的对象公共和私有方法。现在当我调用公共方法时，它无法访问私有变量。

我认为我应该 return 公共方法（互联网），但 不知道为什么。 有人可以解释一下我缺少什么吗？

function something(){
    var somePanel;  // it is a jquery object to a div

    var createWindow = function(data){
        random.xhr('/chat', 'GET', null, function(res){
            var Container = $("#Container");
            somePanel = $("<div/>").addClass('somePanel').append(res);
            Container.append(somePanel.hide());
        });     
    };

    this.activate = function(){
        somePanel.show().siblings().hide();
    };

    this.init = function(data, fn){
        createWindow(data);
    };
};


connections[data] = new something();  // creates a new something object
connections[data].init(data);   //  which creates just a div object, actually
connections[data].activate();  // has code to show this panel and hide every other panel

当我调用activate() 方法时，它找不到somePanel。我应该做些什么不同的事情？为什么？

【问题讨论】：

您如何定义somePanel 以及在哪里？试着解释一下
这段代码运行得非常好；你没有向我们展示不工作的部分。但我猜你在某处使用了var，将你原来的somePanel 隐藏在something 中
另外，activate 方法中未使用的“that”参数是什么？另外， somePanel 没有定义，所以我猜你会看到 Uncaught TypeError 异常，因为值未定义，不是吗？
更新了一些代码的cmets
我认为您需要将引用传递给 somePanel 变量，因为您的闭包只是声明了变量但从未设置过，这样的东西应该可以工作： this.init = function( data, fnc, ref ){ /* 你的初始化代码 */ somePanel = ref; }

标签： javascript oop object

【解决方案1】：

异步方法的经典问题。

当您运行 activate 时，您的 xhr 处理程序不会被调用。您需要等待 xhr 处理程序运行，然后在回调中调用 activate。

类似的东西：

// ...

this.init = function(data, fn){
    createWindow(data, fn);
};

var createWindow = function(data, fn) {
    random.xhr('/chat', 'GET', null, function(res){
        var Container = $("#Container");
        somePanel = $("<div/>").addClass('somePanel').append(res);
        Container.append(somePanel.hide());
        fn();
    });     
};

// ...

connections[data] = new something();
connections[data].init(data, function () { connections[data].activate() });

【讨论】：

所以我的 oo 技能不应该受到责备。很高兴:)
是的。但是，出于不同的原因，我从一开始就创建了一个回调函数。派上用场了。非常感谢。

【解决方案2】：

您正在将回调中的 somePanel 设置为异步调用。不能保证 somePanel 在您调用 activate() 时已设置。

edit meagar 的答案是从 OO 角度来看的最佳选择。我的其余答案旨在保持您试图实现的可读性。

您可能想考虑使用允许异步链接的模块（如async）或promises

【讨论】：