Initializing an object inside another object fails in IE8

Question

I want to implement a sort of a singleton object (About in the example below), which by itself is inside another object (Main).

This is my code. It works in every major browser (Firefox, Chrome and even IE9) but not in IE8. In IE8, the call to main.About.doSomething(); throws 'Object doesn't support this property or method'.

I also jsFiddled my code here: http://jsfiddle.net/c3URh/12/

What do I need in order to get it to work in IE8?

Note: I can call main.About().doSomething() and it will work in IE8, but won't work in other browsers, and anyway it's incorrect from OOP perspective.

My buggy code:

function About(){
    this.doSomething = function(){
        alert('a');
    };
}

function Main(){
    var about;
    try {
    Object.defineProperty(this, 'About', {
            get: function () {
                if (about == undefined) {
                    about = new About();
                }
                return about;
            }
        });
    }
    catch (e) {
        // this code does not work in ie8. Throwing 'Object doesn't support this property or method'
        this.About = function() {
            if (about == undefined) {
                about = new About();
            }
            return about;
        };
    }
}

function clickMe()
{
    var main = new Main();
    main.About.doSomething();
}

score 3 · Accepted Answer · answered Feb 15 '12 at 17:49

IE8 does not support Object.defineProperty. So, the catch block's code is executed. In that block, you did not define a proper replacement for the About getter.

This (inside catch) is a function:

    this.About = function() {
        if (about == undefined) {
            about = new About();
        }
        return about;
    };

While you expecte it to be an instance of About. IE8 doesn't support getters, so you have to use another method. The closest you can get is:

    this.About = about == undefined ? new About() : about;

score 1 · Answer 2 · edited May 23 '17 at 12:16

1

Is that not because the defineProperty fails and therefore there is no About to add to? IE8 has only partial support for defineProperty which you could find via google or SO search: Working around IE8's broken Object.defineProperty implementation

http://blogs.msdn.com/b/ie/archive/2010/09/07/transitioning-existing-code-to-the-es5-getter-setter-apis.aspx

edited May 23 '17 at 12:16

Community

1
1

answered Feb 15 '12 at 17:49

mplungjan

169,008
28
173
236

score 1 · Answer 3 · answered Feb 15 '12 at 17:51

There are no getters before IE9 and this code is really funny looking. Using a getter to instantiate a private variable, and adding a check so it only does it the first time? That's what constructors are for.

function About(){
    this.doSomething = function(){
        alert('a');
    };
}

function Main(){
    this.About = new About();
}

var main = new Main();
main.About.doSomething();  // alerts 'a'

This doesn't solve your problem of how to implement getters in IE8 and below, but you were using it in a bad way anyhow

http://jsfiddle.net/mendesjuan/zPq4v/

Initializing an object inside another object fails in IE8

3 Answers3