1

外部 var Message 和内部 var Message 之间有什么联系？

召唤

new Message ( element ).display( server_response_text.slice( 6 ) );

目的

var Message = ( function () 
{
    var messages = 
    {
        name:         'Please enter a valid name',
        email:        'Please enter a valid email',
        email_s:      'Please enter a valid email.',
        pass:         'Please enter passoword, 6-40 characters',
        url:          'Please enter a valid url',
        title:        'Please enter a valid title',
        tweet:        'Please enter a valid tweet',
        empty:        'Please complete all fields',
        same:         'Please make emails equal',
        taken:        'Sorry, that email is taken',
        validate:     'Please contact <a class="d" href="mailto:here@host.com">support</a> to reset your password',
    };
    var Message = function (element) 
    {
        this.element = element;
    };
    Message.prototype.display = function( type ) 
    {
        this.element.innerHTML = messages[ type ];
        new Effects().fade( this.element, 'down', 4000 );
    };
    return Message;
} () );

我的整个图书馆都在使用这样的模块模式

    var NS = ( function ( window, undefined ) 
    {
    /*
    all code here including Message
    */
    } )( window );
4

3 回答 3

3

尽管名称相同，但这些变量引用是相等的。

在匿名函数内部，Message是一个本地声明的构造函数。
在函数结束时返回对该构造函数的引用。

身份测试：

window.Message = ( function () {
    ...
    // Defer call
    setTimeout(function() {
        alert('Identity? ' + Message === window.Message);
    }, 100);
    return Message;
} () );

图片：

  • 绿色对象（构造函数）在红色 块（函数）中定义。Message
  • 在此函数结束时，Message返回创建的绿色对象。
  • 创建函数后，立即使用(). 返回值（绿色框）被传递给橙色 Message变量。
  • 现在，橙色 Message变量指向绿色 Message对象/构造函数。澄清一下：绿色和橙色Message变量指的是同一个对象。
  • 这个构造函数的一个实例是使用new操作符创建的。

于 2012-04-11T21:10:47.803 回答
1

外部消息被设置为立即函数调用的结果（“（函数（）...”）。立即函数的返回值是内部消息，它也被设置为一个函数（就在“var消息”关闭范围，“var Message = function(element)”函数。）。

当您在此代码之外调用 new Message 时，它​​将调用“var Message = function(element)”函数来构造对象。

使用这种形式的原因是“消息”被保存在一个闭包中——本质上，它是私有数据。这是一个注释版本：

var Message = ( function ()     // Immediate function call
{
    // This is going to be private data - it's in a closure via the immediate function call
    var messages = 
    {
        name:         'Please enter a valid name',
        email:        'Please enter a valid email',
        email_s:      'Please enter a valid email.',
        pass:         'Please enter passoword, 6-40 characters',
        url:          'Please enter a valid url',
        title:        'Please enter a valid title',
        tweet:        'Please enter a valid tweet',
        empty:        'Please complete all fields',
        same:         'Please make emails equal',
        taken:        'Sorry, that email is taken',
        validate:     'Please contact <a class="d" href="mailto:here@host.com">support</a> to reset your password',
    };

    // This will be returned as the actual value of outer Message
    var Message = function (element) 
    {
        this.element = element;
    };

    // This adds to the prototype so it will be found in all instances of Message objects
    Message.prototype.display = function( type ) 
    {
        this.element.innerHTML = messages[ type ];
        new Effects().fade( this.element, 'down', 4000 );
    };

    // This is the return value of the immediate function call and becomes outer Message
    return Message;
} () );
于 2012-04-11T21:11:35.290 回答
1

变量名称根本没有关系1 。

这只是内部使用的名称。也可能是fuubar：

var fuubar = function (element) 
{
    this.element = element;
};
fuubar.prototype.display = function( type ) 
{
    this.element.innerHTML = messages[ type ];
    new Effects().fade( this.element, 'down', 4000 );
};
return fuubar; // the Object is returned, the Variable (Name) is not

外部名称是 是有道理的Message，因为这就是其他人“知道”它的方式。1选择内部名称可能是为了保持一致性，但不会影响语义。

构造函数只是 [设计为] 使用new运算符调用的函数对象。变量可以命名对象。在这种情况下，请注意它是返回的函数对象。因此，函数对象通过外部名称Message（例如“分配给消息”）而为人所知。但是，变量不是对象。

因此new X()计算表达式X，它必须计算为函数对象，然后将其用作构造函数。（构造函数只是一个期望与 一起使用的普通函数new：它可以执行初始化并建立一个 [[prototype]]）。名称X并不重要，除非它必须评估为函数对象。考虑这个等价形式来显示：new (X)()。首先(X)计算表达式。

所以，让我们分解代码：

var Message = (function () {
   // This function is invoked immediately, due to the
   // parenthesis immediately after the FunctionExpression.
   // As noted above the name Message used inside is not important.
   // What *IS* important is that a Constructor, which is just
   // a function-object (which is just an object) is returned.
   // This returned object will be assigned to (the outer)
   // Message variable. That is, it is "named by Message"
   // after the assignment occurs.
})()

// At this point Message will evaluate to a function-object
// (a Constructor in particular).
Message instanceof Function // -> true

// And we can use it to create new messages:
var messageA = new Message("a")
var messageB = new Message("b")

快乐编码。

于 2012-04-11T21:12:21.137 回答