JavaScript Basics
by James Lin
Intro
-----
JavaScript is, as the name suggests, a scripting language similar to Java.
Scripts are interpreted/executed when loaded by capable web browsers.
Unlike Java, it uses a prototype-based object model (rather than the more
common hierarchial class-based model), and since it does not require
loading a JVM, may be substantially faster for small tasks.
IMO, using JavaScript as an OOP is somewhat cludgy, and how the namespace
exactly works confuses me, so I usually use it for command programming (a
la C).
I will assume you are comfortable with HTML and have some prior programming
experience.
Functions
---------
functions are defined with the "function" keyword. e.g.:
function foo(bar)
{ // some code...
}
Functions may or may not return values.
Terminating semicolons in JavaScript are, in most cases, optional. It is,
however, better style to use them to ensure that the interpreter properly
parses the code.
Variables
---------
Since JavaScript is not a strictly typed language, no keywords are usually
necessary to declare variables. The "var" keyword may be used in
declaration, however, to force local declaration and to improve
readability. Variables declared without "var" are global, regardless of
their location in the code.
I think it's better style to use "var" always. If you want to make a
global variable, declare it outside of the functions.
Comments
--------
Comments are the same as in Java or C++. Multi-line comments are enclosed
within /* ... */ markers, and // precedes single-line comments.
Using with HTML
---------------
JavaScript is incorporated into a web page by surrounding the code with
<SCRIPT ...> ... </SCRIPT> tags. The syntax is:
<SCRIPT LANGUAGE=["JavaScript" | "JavaScript1.1" | "JavaScript1.2" |
... ]
[ SRC=[URL] ]>
<!--
[JavaScript code]
// -->
</SCRIPT>
The LANGUAGE attribute specifies which version of JavaScript the code uses.
Web browsers will not read code from versions greater than they are
designed for but will read code from previous versions. JavaScript
behavior may vary between versions, and the language version specified
determines which behavior is used. (See ARRAYS.)
NN 2.x, IE3.x support JavaScript (1.0)
NN 3.x supports JavaScript1.1
NN 4.0-4.05, IE4 support JavaScript1.2
NN 4.06+ supports JavaScript 1.3
The SRC attribute is optional and may be used to load an external file for
code. This may be useful to share the same code across multiple web pages.
The web server must be configured to support the JavaScript (.js) mime-
type, however. (Newer web browsers will handle .js files appropriately even
if the server is not configured for them.) If an external file is used,
code placed between the <SCRIPT ...> ... </SCRIPT> tags will be executed
-only- if there is an error opening the source file. Netscape 2.x does not
support the SRC attribute.
The code should be surrounded by HTML comment tags so that web browsers
that do not recognize the <SCRIPT ...> tags do not treat the code as
regular text. JavaScript code should not be placed on the same lines as
the comment tags..
The <SCRIPT ...> tags may appear anywhere in an HTML document, though
function and variable declarations should always appear within the
<HEAD> ... </HEAD> section to ensure that they are defined before any other
code accesses them.
Arrays
------
Arrays in JavaScript are objects, as in Java. Arrays, while present in
JavaScript1.0, were not very easily constructed or accessed. (I don't
remember exactly why.) If you use arrays, use JavaScript1.1.
To create an array, use the "new" constructor. Behavior varies depending
on the JavaScript version.
If LANGUAGE="JavaScript1.1" is used, the statement:
var foo = new Array(10);
creates a new Array object initially with ten elements. If
LANGUAGE="JavaScript1.2" is used instead, the same statement creates a new
Array object with one element, 10. Though this may seem a bit unintuitive,
this is consistent with alternate constructions such as:
var bar = new Array(37, 29, 52, "hike")
which creates an Array object of four elements. Yes, Arrays can store
mixed data types.
(The authors apparently realized that the 1.2 behavior is stupid and
reverted back to the more sensible 1.1 behavior for 1.3. (Actually, the
reason they switched back is because of ECMAscript, a standardized version
of JavaScript1.1.))
Arrays in JavaScript are also dynamic. The following will create an array
of four elements:
var baz = new Array();
baz[3] = "quux";
(Array indices start at 0, of course.)
JavaScript Arrays can also be indexed by strings representing an object's
name.
Control Statements
------------------
JavaScript has basic "if" and "else" statements like most C-style
languages. Boolean false, 0, and NULL are "false"; everything else is
"true."
JavaScript1.0 and 1.1 do not include a "switch" statement (argh...). One
was added in 1.2.
Stuff You Won't Find in C or Java
---------------------------------
JavaScript has a "with" statement that allows you to access several methods
or fields from a single object more easily. For example, the "document"
object has a method "writeln" that allows you to write a line of text to
it. Using the "with" statement, code like:
document.writeln("Hello");
document.writeln(" ");
document.writeln("world!");
can be written as:
with (document)
{ writeln("Hello");
writeln(" ");
writeln("world!");
}
(There obviously can be some ambiguity in some circumstances.)
Additionally, JavaScript, like many languages that are often interpreted,
has an "eval" function that will execute a string as if it were actual
code.
Testing
-------
Netscape Navigator is easily the best browser to use. (Since Netscape
created JavaScript, I would hope so.) Scripts seem to run more smoothly,
especially when using images, under NN than under IE. NN also has a built-
in interactive JavaScript interpreter; type "mocha:" in the location field.
(In NN4+, "javascript:" works too.)
... more stuff
___________________________________________________________________________
page updated: 2000-01-11 home . about . stuff . links
copyright (c) 2000 james lin
|