嵌套类定义,而不创建其他全局对象



我试图在javascript中创建嵌套类定义,以便只有一个全局对象。

目前,我们定义了这样的新类:

FOO.Navigation.Sidebar.Tooltip = function()
{
};

因此,在每个函数定义中,我们都必须重复整个嵌套类名称空间:

FOO.Navigation.Sidebar.Tooltip.prototype.show = function()
{
  /* do something here */
};

我们引入了一个名称空间函数来创建类。

FOO = { /* ... */ }
FOO.namespace = function(namespaceString)
{
  var namespaceParts = namespaceString.split('.');
  var currentRoot = FOO;
  var index = 0;
  // Skip the first namespacePart, if it is already "FOO"
  if ("FOO" == namespaceParts[0])
  {
  index = 1;
  }
  var currentPart;  
  for(index; index < namespaceParts.length; index++)
  {     
    // This is the next element in the namespace hierarchy.
    currentPart = namespaceParts[index]; 
    // Add a new map for the currentPart to the root (if it does not exist yet). 
    currentRoot[currentPart] = currentRoot[currentPart] || {};
    // The currentPart will be the new root in the next loop.
    currentRoot = currentRoot[currentPart];
  }
  return currentRoot;
};

现在,我们想使用它来创建以前定义的更可读的版本,它应该看起来像这样:

FOO.Navigation.Sidebar.Tooltip = function()
{
  this.hallo = "world";
};
var tooltip = FOO.Navigation.Sidebar.Tooltip;
tooltip.prototype.show = function()
{
  /* do something */
};

这将创建一个新的全局变量"工具提示",并且我们必须键入两次类名。因此,我们考虑使用这样的匿名函数:

(function(tooltip) {
  tooltip = function()
  {
    this.hello = "world";
  };
  tooltip.prototype.show= function()
  {
    /* do something */
  };
}) (FOO.namespace("FOO.Navigation.Sidebar.Tooltip"))

这显然不起作用,因为我们在"工具提示"中添加了一个新的函数定义。

所以我的问题是,是否有一种方法可以只写一次类名,而不创建任何全局变量。

在我看来,您正在尝试创建模块模式的实现。模块通常用于创建单个实例对象;但是,您可以很容易地将工厂方法添加到返回新闭包(函数)的模块中。

使用上面粘贴的代码,您可以直接将方法附加到闭包内提供的tooltip变量;例如:

(function(Tooltip) {
    // 'Static' method added to the module definition.
    Tooltip.hello = function() { 
        alert("Hello!");
    };
    // Factory method which returns a new object.
    Tooltip.create(message) {
        return { 
            this.message = message;
            this.show = function() { /* ... */ }
        };
    }
})(FOO.namespace("FOO.Navigation.Sidebar.Tooltip"));

然后您可以在Tooltip:上调用hello方法

// Invoke a static method.
FOO.Navigation.Sidebar.Tooltip.hello();​
// Create a new ToolTip instance.
var myToolTip = FOO.Navigation.Sidebar.Tooltip.create("Hello World");
myToolTip.show();

如果您想创建一个层次化的类结构,那么您可能需要考虑一个常见的JavaScript库,如Backbone.js

相关内容

  • 没有找到相关文章

最新更新