I'm trying to work out what is considered valid for the property name of a javascript object. For example

var b = {}

b['-^colour'] = blue;     // Works fine in Firefox, Chrome, Safari

b['colour'] = green;      // Ditto

alert(b['-^colour']);       // Ditto

alert(b.colour);            // Ditto

for(prop in b) alert(prop); // Ditto

//alert(b.-^colour);     // Fails (expected)

This post details valid javascript variable names, and '-^colour' is clearly not valid (as a variable name). Does the same apply to object property names? Looking at the above I'm trying to work out if

1. b['-^colour'] is invalid, but works in all browsers by quirk, and I shouldn't trust it to work going forward




2. b['-^colour'] is completely valid, but it's just of a form that can only be accessed in this manner - (it's supported so Objects can be used as maps perhaps?)




3. Something else

As an aside, a global variable in javascript might be declared at the top level as

var abc = 0;

but could also be created (as I understand it) with

window['abc'] = 0;

the following works in all the above browsers

window['@£$%'] = bling!;

alert(window['@£$%']);

Is this valid? It seems to contradict the variable naming rules - or am I not declaring a variable there? What's the difference between a variable and an object property name?