HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [160]
2. Get the city of origin.
Fortunately, you have a great function called getCity() that handles all the details of getting a city in the right format. Call this function and assign its value to the new variable from.
3. Get the destination city.
That getCity() function sure is handy. Use it again to get the city number you’ll call to.
4. Get the distance.
Because you know two indices, and you know they’re in the right format, you can simply look them up in the table. Look up distance[from][to] and store it in the variable result.
5. Output the response.
Use concatenation to build a suitable response string and send it to the user.
6. Get city names from the cityNames array.
The program uses numeric indices for the cities, but they don’t mean anything to the user. Use the cityNames array to retrieve the two city names for the output.
7. Run the main() function.
Only one line of code doesn’t appear in a function. That line calls the main() function and starts the whole thing.
I didn’t actually write the program in the order I showed it to you in the preceding steps. Sometimes it makes more sense to go “inside out.” I actually created the data structure first (as an ordinary table on paper) and then constructed the main() function. This approach made it obvious that I needed a getCity() function and gave me some clues about how getCity should work. (In other words, it should present a list of cities and prompt for a numerical input.)
Creating Your Own Objects
So far you’ve used a lot of wonderful objects in JavaScript. However, that’s just the beginning. It turns out you can build your own objects too, and these objects can be very powerful and flexible. Objects typically have two important components: properties and methods. A property is like a variable associated with an object. It describes the object. A method is like a function associated with an object. It describes things the object can do. If functions allow you to put code segments together and arrays allow you to put variables together, objects allow you to put both code segments and variables (and functions and arrays) in the same large construct.
Building a basic object
JavaScript makes it trivially easy to build an object. Because a variable can contain any value, you can simply start treating a variable like an object and it becomes one.
Figure 4-8 shows a critter that has a property.
Figure 4-8: This alert box is actually using an object.
Take a look at the following code:
//from basicObject.html
//create the critter
var critter = new Object();
//add some properties
critter.name = “Milo”;
critter.age = 5;
//view property values
alert(“the critter’s name is “ + critter.name);
The way it works is not difficult to follow:
1. Create a new Object.
JavaScript has a built-in object called Object. Make a variable with the new Object() syntax, and you’ll build yourself a shiny, new standard object.
2. Add properties to the object.
A property is a subvariable. It’s nothing more than a variable attached to a specific object. When you assign a value to critter.name, for example, you’re specifying that critter has a property called name and you’re also giving it a starting value.
3. An object can have any number of properties.
Just keep adding properties. This allows you to group a number of variables into one larger object.
4. Each property can contain any type of data.
Unlike arrays where it’s common for all the elements to contain exactly the same type of data, each property can have a different type.
5. Use the dot syntax to view or change a property.
If the critter object has a name property, you can use critter.name as a variable. Like other variables, you can change the value by assigning a new value to city.name or you can read the content of the property.
If you’re used to a stricter object-oriented language, such as Java, you’ll find JavaScript’s easy-going