How weird are JavaScript arrays? Really weird.
In most programming languages that I’ve worked with, arrays and objects are two different types. An array is a pie, and an object is a cake.
JavaScript is so object-oriented that it’s difficult to draw a line between the pie and the cake. In JavaScript, arrays are cheesecake. This can be disturbing, It can make some programmers angry. I’m going to ask you to try to remain calm. If I upset you, please, just walk away.
It all starts out normally (like the first scene of a Hitchcock film). No surprises yet. Let’s look at an object and an array.
var obj={"species":"dog","name":"buster"};
var arr=["dog","buster"];
alert(obj.species); //dog
alert(arr[0]); //dog
Pretty close. The object uses braces, rather than square brackets. While the object labels its elements, the array numbers them. You use dot notation to get at the info in an object, and the square brackets (array notation) to get at the info in an array.
Now it Starts to Get Interesting
We can also get at object values with this array-like syntax:
alert(obj["species"]); //dog
Now, our object looks almost like an array.
In most languages, arrays are optimized for speed. Each element is the same type and size and can be quickly accessed. In JavaScript, arrays are so loose that there’s really no speeding them up. Each array element can hold a different type.
arr[0]='pig';
arr[1]=true;
arr[2]=[5,2,7,3];
arr[3]={'a':1,'b':2};
An array element can even hold a function (or an array of functions)!
This is massively handy, if unusual.
Sit Down, I Have Something Scary to Tell You
I’m sorry, but it’s time for me to do something that may weird you out. Look at this…
arr["state"]=0;
That’s upsetting. Arrays can do more than just hold their numbered elements, they can also act just like objects, holding named values. If you want to kick something, or yell, I don’t blame you. If you need to take a few deep breaths, I understand.
You have a choice to make. You need to get all cold, steely, and rational and decide if it makes sense to take advantage of what JavaScript offers, or if you’re better off backing off and doing things the way you’d do them in other languages. That depends on your situation. Are you the only coder who will ever see the code? If you’re working with others, you may very well blow their minds if you treat an array like an object. Or maybe you’re working with some like-minded cheesecake aficionados.
Are You Insane?
But there are some very nice things you can do with this. Having all information that’s associated with the array (maybe even the array’s methods) live inside the array can make your code easier to deal with and understand, but only if you understand that an array is a cheesecake.
If you don’t take advantage of this, but you do want to keep everything associated with the array together, you’ll use an object to wrap everything up, and the array will be part of the object. This is more clear to the traditional thinker, but it does have a cost–the overhead of all the extra symbols you’ll be typing to access things.
Here are an array and an object, both designed to hold the same things.
var arr=[],obj={};
arr.state=0;
arr[0]='dog';
arr[1]='cat';
obj.state=0;
obj.data=[];
obj.data[0]='dog';
obj.data[1]='cat';
I can make a pretty good case that the array is “better” in this case, assuming you’re a big fan of cheesecake.
—
True Story.
I once took a cat into the vet. It was my first time there so I had to fill out a form. One of the things they wanted to know was the pet’s species.
Crap. I dug deep into the part of my brain that was supposed to be holding on to my high school Latin, but I just couldn’t quite get it. I made a stab–felis domesticatus–no, can’t be right.
I walked up to the lady at the desk.
“Do people really know this?”
“Know what?”
“The species of their pet.”
“Yeah, usually.”
I pointed at my cat. “What’s this?”
She blinked, then answered, “It’s a cat.”
Dreaming In JavaScript 