Question

I call the object methods below like this.

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

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

I only use one instance at a time. Because I only use one instance at a time, I want to remove this.element and use the passed in element instead.

This got me to wondering is the passed in element static or instance based. I think it might be this.element ( instance based )…even when I don’t explicitly state it. I plan on removing all mentions of this.element for just element.

Is it?

Note: this is returned implicitly if no other return is given.

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:[e-mail]">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 isn’t really either. It’s a local variable to the constructor that will be defined per call. It’s only a property of this because it’s been set explicitly:

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

Still, using it rather than this.element should work fine with any function/method defined within the constructor:

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

Where it won’t be accessible is if you instead used the prototype to define methods outside of the constructor. Here, element wouldn’t be in scope; but this would be, so this.element would be as well:

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

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