Applying JavaScript
JavaScript is a scripting language most often used for client-side
web development. It was the originating dialect of the ECMAScript
standard. It is a dynamic, weakly typed, prototype-based language
with first-class functions. JavaScript was influenced by many languages
and was designed to have a similar look to Java, but be easier for non-
programmers to work with. The language is best known for its use in
websites (as client-side JavaScript), but is also used to enable scripting
access to objects embedded in other applications (for example
Microsoft Gadgets in Windows Vista Sidebar).
Despite the name, JavaScript is essentially unrelated to the Java
programming language, though both have a common debt to C syntax,
and JavaScript copies many Java names and naming conventions. The
language was renamed from LiveScript in a co-marketing deal between
Netscape and Sun in exchange for Netscape bundling Sun's Java
runtime with their browser, which was dominant at the time. The key
design principles within JavaScript are inherited from the Self
programming language.
"JavaScript" is a trademark of Sun Microsystems. It was used
under license for technology invented and implemented by Netscape
Communications and current entities such as the Mozilla Foundation.
Common uses of JavaScript include:
opening new browser windows and "pop-up" message boxes
form validation (i.e. checking that a user has typed sensible
information into a web form before they are allowed to submit it)
image-swapping effects and dynamic "drop-down" navigational
menu systems
JavaScript is a scripting language, which means that JavaScript
code does not need to be compiled before it can be run. JavaScript
code can simply be embedded within the XHTML code of the web page
in which it is to be used. In this respect, JavaScript is similar to the PHP
scripting language.
The advantage of JavaScript is that both Netscape and Microsoft
Web servers have built-in interpreters. Both of these companies have
implemented this in a different fashion, but, as a Web developer, you
still have the ability to use the same language on the server-side that
they do on the client-side. The only real competitor to JavaScript in this
aspect is Java with its Java applet and servlet technology.
The platform-independence is probably the number one reason
to use JavaScript within your applications. True, there are some
environments that interpret JavaScript a bit differently, but the
majority of the language is processed the same. The code is
interpreted, so you can write it once and let the execution environment
interpret it.
The object-orientation An OO approach is a key part of your
Javascript/Ajax programming arsenal. There are multiple ways to
program Javascript in an object-oriented way. The Prototype library
adds some helper constructs to facilitate object orientation, as do
many other Javascript libraries. Regardless of which framework you
use (or if you choose to use none at all), an object-oriented approach
can make your Ajax programming easier.
Demonstrating a basic syntax for OO; you can use this syntax
literally, or use it to enhance your understanding of the various
framework-based OO approaches available out here.
• Class - in Javascript, classes are defined as functions. The "new"
keyword together with the function gives you new instances of the
class. Here's an example:
// a Person class
function Person (sName, nAge) {
this.sName = sName;
this.nAge = nAge;
}
// add a method to the class by adding a function to its prototype
Person.prototype.tellMe = function() {
return ("My Name is "+this.sName+". I am "+this.nAge+" years old");
}
That's all there is too it. You have now defined a class (Person),
with one method (tellMe).
Using the Object - to use the Person class we just defined:
var oPerson = new Person("Bob", 28);
alert (oPerson.tellMe());
The Basic Language Features
The best part of JavaScript is that it's forgiving, especially in
regards to data typing. If you start out with a string and then want to
use it as a number, that's perfectly fine with the language. (Well, as
long as the string actually contains a number and not something like
an email address.) If you later want to treat it as a string again, that's
fine, too.
One could also say that the forgiving nature of JavaScript is one
of the worst aspects of the language. If you try to add two numbers
together, but the JavaScript engine interprets the variable holding one
of them as a string data type, you end up with an odd string, rather
than the sum you were expecting.
Context is everything when it comes to JavaScript data typing,
and also when it comes to working with the most basic of JavaScript
elements: the variable.
This chapter covers the three basic JavaScript data types: string,
boolean, and number. Along the way, we'll explore escape sequences
in strings and take a brief look at Unicode. The chapter also delves into
the topic of variables, including variable scope and what makes valid
and meaningful variable identifiers. We'll also look at the influences on
identifiers that originate from the newest generation of JavaScript
applications based on Ajax.
Identifying Variables
Variables in JavaScript are much like those in any other
language; they're used to hold values in such a way that the value can
be explicitly accessed in different places in the code. Each has an
identifier unique to the scope of use (more on this later), consisting of
any combination of letters, digits, underscores, and dollar signs. There
is no required format for an identifier, other than that it must begin
with a character, dollar sign, or underscore:
_variableidentifier
variableIdentifier
$variable_identifier
var-ident
Starting with JavaScript 1.5, you can also use Unicode letters
(such as ü) and digits, as well as escape sequences (such as \
u0009) in variable identifiers. The following are also valid variable
identifiers for JS:
_üvalid
T\u0009
Expressions
An expression is any valid set of literals, variables, operators,
and expressions that evaluates to a single value. The value may be a
number, a string, or a logical value. Conceptually, there are two types
of expressions: those that assign a value to a variable, and those that
simply have a value. For example, the expression
x = 7 is an expression that assigns x the value 7. This expression itself
evaluates to 7. Such expressions use assignment operators. On the
other hand, the expression 3 + 4 simply evaluates to 7; it does not
perform an assignment. The operators used in such expressions are
referred to simply as operators.
JavaScript has the following kinds of expressions:
Arithmetic: evaluates to a number, for example
String: evaluates to a character string, for example "Fred" or
"234"
Logical: evaluates to true or false
The special keyword null denotes a null value. In contrast, variables
that have not been assigned a value are undefined, and cannot be
used without a run-time error.
Conditional Expressions
A conditional expression can have one of two values based on a
condition. The syntax is
(condition) ? val1 : val2
If condition is true, the expression has the value of val1, Otherwise it
has the value of val2. You can use a conditional expression anywhere
you would use a standard expression.
For example,
status = (age >= 18) ? "adult" : "minor"
This statement assigns the value "adult" to the variable status if
age is eighteen or greater. Otherwise, it assigns the value "minor" to
status. And this also supported by the statements:
1. Conditional Statement – in JavaScript consist only of one
statement: the IF statement:
2. Loop Statement - A loop is a set of commands that executes
repeatedly until a specified condition is met. JavaScript supports
two loop structures: for and while. In addition, the break and
continue statements are used specifically with loops.
3. For Statement - A for loop repeats a loop until a specified
condition evaluates to false. The JavaScript for loop is similar to the
Java for loop and the traditional for loop in C. A for statement
looks as follows:
for ([initial-expression;] [condition;] [increment-
expression]) {
statements
}
4. While Statement - A while statement repeats a loop as long as a
specified condition evaluates to true. A while statement looks as
follows:
while (condition) {
statements
}
5. Break Statement - The break statement terminates the current
while or for loop and transfers program control to the statement
following the terminated loop.
break statement that terminates the while loop when i is 3, and then
returns the value 3 * x. function testBreak(x) { var i = 0 while (i)
Built in Browsers – the Frames
HTML gives you the possibility to split the window of the browser
into several frames. Each of these frames forms a window of its own
within the content window (or within other frames).
I use frames on this site: I split up the browser window in which you've
loaded this site into three frames: the logo frame above, the navigation
frame on the left and the content frame on the right.
Each frame holds a separate HTML document. You can add
JavaScripts to each of these pages and they will work inside that page.
You can also write scripts that influence other frames or even other
browser windows, for instance loading new pages into the frame, or
calling a script that resides in another frame.
Names and targets
First of all, you should give your frames a name:
<frame src="whatever.html" name="content">
You can use this name both in HTML and in JavaScript. HTML has the
TARGET attribute with which you can specify the frame in which a page
should be loaded:
<a href="the_page.html" target="content">
Now if someone clicks the link, the_page.html is loaded in the frame
named content. The TARGET attribute is very versatile: it searches in
all open frames and windows for the frame with name content and
loads the page into it.
Doing the same in JavaScript is more difficult. JavaScript also knows
the names of all the frames, but naming the name only is not enough:
you should also specify where in the frame tree the frame is.
The frame tree
When you create frames, you also create a frame tree. Each frame is
loaded inside another frame or inside the top window, and when you
use cross-frame JavaScript, you'll have to specify the path that leads to
the frame you want to influence. So first of all you need to understand
the frame tree. At the top of the frame tree there's always the window
in which the frames are opened, JavaScript calls this frame top. And
the new application of JavaScript have been use in many ways, as we
know of its uses. This not only for a gaming programs but also like any
interactive programs in gaming.
