这个JS对象模式有什么不对（或对）？

Question

下面是我在javascript对象中使用的模式示例（此示例依赖于jQuery）。 http://pastie.org/private/ryn0m1gnjsxdos9onsyxg

它的工作对我来说相当不错，但我猜有什么不对，或者至少次优的这件事，我只是好奇，让人们的意见。

下面是它的一个小的，内嵌例如：

sample = function(attach) { 
    // set internal reference to self 
    var self = this; 

    // public variable(s) 
    self.iAmPublic = true; 

    // private variable(s) 
    var debug = false; 
    var host = attach; 
    var pane = { 
     element: false, 
     display: false 
    } 

    // public function(s) 
    self.show = function() { 
     if (!pane.display) { 
      position(); 
      $(pane.element).show('fast'); 
      pane.display = true; 
     } 
    } 

    self.hide = function() { 
     if (pane.display) { 
      $(pane.element).hide('fast'); 
      pane.display = false; 
     } 
    } 

    // private function(s) 
    function init() { 
     // do whatever stuff is needed on instantiation of this object 
     // like perhaps positioning a hidden div 
     pane.element = document.createElement('div'); 
     return self; 
    } 

    function position() { 
     var h = { 
      'h': $(host).outerHeight(), 
      'w': $(host).outerWidth(), 
      'pos': $(host).offset() 
     }; 
     var p = { 
      'w': $(pane.element).outerWidth() 
     }; 
     $(pane.element).css({ 
      top: h.pos.top + (h.h-1), 
      left: h.pos.left + ((h.w - p.w)/2) 
     }); 
    } 

    function log() { 
     if (debug) { console.log(arguments); } 
    } 

    // on-instantiation let's set ourselves up 
    return init(); 
} 

我真的很好奇，让人们对这一想法。

Answer 1

sample = function(attach) { 
    // set internal reference to self 
    var self = this; 

为什么不直接使用this？写Javascript，the one maintaining your code will thank you。

// public variable(s) 
    self.iAmPublic = true; 

    // private variable(s) 
    var debug = false; 
    var host = attach; 
    var pane = { 
     element: false, 
     display: false 
    } 

    // public function(s) 
    self.show = function() { 
     if (!pane.display) { 
      position(); 
      $(pane.element).show('fast'); 
      pane.display = true; 
     } 
    } 

    self.hide = function() { 
     if (pane.display) { 
      $(pane.element).hide('fast'); 
      pane.display = false; 
     } 
    } 

我知道，这是很好的OOP设计，不过说真的，你又增加另一个层间接到普通的JavaScript。你可以用$(e).hide('fast')以及其他你会用e.hide()来隐藏的东西。这种不一致可能会让你的代码更加混乱。

// private function(s) 
    function init() { 
     // do whatever stuff is needed on instantiation of this object 
     // like perhaps positioning a hidden div 
     pane.element = document.createElement('div'); 
     return self; 
    } 

Preppend一个_或__之前私有方法和变量，JavaScript没有私有属性，所以你必须要依靠惯例，或use closures。

function position() { 
     var h = { 
      'h': $(host).outerHeight(), 
      'w': $(host).outerWidth(), 
      'pos': $(host).offset() 
     }; 
     var p = { 
      'w': $(pane.element).outerWidth() 
     }; 
     $(pane.element).css({ 
      top: h.pos.top + (h.h-1), 
      left: h.pos.left + ((h.w - p.w)/2) 
     }); 
    } 

    function log() { 
     if (debug) { console.log(arguments); } 
    } 

这段代码有点不理想，因为函数log（）将从类外调用。我绝对不会把它留在生产代码上。

// on-instantiation let's set ourselves up 
    return init(); 
}