Javascript property exist and scope
I try to create a few objects like this:
Object_level_1 = Ext.extend ( Ext.util.Observable, {
PropA: null,
ProbB: null,
initComponent: function () {
Object_level_1.superclass.initComponent.call ();
},
setValue: function ( name, value ) { // it will come as 'PropA', 45
if ( this.hasOwnProperty ( name ) ) { // ' fixed base on dtan answer
// here is a problem 1
// how I can access correct property and set it up
// problem 2
// How I set up property value of right property by having variable name
this.fireEvent ( 'U开发者_如何学JAVApdate_on_level_1' );
}
}
}
Object_level_2 = Ext.extend ( Object_level_1, {
PropC: null,
ProbD: null,
initComponent: function () {
Object_level_1.superclass.initComponent.call ();
},
setValue: function ( name, value ) { // it will come as 'PropA', 45 or 'PropC', 100
Object_level_2.superclass.setValue ( name, value );
if ( this.hasOwnProperty ( name ) ) { // ' fixed base on dtan answer
// here is a problem 1 again
// how I can access correct property and set it up
// problem 2 again
// How I set up property value of right property by having variable name
this.fireEvent ( 'Update_on_level_2' );
}
}
}
Does someone know the solution?
Actually, I spotted errors in the code:
- Always declare
var
when creating variables - When calling parent's method, use
ClassName.superclass.methodName.call(this, arg1, arg2..)
. It's important to pass thethis
because it will change the scope of the called parent's method to the scope of current object. (You can remove thethis
in my following testing code to see the different outputs). - Normally I declare
this.addEvents
ininitComponent
before using the events. Not sure if it's necessary.
Here is my full testing codes with outputs:
var Obj1 = Ext.extend(Ext.util.Observable, {
propA: null,
propB: null,
initComponent: function() {
Obj1.superclass.initComponent.call(this);
},
setValue: function(name, value) {
if (name in this) { //Used dtan suggestion
this[name] = value;
console.log(this.propA, this.propB, this.propC, this.propD);
}else{
console.log(name+" is not in Obj1");
}
}
});
var Obj2 = Ext.extend(Obj1, {
propC: null,
propD: null,
initComponent: function() {
Obj2.superclass.initComponent.call(this);
},
setValue: function(name, value) {
Obj2.superclass.setValue.call(this, name, value);
}
});
var obj1 = new Obj1();
var obj2 = new Obj2();
obj1.setValue('propA', '1a'); //1a null undefined undefined
obj1.setValue('propB', '1b'); //1a 1b undefined undefined
obj2.setValue('propC', '2c'); //null null 2c null
obj2.setValue('propD', '2d'); //null null 2c 2d
obj1.setValue('propA', '1a'); //1a 1b undefined undefined
obj1.setValue('propB', '1b'); //1a 1b undefined undefined
obj1.setValue('propC', '1c'); //propC is not in Obj1
obj1.setValue('propD', '1d'); //propD is not in Obj1
obj2.setValue('propA', '2a'); //2a null 2c 2d
obj2.setValue('propB', '2b'); //2a 2b 2c 2d
obj2.setValue('propC', '2c'); //2a 2b 2c 2d
obj2.setValue('propD', '2d'); //2a 2b 2c 2d
Try to read how ExtJS developers write their code in the src
folders. You will see the correct usages of Ext.extend
try adding this to your if
statement:
if ( name in this && this.hasOwnProperty(name) && this[name]) {
this.fireEvent ( 'Update_on_level_2' );
}
the the the this[name]
i believe is more for IE b/c I have read that it has some problems with hasOwnProperty
on its own (this might be a legacy thing though for IE6 and not be much of a problem for the newer versions).this[name]
is there to make sure your property has a value. If you don't care that the value is false
or null
, then that portion can be taken out. Also, the hasOwnProperty
method excludes properties from the prototype
, which sounds like what you are going for.
edit. as per @Pointy's comment below.
精彩评论