'this' is undefined inside an Object in javascript accessing property of object by another property

Question

Type= {
        Container: $get('ctl00_Main_rbtnlst_Type'),
        Local: this.Container.getElementsByTagName('input'),
        Foreign:this.Container.getElementsByTagName('input')
    }

when i ran through this code inside firebug console i get error 'this.Container' is undefined even though it is defined. How else can i access the Container property inside the Local and Foreign property. I even tried this.

Type= {
        Container: $get('ctl00_Main_rbtnlst_Type'),
        Local: Container.getElementsByTagName('input'),
        Foreign:Container.getElementsByTagName('input')
    }

Answer 1

You can't get this while instantiating. You can do:

Type= {
        Container: $get('ctl00_Main_rbtnlst_Type'),
        Local: function(){return this.Container.getElementsByTagName('input');},
        Foreign: function(){return this.Container.getElementsByTagName('input');}
    }

And later on get Local or Foreign using Type.Local()/Type.Foreign()

or use this reduntant pattern if you need Local/Foreign within the instance:

Type= {
            Container: $get('ctl00_Main_rbtnlst_Type'),
            Local: $get('ctl00_Main_rbtnlst_Type')
                     .getElementsByTagName('input');},
            Foreign: $get('ctl00_Main_rbtnlst_Type')
                      .getElementsByTagName('input');}
        }

Or use this immediately executed function:

var Type = (function(){
   var container = $get('ctl00_Main_rbtnlst_Type'),
       local = container.getElementsByTagName('input'),
       foreign = container.getElementsByTagName('input');
   return {
           Container: container,
           Local: local,
           Foreign: foreign
          }
})();

and to be complete, you can also use a few getters , but that won't work in all browsers (especially not in IE<9)

var Type = {
    Container: $get('ctl00_Main_rbtnlst_Type'),
    get Local() {return this.Container.getElementsByTagName('input');},
    get Foreign() {return this.Container.getElementsByTagName('input');}
}

: Local and Foreign are the same, is that what you intended? ： Local和Foreign都是一样的，那是你的意图吗？

Answer 2

You can do this:

var container = $get('ctl00_Main_rbtnlst_Type');
Type = {
    Container: container,
    Local: container.getElementsByTagName('input'),
    Foreign: container.getElementsByTagName('input')
}

But what you probably want is this:

function Type(containerId){
    var container = $get(containerId);
    return {
        Container: container,
        Local: container.getElementsByTagName('input'),
        Foreign: container.getElementsByTagName('input')
    }
}

var obj = Type('ctl00_Main_rbtnlst_Type');
// can now use obj.Container, obj.Local and obj.Foreign