You can also
combine the two techniques:
var fruit1= {name: 'banana', colour: 'yellow', price: 1.99};
var fruit2= {name: 'apple', colour: 'green', price: 1.49};
var fruit3= {name: 'mandarin', colour: 'orange', price: 3.12};
var fruit4= {name: 'orange', colour: 'orange', price: 2.05};
var fruits= [fruit1, fruit2, fruit3, fruit4];
alerts(fruits[3].colour); // displays 'orange'
(I've lined them up just to make them look nice to humans. The alignment doesn't matter)
Or, you can do it
all in a single step. I've broken it over several lines for readability, but the layout doesn't really matter to the computer, only to humans:
var fruits= [ {name: 'banana', colour: 'yellow', price: 1.99},
{name: 'apple', colour: 'green', price: 1.49},
{name: 'mandarin', colour: 'orange', price: 3.12},
{name: 'orange', colour: 'orange', price: 2.05} ];
alerts(fruits[2].name); // displays 'mandarin'
At first glance it's a bit of a
sea of commas, colons, semi-colons, quotes, curly brackets and square brackets, and can seem like a fruit-salad (ha, see what I did there?) of punctuation.
But if you think about each separate piece of syntax you've learned, the above example totally follows those rules and makes perfect logical sense.
It can just seem a bit dazzling at first.