This section provides a tutorial example on how to use an 'Array' object as an 'Object' object named properties and methods.
As I mentioned in the previous section, "Array" is a subclass of "Object".
So an "Array" object can be used as an "Object" object:
Named properties can be added to "Array" objects.
Elements of an "Array" object are really indexed properties.
Named properties and indexed properties can be accessed using the associate array format.
Methods can be added as named properties or indexed properties.
Below is a JavaScript tutorial example showing you how to use an "Array" object as an "Object" object:
<html>
<!-- Object_Array_as_Object.html
Copyright (c) 2008 by Dr. Herong Yang, http://www.herongyang.com/
-->
<head>
<title>Using an Array as an Object</title>
</head>
<body>
<pre>
<script type="text/javascript">
// Using "this" to get the properties
function myToString() {
return '"'+this.title + '" by '+this.author;
}
// Creating an object of "Array"
var bookArray = new Array();
bookArray[3] = 2008;
bookArray[9] = "Programming";
// Adding named properties to "bookArray"
bookArray.author = "Herong Yang";
bookArray.title = "JavaScript Tutorials";
// Adding methods in 2 ways
bookArray.toString = myToString;
bookArray[4] = myToString;
// Checking "bookArray"
document.writeln();
document.writeln("About the \"Array\" object:");
document.writeln(" Type: "+(typeof bookArray));
document.writeln(" Instance Of Object: "
+(bookArray instanceof Object));
document.writeln(" Instance Of Array: "
+(bookArray instanceof Array));
document.writeln(" Array Length: "+bookArray.length);
// Looping through all properties and methods
document.writeln(" Members:");
var count = 0;
for (var item in bookArray) {
document.writeln(" "+item+": "+bookArray[item]);
count++;
}
document.writeln(" # of properties and methods: "+count);
// Calling its methods
document.writeln();
document.writeln("Calling its methods:");
document.writeln(" bookArray.toString(): "
+bookArray.toString());
document.writeln(" bookArray[4](): "+bookArray[4]());
</script>
</pre>
</body>
</html>
Here is the output of this tutorial example. Notice that as an "Array" object, "bookArray.length" returns 10 elements.
But it only has 6 properties and methods.
About the "Array" object:
Type: object
Instance Of Object: true
Instance Of Array: true
Array Length: 10
Members:
3: 2008
9: Programming
author: Herong Yang
title: JavaScript Tutorials
toString: function myToString() {
return "\"" + this.title + "\" by " + this.author;
}
4: function myToString() {
return "\"" + this.title + "\" by " + this.author;
}
# of properties and methods: 6
Calling its methods:
bookArray.toString(): "JavaScript Tutorials" by Herong Yang
bookArray[4](): "JavaScript Tutorials" by Herong Yang