【问题标题】:Most elegant way to create a Namespace/Class type structure in JavaScript [closed]在 JavaScript 中创建命名空间/类类型结构的最优雅方法 [关闭]
【发布时间】:2013-03-17 13:25:51
【问题描述】:

我正在尝试确定一种方法,该方法将为我提供将代码包装在 Namespace/Unit 之类的对象中的最优雅方式。例如 Google Maps API 的 var a = Google.Maps.Foo();,我认为它看起来很干净。

我希望它也附上(如果这是正确的术语)jQueryNo Conflict$ 符号。

到目前为止我喜欢:

// Top level container for sub objects
var myApp = myApp || {}; 

// An object to be held in myApp     
(function( skillet, $, undefined ) {

    //Private Property
    var isHot = true;

    //Public Property
    skillet.ingredient = "Bacon Strips";

    //Public Method
    skillet.fry = function() {
        var oliveOil;

        addItem( "\t\n Butter \n\t" );
        addItem( oliveOil );
        console.log( "Frying " + skillet.ingredient );

        return "Fried!";
    };

    //Private Method
    function addItem( item ) {
        if ( item !== undefined ) {
            console.log( "Adding " + $.trim(item) );
        }
    }   

}( window.myApp.skillet = window.myApp.skillet || {}, jQuery ));

任何人都可以对此进行扩展,指出潜在的问题,或者只是提供一种更好的方法吗?

【问题讨论】:

  • 从来没有一种优雅的方式来做某事,因为优雅是主观的。
  • 为您做出最佳决策所需的一切都在这里:stackoverflow.com/questions/881515/…
  • @NinjaNye 啊是的,这就是代码的来源,我正在尝试对其进行扩展。
  • 你的图案真的很好。你想扩展什么?
  • 在我看来,最好将所有函数定义为私有,然后公开任何必要的函数,en bloc 在最后的一组语句中。例如,function fry() {...} 然后是 skillet.fry = fry;。这具有双重优势,即允许内部函数调用不需要skillet. 前缀,并且公共方法易于观察/调整。

标签: javascript jquery design-patterns module closures


【解决方案1】:

检查此JavaScript Module Pattern 还有这个Learning JavaScript Design Patterns

模块示例:

var MyModule = (function($){
  var MY_CONSTANT = 123;

  var _myPrivateVariable = 'TEST MEH';
  var _$myPrivateJqueryObject = $('div.content');

  var _myPrivateMethod = function(){
    alert('I am private!');
  };

  var myPublicMethod = function(){
    console.log('Public much?');
  }

  return {
      myPublicMethod : myPublicMethod 
  };

})(jQuery);

MyModule.myPublicMethod();

类示例:

function Person(name, age){
   this.name = name || '';
   this.age = age || -1;
}

Person.prototype.greet= function(){
   console.log('Hi! My name is' + this.name + '. Old ' + this.age + ' I am.');
}

var person = new Person("John", 12);
person.greet();

【讨论】:

  • 好文章 :) (虽然第二个有点笨拙)
  • 这是一本书 :) 由 Google 员工 Addy Osmani 撰写
  • 未转义的单引号伤害了我们的眼睛;)
  • 不需要在任何变量前加下划线。
  • 需要注意的是,这两种模式并不相互竞争。模块模式严格用于创建单例命名空间(或一组相关的单例命名空间),而类模式为您提供了构成多个实例基础的东西。使用 Class 模式,您还应该知道(以上面写的方式)它需要用 new 来调用 - 这一点已被彻底讨论过 here - 如果您可以遵循每个单词,那么您正在做好吧 - 我不时重读它。
猜你喜欢
  • 2015-07-15
  • 1970-01-01
  • 2021-07-11
  • 1970-01-01
  • 2011-07-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多