JavaScript is a very interesting scripting language that has
nothing to do with Java. The name was chosen for marketing reasons.
I think
that it can be used as a first programming language
in high schools instead of Pascal.
It also can be (should be) used as Windows scripting language. The current
version is ECMA-262 revision 3 (aka JavaScript 1.5.). The most recent implementation of JScript is
JScript
.NET, which is based on the yet-unfinished version 4 of the ECMAScript
standard, and can be compiled for the
Microsoft .NET platform. JScript adds several new features to ECMAScript,
such as optional static type annotations.
We can create object manager that inherits all properties
(slots) of the Employee by using statement Manager.prototype = new Employee.
Paradoxically Microsoft did a lot to promote JavaScript (under
the name Jscript). Now Jscript can be used as Windows scripting language but
because Microsoft simultaneous promote its VBScript it never got a critical
mass. Javascript can also be used in Microsoft ASP instead of VBscript.
Nevertheless Microsoft OSes are unique in the fact that they
permit to use single scripting language for both command line,
ASP and HTML
scripting.
Using JavaScript in WSH you can now write script to automate common
tasks, and to create powerful macros and logon scripts. Microsoft web site (see
below) contains several documents that can be downloaded and redistributed at no
charge including Jscript reference.
Newer versions of JavaScript have good exception handling
capabilities. JavaScript 1.4 (which was only around in Netscape's server
products) introduced try catch exception handling
and throw exception throwing. JavaScript 1.5 which
was introduced in IE 5.5 further added the finally clause for
try catch.
A JavaScript object has properties associated with it. You access the
properties of an object with a simple notation:
objectName.propertyName
Both the object name and property name are case sensitive. You define a
property by assigning it a value. For example, suppose there is an object
named myCar (we'll discuss how to create objects later-for now, just
assume the object already exists). You can give it properties named make,
model, and year as follows:
myCar.make = "Ford"
myCar.model = "Mustang"
myCar.year = 69;
An array is an ordered set of values associated with a single variable
name. Properties and arrays in JavaScript are intimately related; in fact,
they are different interfaces to the same data structure. So, for example,
you could access the properties of the myCar object described above
as follows:
myCar["make"] = "Ford"
myCar["model"] = "Mustang"
myCar["year"] = 67;
Equivalently, each of these elements can be accessed by its index, as
follows:
myCar[0] = "Ford"
myCar[1] = "Mustang"
myCar[2] = 67;
This type of an array is known as an associative array, because each
index element is also associated with a string value. To illustrate how this
works, the following function displays the properties of the object, when
you pass the object and the object's name as arguments to the function:
function show_props(obj, obj_name) {
var result = ""
for (var i in obj)
result += obj_name + "." + i + " = " + obj[i] + "\n"
return result;
}
So, the function call show_props(myCar, "myCar") would return
the following:
myCar.make = Ford
myCar.model = Mustang
myCar.year = 67
Functions and Methods
Functions are one of the fundamental building blocks in JavaScript. A
function is a JavaScript procedure--a set of statments that performs a
specific task.
A function definition consists of the function keyword, followed
by
- the name of the function
- a list of parameters to the function, enclosed in parentheses, and
separated by commas
- the JavaScript statements that define the function, enclosed in
curly braces, {...}
In a Navigator application, you can use any functions defined in the
current page. It is generally a good idea to define all your functions in
the HEAD of a page. When a user loads the page, the functions
will then be loaded first.
The statements in a function can include other function calls defined for
the current application.
For example, here is the definition of a simple function named
pretty_print:
<![CDATA[function pretty_print(string) { document.write("</p>
<hr>
<p>" + string) } ]]>
This function takes a string as its argument, adds some HTML tags to it
using the concatenation operator (+), then displays the result to the
current document.
Defining a function does not execute it. You have to call the
function for it to do its work. For example, you could call the pretty_print
function as follows:
<![CDATA[<SCRIPT>
pretty_print("This is some text to display")
</SCRIPT>
]]>
The parameters of a function are not limited to just strings and numbers.
You can pass whole objects to a function, too. The show_props function from
the previous section is an example of a function that takes an object as an
argument.
A function can even be recursive, that is, it can call itself. For
example, here is a function that computes factorials:
function factorial(n) {
if ((n == 0) || (n == 1))
return 1
else {
result = (n * factorial(n-1) )
return result
}
}
You could call this function with an argument of one through five inside
a loop as follows:
for (x = 0; x < 5; x++) {
document.write(x, " factorial is ", factorial(x))
document.write("
")
}
The results would be:
0 factorial is 1
1 factorial is 1
2 factorial is 2
3 factorial is 6
4 factorial is 24
5 factorial is 120
Methods
A method is a function associated with an object. You define a
method in the same way as you define a standard function. Then, use the
following syntax to associate the function with an existing object:
object.methodname = function_name
where object is an existing object, methodname is the name you
are assigning to the method, and function_name is the name of the
function.
You can then call the method in the context of the object as follows:
object.methodname(params);
Using this for Object References
JavaScript has a special keyword, this, that you can use to refer
to the current object. For example, suppose you have a function called
validate that validates an object's value property, given the object,
and the high and low values:
function validate(obj, lowval, hival) {
if ((obj.value < lowval) || (obj.value > hival))
alert("Invalid Value!")
}
Then, you could call validate in each form element's onChange
event handler, using this to pass it the form element, as in the
following example:
<![CDATA[
<input TYPE="text" NAME="age" SIZE="3" onChange="validate(this, 18, 99)">
]]>
In general, in a method this refers to the calling object.
Creating New Objects
Both client and server JavaScript have a number of predefined objects. In
addition, you can create your own objects. Creating your own object requires
two steps:
- Define the object type by writing a function.
- Create an instance of the object with new.
To define an object type, create a function for the object type that
specifies its name, and its properties and methods. For example, suppose you
want to create an object type for cars. You want this type of object to be
called car, and you want it to have properties for make, model, year,
and color. To do this, you would write the following function:
function car(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}
Notice the use of this to assign values to the object's properties
based on the values passed to the function.
Now you can create an object called mycar as follows:
mycar = new car("Eagle", "Talon TSi", 1993);
This statement creates mycar and assigns it the specified values
for its properties. Then the value of mycar.make is the string
"Eagle", mycar.year is the integer 1993, and so on.
You can create any number of car objects by calls to new. For
example,
kenscar = new car("Nissan", "300ZX", 1992)
An object can have a property that is itself another object. For example,
suppose I define an object called person as follows:
function person(name, age, sex) {
this.name = name;
this.age = age;
this.sex = sex;
}
And then instantiate two new person objects as follows:
rand = new person("Rand McNally", 33, "M")
ken = new person("Ken Jones", 39, "M")
Then we can rewrite the definition of car to include an owner
property that takes a person object, as follows:
function car(make, model, year, owner) {
this.make = make;
this.model = model;
this.year = year;
this.owner = owner;
}
To instantiate the new objects, you then use the following:
car1 = new car("Eagle", "Talon TSi", 1993, rand);
car2 = new car("Nissan", "300ZX", 1992, ken)
Notice that instead of passing a literal string or integer value when
creating the new objects, the above statements pass the objects rand and ken
as the parameters for the owners. Then if you want to find out the name of
the owner of car2, you can access the following property:
car2.owner.name
Note that you can always add a property to a previously defined object.
For example, the statement:
car1.color = "black"
adds a property color to car1, and assigns it a value of "black". However,
this does not affect any other objects. To add the new property to all
objects of the same type, you have to add the property to the definition of
the car object type.
Defining Methods
You can define methods for an object type by including a method defnition
in the object type definition. For example, suppose you have a set of image
GIF files, and you want to define a method that displays the information for
the cars, along with the corresponding image. You could define a function
such as:
function displayCar() {
var result = "A Beautiful " + this.year
+ " " + this.make + " " + this.model;
pretty_print(result)
}
where pretty_print is the previously defined function to display a
string. Notice the use of this to refer to the object to which the method
belongs.
You can make this function a method of car by adding the statement
this.displayCar = displayCar;
to the object definition. So, the full definition of car would now
look like:
function car(make, model, year, owner) {
this.make = make;
this.model = model;
this.year = year;
this.owner = owner;
this.displayCar = displayCar;
}
[hint: use