Function vs. Object Literal Notaion - is there a diifference?

Question

Both these ways work using the same call mechanism.

Obviously, I want to use the best way, but perhaps it is just a matter of preference?

Style-wise I like the Object Literal Notation because it provides enclosure.

Function Notation:

var TextProcessor = function()
{
};
TextProcessor.unEscape = function( second_split )
{
    var element;
    for( element in second_split )
    {
        second_split[element] = second_split[element].replace( '**', '*', 'g' );
        second_split[element] = second_split[element].replace( '|*', '|', 'g' );
    }
    return second_split;
};
TextProcessor.pullBullet = function( text )
{
    var pattern = /<(.+)_([a-z]){1}>$/;
    return pattern.exec( text );
};
TextProcessor.pullDomain = function( text )
{
    return text.match( /:\/\/(www\.)?(.[^\/:]+)/ )[2];
};

Object Literal Notation

/**
 *TextProcessor
 */

var TextProcessor = 
{
    unEscape:    function( text )
    {
        var index;
        for( index in second_split )
        {
            text[index] = text[index].replace( '**', '*', 'g' );
            text[index] = text[index].replace( '|*', '|', 'g' );
        }
        return second_split;
    },
    pullBullet:  function( text )
    {
        var pattern = /<(.+)_([a-z]){1}>$/;
        return pattern.exec( text );
    },
    pullDomain:  function( text )
    {
        return text.match( /:\/\/(www\.)?(.[^\/:]+)/ )[2];
    }
}

Some additional information of how you will be using these objects would be helpful. Will there only be one of these objects created, multiple in a loop, etc.? — James Montagne, Apr 09 '12 at 20:43
Do you want to know which method is best for a classes creation? Or want solve this particular situation? — Boyo, Apr 09 '12 at 21:00
I hope someone smarter than me demonstrates the revealing module pattern for this, too. — Billbad, Apr 10 '12 at 03:39
I think I'm going to use this - http://stackoverflow.com/questions/1595611/how-to-properly-create-a-custom-object-in-javascript — , Apr 10 '12 at 16:16

score 5 · Accepted Answer · 2012-04-09T20:54:44.467

5

You're doing two somewhat different things.

The first example creates a function object and assigns properties to it.
The second example creates a plain object with those properties.

The first one really doesn't make much practical sense in your example. You can use a function object to assign properties, but why would you? Those properties have no impact on the invocation of the function.

"Style-wise I like the Object Literal Notation because it provides enclosure."

I don't know what "enclosure" is. It sounds like a combination of encapsulation and closure, of which an object literal provides neither.

Getting back to the first part, imagine if you created any one of these objects...

var TextProcessor = new Number();
var TextProcessor = new Boolean();
var TextProcessor = new Date();

...and then assigned the properties to it. It would work, but it would be an odd thing to do. The fact that the object is a Number, Boolean, or Date has little relevance to the task at hand.

That's effectively what you're doing when you assign the properties to a Function object.

edited Apr 09 '12 at 20:54

answered Apr 09 '12 at 20:42

2

The first one can be used to create objects with `new`, the second cannot. – gen_Eric Apr 09 '12 at 20:45
2

@Rocket: But with respect to the properties being added to the function object, there's no impact on using the function as a constructor. If the function was intended to be used as a constructor to create objects with those properties, then the properties would need to be assigned to `this` inside the function body. – Apr 09 '12 at 20:46
1

I think by "enclosure" he wasn't trying to talk about any technical concept, just that all of the code is "enclosed" in `{}` rather than being a bunch of separate statements. Could be wrong though. – James Montagne Apr 09 '12 at 20:48
I'm leaning toward the first way actually... once I figure out how to implement inheritance..so I can abstract out the regexes into a "hold" object that is inherited by this and the other object I have that uses regexes....the first example would be an intermediary step in this direction..since I don't know how to implement inheritance yet....a bit off topic. – Apr 09 '12 at 20:54
@GuyMontag: Just be aware that they way you're doing it in the first example will have no impact on objects created using that function, whether directly or via inheritance. – Apr 09 '12 at 20:57
...I should have asked which is the best direction to go in...in the end I want a nice class "object" hierarchy – Apr 09 '12 at 21:04
I have no idea what you are doing in your example. – Apr 09 '12 at 21:14
@GuyMontag: I'm giving other examples similar to what you're doing with a `Function` object. The point is that it doesn't make much more sense to assign properties to a `Function` object than it does to assign them to a `Number`, `Boolean` or `Date` object. There *are* some cases where it does make sense, but they're outside the scope of what you're interested in right now. – Apr 09 '12 at 21:18
I will be implementing this soon....http://stackoverflow.com/questions/1595611/how-to-properly-create-a-custom-object-in-javascript – Apr 09 '12 at 22:52
@TheAllFoo: Yes, that's one place where properties on a function could be used. It's really just borrowing the function object as a namespace for data storage, but it can be handy in certain situations. – Apr 14 '12 at 23:09

Function vs. Object Literal Notaion - is there a diifference?

1 Answers1

Linked

Related