Last night I reached the new Open UI chapter on Property Sets. It describes that Property Sets have a new structure under Open UI.
New Structure
A traditional property set consists of four parts: Type, Value, Properties, Child Property Set
An Open UI Property Set, exposes 4 new interesting parts to this existing structure
This is documented in Bookshelf here
childArray
As Bookshelf states, it’s just an Array that holds references to all the child Property Set objects. It stores the same object that is returned by GetChild.
childEnum
This looks like it should contain a count of child Property Sets. But it incorrectly displays 0, as can be seen in our test case below.
propArray
If you follow the namesake, you would think this property is an Array like childArray, but read the Bookshelf description carefully, and you will see that this is actually an Object ...but inspect the "Object" in the browser more carefully, and you’ll see that it is actually an Array!. It’s like asking a couple of people on the street for the location of a landmark, and they point in opposite directions!
So which source do you believe? Bookshelf or the Browser inspector? In this case both, functionally the former, but technically the latter.
What we have here is an Associative Array, Arrays and Objects can be used in similar ways. Arrays are usually indexed, and the standard way to iterate through them is a "for" loop. Objects don’t have an index, but use keys, and they are enumerated using the "for in" loop.
var myArray=["Dieter","Thomas"]; var myObject={"Composer":"Dieter","Singer":"Thomas"}; var myAssocArray=[]; myAssocArray["Composer"]="Dieter"; myAssocArray["Singer"]="Thomas"; console.log( "for i myArray" ); for(var i=0;i<myArray.length;i++){ console.log( "\t"+i+" "+myArray[i] ); } console.log( "for in myObject" ); for(var key in myObject){ console.log( "\t"+key+ " "+myObject[key] ); } console.log( "\t"+"myObject.length=" + myObject.length ); console.log( "for in myAssocArray" ); for(var key in myAssocArray){ console.log( "\t"+key+ " "+myAssocArray[key] ); } console.log( "\t"+"myAssocArray.length=" + myAssocArray.length );
Result:
Note: the Array constructor doesn't allow us to create Arrays with default keys. You have to create the Array first, then add the keys manually.
The bottom line is that an Associative array behaves like an object, but it is not intuitive and is even considered harmful. Make a mental note about this property and treat it like an Object.
With traditional Property Sets, you would need to use the following to iterate through the properties.
var propName = oPS.GetFirstProperty(); while (propName != "") { try { var propValue = oPS.GetProperty(propName); console.log(propName+"="+propValue); }catch (e) {} propName = oPS.GetNextProperty(); }
With Open UI Property Sets, you can now do the following.
for(var key in oPS.propArray){ console.log(key+"="+oPS.propArray[key]); }
Feels weird, but it works, and Property Sets are now less clunky to deal with. Nice!
propArrayLen
This contains a count of propArray
To visualise how these new Property Sets are represented, the following test case reveals the structure, and allow us to inspect the object in the browser.
var ps=theApplication().NewPropertySet(); var psChild1=ps.Clone(),psChild2=ps.Clone(); ps.SetType("Parent"); ps.SetValue("ParentValue"); ps.SetProperty("Mum","Georgette"); ps.SetProperty("Dad","George"); psChild1.SetType("Child 1"); psChild1.SetProperty("Name","Bob"); psChild1.SetProperty("Gender","Male"); psChild2.SetType("Child 2"); psChild2.SetProperty("Name","Jane"); psChild2.SetProperty("Gender","Female"); ps.AddChild(psChild1); ps.AddChild(psChild2);
Result in Fire fox:
This screen shot only shows the additional elements as documented by Bookshelf. The new Property Set is backwards compatible with the old version and traditional Property Set API calls such as GetChild, and GetProperty still works (mostly).
In the next article on Open UI Property Sets, we'll visit some of the new methods, and expose some of the broken methods!.
Stay tuned for the next episode of Open UI: Property Set - Methods
Next Article
0 comments:
Post a Comment
Comments are open to all, please make it constructive.