Javascript - object initializer?

Question

I've realized you can have a property in an object run automatically like this:

var obj = {

    init:(function(){ alert('loaded');})();

}

I'm trying to use this method as an initializer for the object. The problem I'm running into is passing a reference to 'obj' to the init property. I suspect it generates errors because the obj hasn't been completely built in browser yet. I'm trying to do the following, but unsuccessfully. If there's a way to do this, I'd love to know how.

var obj = {
    prop:function(){ alert('This just ran.'); },
    init:(function(){ obj.prop(); })();
}

Christoph · Accepted Answer · 2009-03-08 14:05:52Z

23

If you want to create multiple instances of similar objects, you should use plain old constructor functions (remember to put shared properties in the prototype!).

If you want to create a single object, consider using an anonymous constructor. Your example would read:

var obj = new (function() {
    this.prop = function() {
        alert('This just ran.');
    }

    // init code goes here:
    this.prop();
});

This has an additional benefit over object literals: the constructor function can be used as a closure over 'private' variables.

Don't overuse object literals: they may make simple things simple, but complex things will get overly complicated.

answered Mar 8, 2009 at 14:05

Christoph

171k36 gold badges186 silver badges241 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

JW. Over a year ago

Interesting. Do you know where I can find documentation on these anonymous constructors?

jacobq Over a year ago

@JW, I believe an anonymous constructor is just an anonymous function being used as a constructor (i.e. called with the new keyword). See also stackoverflow.com/questions/20057431/… and enfinery.com/30/javascript-the-case-of-an-anonymous-constructor

Maurice Perry · Accepted Answer · 2009-03-08 12:15:33Z

5

This is not possible: obj doesn't exist until the whole block is interpreted.

answered Mar 8, 2009 at 12:15

Maurice Perry

32.8k9 gold badges72 silver badges97 bronze badges

Comments

user1575313 · Accepted Answer · 2014-02-12 22:24:36Z

4

A simple alternative:

var obj = {

  init: function(){ 
    alert('loaded');
  }

}.init();

answered Feb 12, 2014 at 22:24

user1575313

411 bronze badge

1 Comment

nnnnnn Over a year ago

Noting that this sets obj to whatever value init() returns - which in this example is undefined.

James · Accepted Answer · 2009-03-08 12:46:06Z

3

Why don't you use the contructor model (actually, I have no idea of its correct name):

function Obj() {
    // Initialising code goes here:
    alert( 'Loaded!' );

    // ...

    // Private properties/methods:
    var message = 'hello',
        sayHello = function() {
            alert(message);
        };

    // Public properties/methods:
    this.prop = function() {
        sayHello();
    };

    // Encapsulation:
    this.setMessage = function(newMessage) {
        message = newMessage;
    };
}

Usage:

var instance = new Obj();
instance.setMessage('Boo');
instance.prop();

answered Mar 8, 2009 at 12:46

James

112k32 gold badges165 silver badges177 bronze badges

1 Comment

bobince Over a year ago

A reason for not initialising in the constructor is that you need to call the constructor every time you want a prototype (eg. to make a subclass) — function XObj() {...}; XObj.prototype= new Obj();. You don't really want to initialise an actual instance in this case.

axel22 · Accepted Answer · 2011-07-04 19:26:13Z

2

Yes, obj does not seem to exist locally till later. This worked for me with setTimeout. Tested ok on IE8, FF5, Chrome 12, Opera v11.5. Not sure about the 50 milliseconds though, I imagine it is enough.

var obj = {
    prop: function() { alert('This just ran.') },
    init: ( function(){ setTimeout(function(){obj.prop()},50) } )()
}

edited Jul 4, 2011 at 19:26

axel22

32.4k10 gold badges127 silver badges139 bronze badges

answered Jul 4, 2011 at 13:30

John

291 bronze badge

1 Comment

nnnnnn Over a year ago

This won't work if the next line after the var statement needs to use obj.prop.

tech-e · Accepted Answer · 2014-12-31 17:34:39Z

this is an update to the example submitted by user1575313.

the original code works but it limits the use of the object after setup. By returning the object reference in the init method it allows the object to be used outside the object.

link to jsFiddle. jsFiddle

var obj = {

init: function()
{ 
    alert('loaded'); 

    this.consoleLog(); 

    /* we want to return this to keep object 
    usable after auto init */ 
    return this;
}, 

consoleLog: function() 
{
    console.log(1); 
}

}.init(); 

/* the obj should now be usable outside the auto init */ 
obj.consoleLog();

Artem P · Accepted Answer · 2016-05-23 10:54:09Z

1

Init in jQuery-like style

(function() {

var $ = function(){
  return new $.fn.init();
};

$.fn = $.prototype = {
  init: function(){ 
    this.prop(); 
  },
  i: 0,
  prop: function(){ 
    alert('This just ran. Count: ' + (++this.i)); 
    return this;
  }
};

$.fn.init.prototype = $.fn;

$().prop().prop();

})();

jsbin.com

edited May 23, 2016 at 10:54

answered Sep 28, 2013 at 15:02

Artem P

5,3885 gold badges44 silver badges47 bronze badges

Comments

Andrew Hare · Accepted Answer · 2009-03-08 12:14:18Z

0

I think you want to try something like this:

var obj = {
    prop: function() { alert('This just ran.'); },
    init: function() { obj.prop(); }
}

Object literals reqire comma-separated members without semicolons.

answered Mar 8, 2009 at 12:14

Andrew Hare

353k75 gold badges649 silver badges642 bronze badges

2 Comments

Andrew Bullock Over a year ago

that wont run the init function on creation though

Andrew Hare Over a year ago

You are right - there isn't any way to do that with object literals.

Andrew Bullock · Accepted Answer · 2009-03-08 12:14:12Z

-1

Does it work if you pass "this" into the init function?

something like: (untested)

var obj = {
    prop:function(){ alert('This just ran.'); },
    init:(function(o){ o.prop(); })(this);
}

answered Mar 8, 2009 at 12:14

Andrew Bullock

37.6k38 gold badges166 silver badges241 bronze badges

2 Comments

Geuis Over a year ago

Nah. Passing (this) is a reference to window.object

Audrius Over a year ago

Not directly related, but you can quickly prototype and test stuff using jsfiddle.net

Collectives™ on Stack Overflow

Javascript - object initializer?

9 Answers 9

2 Comments

Comments

1 Comment

1 Comment

1 Comment

Comments

Comments

2 Comments

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

2 Comments

Comments

1 Comment

1 Comment

1 Comment

Comments

Comments

2 Comments

2 Comments

Linked

Related