Question

我正在使用jQuery开发一个小的单页滚动网站。作为javascript的新手，我遇到了其他开发人员组织代码的许多不同方式。有一个简单的网站与小的javascript交互，我想知道我在其他网站上看到的以下代码片段之间有什么区别。

首先

var NS = NS || NS
NS = {
    init: function() {},
    buildNav: function() {},
    scrollToSection: function() {}
}

$( document ).ready( NS.init() );

第二

var NS = NS || NS;
NS = new (function() {
    var name = 'Basic';
    var self = this;
    self.getName = function() { return name; };
});
NS.Home = new (function() {
    // variables..are these private or public
    var self = this;
    self.init = function() {
      // initiate
    }

    self.scrollToSection = function() {
      // scroll section
    }

    // public or private method?
    function buildNav() {
    }
});

$(document).ready(function() { NS.Home.init(); });

第三

var NS = NS || NS;

NS.Home = new function() {
  var foo = $('#htmlelement');

  this.scrollToSection() {
    // scroll section
  };
  this.init = function() {
    buildNav();
  };

  function buildNav() { }
}
$( document ).ready( NS.Home.init() );

第四

(function($){
    $.fn.homepage = function() { 
        function buildNav() { }
        function init () { } 
    };
    $.fn.otherpage = function() {
        function doSomething() { }
        function init () { }
     }
})(jQuery);

$(document).ready(function () {
    $('#homepage-element').homepage();
}

Answer 1

var NS = NS || NS; 如果传递的值为null或未定义，则此行将NS初始化为默认值。所有这三个都创建了一个NS的单例对象 - 它就像一个命名空间。
First，Second和Third解释了面向对象编程实践的不同风格。
首先，NS对象是通过对象文字表示法创建的，因此它的所有功能都是公共的，你为NS创建的变量也将是公共的。
第二和第三是非常相似的，除了第二个更混乱，第三个更清脆。第二个和第三个都在NS对象上声明了一些公开的方法（通过匿名构造函数创建）和一些私有函数。
Second和Third通过使用匿名构造函数动态声明属性。

您应该阅读一些关于面向对象的JavaScript和设计模式的文章。从this one

Answer 2

看一下Elijah Manor提供的内容here。关于javascript最佳实践的一些非常好的演示文稿和内容。

Javascript模式设置差异

2 个答案: