Objects, Properties, and MethodsUp to this point you have seen how JavaScript creates and manipulates data values that you explicitly declare. You define variables, populate them with numeric and string data, and use various operators and statements to process the data for the results you want. Coincidentally, and with little explanation, you have also used various language elements that are "built into" JavaScript. You have used Alert and Confirm boxes, forms elements, documents, windows, mathematical and string functions, and other features of the JavaScript environment that are there for your use without your having to do anything special to create or use them. You have, in fact, been using various JavaScript objects to assist in your processing."Objects," in the formal sense of the term, are the "nouns" of the JavaScript processing environment. They include the windows in which you work, the documents you display, the forms you process, the variables you declare. Associated with these objects are properties. In other words, objects have characteristics that describe them. For example, a window has size, shape, and frame properties that describe how it looks; a document has a background color, text style, and form components that describe it; a form has characteristics given by the kinds of data fields and buttons defined for it. Throughout the JavaScript environment are various objects and their properties that are used to put together a processing application. Objects also have methods associated with them. Methods are the "verbs" of the processing environment. They are the actions associated with the objects--functions that the objects can perform. For example, documents have open, close, and write methods. That is, a document can be opened in a window, it can be closed and removed from a window, and it can be written to. A button has a click method associated with it such that some action can be taken when it is clicked. A text string, even, has several methods associated with it to change its properties or to find particular substrings. Thus, JavaScript objects--those that are built into the language and those that you create when writing scripts--have properties that describe them and methods that manipulate them. As a script author, you can change the properties and use the methods to help you carry out your processing. Referring to Object Properties and MethodsYou refer to an object's property with the notation:objectname.propertyname That is, an object's property is referenced by appending the property name to the object name with a period (.). For example, length is one of the properties of a text string. So, if you declare the variable: var TextString = "This is a string." you refer to its length property as TextString.length If you display this property, say, in an Alert box: alert ("\nThe length of TextString is " + TextString.length) the following message is displayed:
You refer to an object's methods in the same way. For example, one of the methods associated with a text string is named toUpperCase ( ). This is a method (a built-in processing "function," if you wish) to change the characters in a string to all upper case letters. If you want to apply this method to the above TextString variable, you would do so with the notation: TextString.toUpperCase ( ) You append the name of the method to the name of the object with a period.
Some of the properties of objects can be changed; others cannot. Some objects have numerous methods associated with them; other do not. We'll proceed through each of the objects in the JavaScript environment, detailing their properties and methods and, along the way, describing how to access and use them. We'll begin with the so-called "built-in" objects, those that are part of the browsing environment irrespective of the particular windows, documents, forms or other objects that might be associated with your application. On subsequent pages we'll discuss those objects that depend somewhat on the features that you build into your web pages. The navigator ObjectThe navigator object is a reference to the browser being used to view a web page. This object has five properties as named and described in the following table. For each property, a button is provided to display the property for the browser you are currently running:onclick = alert ( "\n" + navigator.property ).
There are no methods associated with the navigator object. However, you can use the property information to help you adapt your scripts to different browsers. For instance, you can check the appVersion property to see if the browser being used is version 3.0. If so, then you can include JavaScript statements that take advantage of its capabilities. On the other hand, if you find out that the user's browers is not the latest version, you can either skip the statements or do something different. The following script illustrates this idea:
<SCRIPT> This script uses a string method named indexOf ( ) (which we'll discuss later) to see if the character string "3.0" is included somewhere within the appVersion property. If it is, the method returns the position in the string where this substring is located; if not, it returns a value of -1. So, if the returned value is not -1, we know that "3.0" is somewhere within the appVersion property string. The if statement makes this test and then either runs the code for browser version 3.0 or runs the code for an earlier version. You could also check this property for the substring "Win" to see if the user is running in a Windows environment. Objects and InstancesA JavaScript object exists as an "idea" and as a "reality." If this sounds a little Platonic, it really is. There is the abstract, ideal Form of an object, and there is the the everyday, tactile reality of a particular object based on that Form. In JavaScript, the first of these is called an object class; the second, an object instance. The object class exists as a model, or blueprint, for creating objects; the object instance is the actual object created by your browser when you open a web document.In most cases, an object instance is created for you. For example, when you open a web page, the browser automatically creates an instance of a document object based upon the document class. Using the document class as a blueprint, the browser creates your particular document instance containing all the properties and methods associated with the document class from which it was built. In other cases, you must create an object instance before you can access any of the associated properties and methods. This was the case on the previous page when you created an array. JavaScript has an array class--a general definition of an array, or a general model for its structure and use; you needed to create an instance of that array class--an actual array based on that blueprint--to make it accessible by your scripts. Don't get too bogged down in trying to differentiate classes from instances. This is not a tutorial on object-oriented programming (OOP) where you need of firm grasp of these concepts. Still, there are instances (the old-fashioned kind) where you will need to create an instance (the new-fashioned kind) of an object before using it. When that happens you should know, simply, that you are creating an actual object from the JavaScript blueprint. The Date ObjectOne object that is not automatically created for you is the Date object. You have to fashion an instance from the Date class before you can work with dates and times. This is done by assigning a new instance of the class to a name:TheDate = new Date ( ) This command gets the current date and time from the computer and makes them available through the name TheDate (or any other name you wish to assign). This particular command is a script element in this document, and the instance TheDate is referenced in the examples below. The date object doesn't have any properties associated with it, but it does have several methods. A method is referenced in the same way as a property--by appending it to the name of the object with a period: TheDate.method ( ) The following table lists some useful methods associated with the Date object. (You may need to refresh your screen to update a method if you click on a button more than one time.)
The Math ObjectThe Math object includes properties and methods to perform mathematical calculations. The properties include mathematical constants; the methods include mathematical computations. Both can be used in combination with the mathematical operators that we covered earlier.
One quick example of the use of these constants: the area of a circle is given by Area = Math.PI * Radius * Radius ( Area = pi * radius2 ). The following table gives the Math methods. The general format of these methods is: Math.method ( parameter ) where the value to which the method is applied (a variable, literal, or mathematical expression) is enclosed as a parameter within the parentheses.
The String ObjectEach string object that you create in a script (either a literal or variable string) has properties and methods associated with it. These are listed in the following tables. As with previous properties and methods, the dotted format is used:
object.property Some of the string methods are passed parameters, which appear between the parentheses; some have no parameters.
Several of the string methods are used to format text when writing to an HTML document. These can be illustrated by opening a new, secondary document and writing the strings to it. The following script is used for this example:
<SCRIPT>
That pretty much covers the properties and methods associated with JavaScript's built-in objects. Beginning on the next page we'll start looking at those objects for which instances are created when you call for them in your scripts.
Contents
Next
| |
