javascript - 帮助理解 twitters widget.js 文件，闭包中的闭包？

Question

http://a2.twimg.com/a/1302724321/javascripts/widgets/widget.js?1302801865

它在高层次上是这样设置的:

公共(public)命名空间:

TWTR = window.TWTR || {};

然后是闭包:

(function() {
...

})(); // #end application closure

在应用程序关闭内:

TWTR.Widget = function(opts) {
    this.init(opts);
};
(function() {
    // Internal Namespace.
    var twttr = {};
})();

有些方法被标记为公共(public)的，有些是私有(private)的，唯一的区别似乎是命名约定(私有(private)的以下划线“_”开头)。

它是使用模块模式设计的吗？

闭包中的闭包为什么或有什么好处？

因为他们在 jquery 之前加载 widget.js，这意味着 widget 被设计为运行 w/o jquery，因为顺序很重要？

只是想从这件事中学习!

Answer 1

It is setup like this at a high level:

public namespace:

TWTR = window.TWTR || {};

这是糟糕的编码习惯，变量应该总是用 var 声明。并且在 javascript 中没有“命名空间”，该术语适用于上述结构，但实际上并不合适。最好说它的方法包含在一个对象中。

Then a closure:

> (function() { ...
> 
> })(); // #end application closure

该模式后来被称为立即调用的函数表达式 或iife。不确定我喜欢这个名字，但你去吧。无论如何，它不一定会创建任何有用的闭包。闭包仅在函数创建的变量绑定(bind)到某个其他执行上下文时才有用，这些执行上下文在创建它们的函数的生命周期之后仍然存在(我希望这不会读起来像 gobbledy-goop)。您不需要 iife 来创建闭包。

但是，您可以使用上述模式来创建 闭包，因为它是一个与任何其他函数非常相似的函数。

Within the application closure:

> TWTR.Widget = function(opts) {
>     this.init(opts); }; (function() {
>     // Internal Namespace.
>     var twttr = {}; })();

Some methods are marked public, others private, and the only difference seems to be the naming convention (private starts with underscore '_').

“public”和“private”的使用在 javascript 中有点误导。使用下划线作为标识符名称的开头表示某些内容只能在当前范围内使用，或者由“库”代码本身使用。这有点多余，因为代码应该有一个已发布的 API，并且任何不属于 API 的方法都不应在外部可用。

但这在很大程度上取决于编码风格和个人喜好。

Is it designed using the module pattern?

Richard Cornford 的“模块模式”就是一种模式。它可以很方便地在 javascript 中模拟“私有(private)”变量，也可以在函数或方法之间共享属性，而不是通过通常的原型(prototype)继承。 widget.js 可能(部分地)使用模块模式实现，但它很可能是通过考虑需求和功能而设计的。 ;-)

Why or what benefit do you get with a closure within a closure?

与上述任何闭包的好处完全相同。通过将变量放在作用域链的适当部分来访问变量本质上与通过 [[prototype]] 链访问属性基本相同，只是使用了(非常不同的)机制——一个在作用域链上使用标识符解析，另一个使用属性[[prototype]] 链上的决议。

编辑

一个缺点是关闭变量所属的整个激活对象可能保留在内存中，因此如果您只需要访问共享变量，最好考虑一些其他方案，甚至可能是经典原型(prototype)继承。或者至少如果您要使用闭包，请尽量保持相关的激活对象尽可能小(例如，在退出之前将任何未使用的变量设置为 null)。

例如

var foo = (function() {

  // Variables available for closure
  var a, b, c;

  // Use a, b, c for stuff
  ...

  // Only want closure to c
  a = null;
  b = null;

  return function() {
    // use c
  }
}());

Since they load the widget.js before jquery, this means widget is designed to run w/o jquery since order matters correct?

我现在无法访问链接的资源(Twitter 域的公司封锁)，但加载顺序表明您是正确的。但是，某些代码执行可能会延迟到文档完全加载，因此不能保证，您需要查看代码。