javascript - this.argument 和 argument 之间的区别？

Question

我像这样调用下面的对象方法。

new Cout( elem1 ).load( 'body' )

new COut( elem1 ).display( 'email' )

我一次只使用一个实例。因为我一次只使用一个实例，所以我想删除 this.element 并使用传入的 element 来代替。

这让我想知道传入的元素是静态的还是基于实例的。我认为它可能是 this.element (基于实例)...即使我没有明确说明它。我计划删除所有提及 this.element 的元素。

是吗？

注意:如果没有给出其他返回值，则会隐式返回此值。

var COut = function ( element ) 
{
    var messages = 
    {
        name:         'Please enter a valid name',
        email:        'Please enter a valid email',
        email_s:      'Please enter a valid email.',
        pass:         'Please enter password, 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:fo@foo.com">support</a> to reset your password'
    };
    this.element = element;
    this.display = function( type ) 
    {
        this.element.innerHTML = messages[ type ];
    };
    this.load = function( location )
    {
        new AjaxRequest().invoke( 'ajax_type=async_load', function( response_text )
        {
            document[location].innerHTML = response_text;  
            new Cin().init( response_text.charAt( 6 ) ); // Correlate this point to Ajax Call.
        } ); 
    };
};

Answer 1

element 也不是真的。它是构造函数的局部变量，将在每次调用时定义。它只是 this 的一个属性，因为它已被显式设置:

var COut = function ( element ) 
{
    // ...
    this.element = element;
    // ...
};

不过，使用它而不是 this.element 应该可以与构造函数中定义的任何函数/方法一起正常工作:

var COut = function ( element ) 
{
    // ...
    this.display = function( type ) 
    {
        element.innerHTML = messages[ type ];
    };
    // ...
};

如果您使用 prototype 在构造函数之外定义方法，则无法访问它。在这里，element 不在范围内；但 this 会是，所以 this.element 也会是:

COut.prototype.display = function ( type ) {
     this.element.innerHTML = messages[ type ];

     element.innerHTML = messages[ type ]; // ERROR: `element` is not defined
};