JavaScript Expressions...
Contents
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Introduction
This section is very important. The language depends on
expressions to do perform calculations and to decide what to do
next.
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Variables
A programming language offers variables to hold and manipulate
values.
A variable is a programmer's box. Anytime a value needs to be kept,
a variable is created. Variables are essential to software development.
Consider the following example two buttons:
In order for the close window button to work, it must have a window
object to work on. Hence when the window object is opened we need
to hold on to a variable (put the object in our programmer's box
for later use).
In JavaScript a variable is declared as follows:
The above statement tells JavaScript that we have defined a variable
called wWindow. A variable can hold anything (a window object, a
document object, just a number...). We give it a name, so that we
can refer to it later on by its name.
Note: It is a good idea to use meaningful names for variables,
and not to use existing JavaScript object or command names.
We can assign a value to the variable
using the = operator:
wWindow = "This is not really a window object, just a
text string"
wWindow = 10
wWindow = window.open("JAVDEMO.HTM", "WindowName",
"height=150,width=250,height=200,resizable=1")
The last example statement is what we use to hold on to the window
object opened. The window.open()
method of the window
object hands over to us the object just created, this is called
returning, the window.open() returns a window object
to us and we assign the object to our variable we
called wWindow.
Once we have assigned a window object to the variable, we can call
some of its methods:
JavaScript Variable Naming Rules
A JavaScript identifier name must start with an alphabetic character
(a .. z, A .. Z) or underscores, then it can contain numbers too.
w123a is a valid variable name, spaces are not allowed. Underscores
are allowed, and are sometimes used to separate words in a variable
name. The use of upper case is encouraged, underscores discouraged.
For example: myVariable is preferable to my_variable.
JavaScript Arrays
This link expalins JavaScript
arrays. Appologies for making it a link, a complete explanation
of arrays will be inserted here soon.
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Literals & Data Types
A literal is a fixed value. For example my EMail address can be
expressed as a literal: "jacques@dial.pipex.com".
The bit between the double quotes is a literal. Numbers can also
be literals: 3.14
Literals are usually passed to object method parameters,
or assigned to variables.
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
String Literals
Strings are what most people refer to as text. If we wish to give
a string value to a variable, the JavaScript interpreter
needs to know when a string starts, and when it ends. Otherwise
it might include too many spaces, or trailing information which
is meant to go into another value. For example:
wWindow = window.open("JAVDEMO.HTM", "WindowName",
"height=150,width=250,height=200,resizable=1")
The above statement contains three strings.
In JavaScript, you can use the single quote and double quotes to
enclose a string. Sometimes we wish to put a quote within our text
string. In this case we can escape the quote. For example:
<SCRIPT LANGUAGE="JavaScript">
var quote = "\"To be or not to be<BR>That is the
question\""
document.write(quote)
</SCRIPT>
Displays the following quote:
The escape character can be used to represent characters which
are hard to put in a string:
- \b is a backspace
- \f is a form feed (throws a page on a printer)
- \n is a newline
- \r is a carriage return
- \t is a tab character
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Integer And Floating Point Literals
Programmers deal with two main types of numbers. Whole (integer)
numbers, and real (floating point) numbers.
Integer numbers do not have a decimal part. 12 is an integer, so
is -12, but 12.1 is a floating point number, because it has a decimal
part.
Integer numbers can be represented in a variety of useful
ways. For example I can never remember what three bytes set
to 255 make as one large number. But in Hexadecimal notation this
is easy to remember, and good for setting a white color.
- An integer has no leading zero, and can have a leading sign
to represent negative numbers.
- An octal number is preceeded by a zero, a leading sign is allowed.
- A hex number is preceeded by a leading zero and an X (or x)
a leading sign is allowed.
Hence 16777215 is the same as 077777777 as 0xFFFFFF, which is three
bytes with all its bits set to 1. In JavaScript we can use any of
these three notations to represent an integer literal.
When dealing with octal or hexadecimal representations, putting
a leading negative sign is rare. This is because the main reason
for using these representations is to have a good idea of the bytes
which make up the number. Putting a negative sign can affect the
bits in each byte of the number.
Floating point numbers are identified by containing a '.'
or E or e
The code used to display the above is:
<P><SCRIPT>document.write("3.1 is ",
3.1, "<br>")</SCRIPT></P>
<P><SCRIPT>document.write("3E1 is ",
3e1, "<br>")</SCRIPT></P>
<P><SCRIPT>document.write("3.1E-2 is ",
3.1E-2, "<br>")</SCRIPT></P>
<P><SCRIPT>document.write("3E-1 is ",
3E-1, "<BR>")</SCRIPT></P>
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Boolean Literals
A boolean type can have one of two values: true or false. It's
a very handy type in programming. There are many uses for boolean
types, which are explained in the conditional
statements later on. The window.confirm()
method shows another use for boolean types
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Expressions And Operators
Expressions in programming terms are ways of expressing formulae
or calculations. Programming languages have many data types (as
explained in the Literals section, we have
String types, boolean, integer ...). The result of a calculation
can also have different data types, depending on what is being calculated:
- " Hello" + " " + "World"
is a string expression, producing a string
- 1 + 2 + 3 is a numerical expression producing an
integer
- 1 > 4 is a boolean expression producing a boolean result
In order to write down expressions we need operators ( +, -, >,
....). we also need operators to assign values, or values of expressions
to variables. The assignment operator =
does this:
myVariable = 1 + 2 + 3 assigns the result of 1 + 2
+ 3 to the variable myVariable. So myVariable holds 6
Sometimes we want to write a complex expression. Programming languages
allow the use of round brackets to allow the programmer to state
more clearly what to do, and in what order. Consider the following
examples:
2 * 5 + 2 is two times five, plus two: 12
2 * (5 + 2) is two times (five plus two): 14
There is what is known as a precedence of operators at work here.
Knowing which bit is done first is not always easy, as a rule of
thumb: if in doubt, bracket it!
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Operators
Operators combine what is to the left with what is to the right,
to produce a result. For example 1 + 3 produces 4. Operators are
an essential part of expressions. There
are many things we could want to do with symbols, some we want to
add, others need their bits twiddled. A variety of operators are
made available to the perform specific tasks.
Arithmetic Operators
Addition uses +
Subtraction uses -
Multiplication uses *
Division uses /
Modulus uses %
Modulus produces the remainder of trying to divide two numbers
without going fractional. For example 20 % 3 gives 2. Because
6 threes go into 20, giving a remainder of 2
Unary Negation uses -
If we want to represent a number as negative we precede it with
a -. For example -100 degrees centigrade is cold, whereas 100
is very hot.
The special ++ and -- operators are discussed in the assignment
operator section.
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Bitwise Operators
These operators in JavaScript are used to perform binary operations
on numbers: perform bit twiddling. In most cases these operators
are not used.
Because JavaScript treats all numbers as the same (whether they
are floating point or integral), it has to do some work before performing
a bitwise operation: floating point numbers are stored in a
way totally differently to integrals. JavaScript converts the operands
into 32 bit numbers, performs the bitwise operation, then returns
a number.
JavaScript provides bitwise operators to do the following:
- Bitwise and uses &
- Bitwise or uses |
- Bitwise exclusive or uses ^
For example:
15 & 3 should give 3
15.9 & 3 gives I don't know what! Floating point
number are not generally used when dealing with individual bits.
JavaScript also provides bitwise shift operators. WIth these it
is important to realise that the value on the right of the operator
determines how many times to perform the operation on the value
to the left. For example 9>>2 shifts 9 two binary places to
the right.
- Bitwise left shift uses <<, the bits lost on the left
are lost. The new bits on the right are set to zero
- Sign propagating right shift uses >>, 9>>2 gives
2 but -9 >> 2 gives -3 (bits going off to the right are
lost, but the left most bit is preserved, so a negative number
will remain negative).
- zero fill right shift uses >>>, new bits on the left
are set to zero, so negative numbers instantly become positive.
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Logical Operators
Logical operators allow finding out if a condition is true or false
(boolean). These are essential parts of
programming.
JavaScript uses the following operators:
&&
|
Logical AND. true && true is true. true and
false is false
|
||
|
Logical OR. true || true is true, true || false is true
|
!
|
Logical NOT !true is false !false is true
|
==
|
Logical == : Do they equal each other? true
== true is true, but true == false is false (they are not
the same).
|
>
|
Logical greater than. 10 > 1 is true, 1 > 10
is false
|
>=
|
Logical greater or equal to. 10 >= 1 is true 10 >=
10 is also true
|
<
|
Logical less than. 1 < 10 is true, 10 < 1
is false
|
<=
|
Logical <=. 10 <= 10 is true
|
!=
|
Logical NOT Equal. 10 != 1 is true (they are not
equal). 10 != 10 is false, they are equal
|
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
String Operator
The string type is special. It has
only one valid operator (in addition to the assignment operator).
It is +, this operator allows us to build up text.
The += and = assignment operators are also
allowed
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
Assignment Operators
If we want to assign the value of a calculation to a variable,
we need an assignment operator to do this.
Javascript has many assignment operators. Some are very much like
C (and C++ and Java). Here is a list of all the assignment
operators:
Frequently Used
=
|
The assignment operator, the result of the calculation
on the right of the = operator is assigned to the variable
to the left of =. For example a = 5 + 3 sets the variable
a to 8
|
+=
|
Shorthand. Adds to the variable on the left of the += operator
the result of the expression on the right of the operator.
For example a += 3 + 4, is the same as a = a + (3 +
4): it sets a to whatever it was plus 7
|
-=
|
Shorthand. Subtracts from the variable on the left of the
-= operator the result of the expression on the right of
the -= operator. Example: a -= 7 is the same as a = a -
7
|
*=
|
Shorthand. Multiplies the variable on the left of the *=
operator by the result of the expression on the right of
the *= operator. a *= 5 + 2 is the same as a = a *
(5 + 2)
|
/=
|
Shorthand. Divides the variable on the left of the /= operator
by the result of the expression on the right of the /= operator.
a /= 5 + 2 is the same as a = a / (5 + 2)
|
%=
|
Shorthand. Takes the remainder of the integer division
of variable on the left of the %= operator by the result
of the expression on the right of the %= operator. a %=
5 + 2 is the same as a = a %(5 + 2)
|
Rarely Used
<<=
|
Shorthand. a <<= 2 + 3 is the same as a = a
<< (2 + 3)
|
>>=
|
Shorthand. a >>= 2 + 3 is the same as a = a
>> (2 + 3)
|
>>>=
|
Shorthand a >>>= 2 + 3 is the same as a =
a >>> (2 + 3)
|
&=
|
Shorthand. a &= (2+ 3) is the same as a = a & (2
+ 3)
|
^=
|
Shorthand. a ^= (2 + 3) is the same as a = a ^ (2
+ 3)
|
|=
|
Shorthand. a |= (2 + 3) is the same as a = a | (2
+ 3)
|
Frequently Used
The following operators are not classified as assignment operators,
they modify variable contents nevertheless.
The above two operators are special in the way they work. They
can be used as prefix or postfix operators. They
add (for ++) or subtract (for --) one from the variable they
immediatly prefix or postfix.
A prefix operator modifies the variable to which it refers, before
the rest of the expression gets to it (it's a programmer's shorthand).
The postfix modifies its variable after the rest of the expression
has got to it.
Prefix example:
a = 10
b = --a
Sets b to 9 and a to 9
Postfix example:
a = 10
b = a ++
Sets b to 10 and a to 11
[Contents] [Tutorial]
[Object
Hierrachy] [Language]
[Expressions]
[Statements]
|