JavaScript 2: Programming Basics

Variables

A variable is a named object in a program which varies. Variables have names such as 'x', 'i' and 'j' or 'fruit', 'vehicle' and 'team' depending on the context of the program and how you want to name your variables. Variables in JavaScript are declared before they are used with the var signifier in front, for example:

var i;
var fruit;

Variabes can have values assigned when they are declared, for example:

var j=1;
var team="Chelsea";

Note the semi-colons after each declaration.

Variables also have a data type associated with them. These are the main types of variable in JavaScript programming:

1. Number - to hold and manipulate numbers such as 5 or -1.234
2. String - to hold characters such as 'adam' and 'eve'
3. Boolean - to hold True or False

In many programming languages the type of a variable is made explicit when it is declared, for example in C or Pascal:

int a,b,c;
a,b,c: integer;

In JavaScript variable types are implicit: terms such as 'integer', 'real', float, 'Boolean', etc. are not needed, instead the type of a variable is determined by its usage, by what values are assigned to it in a program. This may tempt you into using numeric variables in ways that exceed their capabilities. In C or Pascal you learn what numbers a real or a float can represent but in JavaScript it is easy not to bother. Learning the range of values numeric variables can take in a computer program is a considerable subject in itself.

In fact, variables can be declared in JavaScript as Numeric, String or Boolean and it is no bad thing to do this always so that your programs are easier to read. In most programming languages there are many variations on the three types identified above with a rich variety of numeric types, for example, to control precisely how much memory is used and to provide the most appropriate type for a particular problem. In JavaScript there are no such extensions, just the three main types, plus two others:

1. non-atomic JavaScript elements such as functions or objects - more about these later
2. the special value null - more about this later

As well as variables programs can include literal or constant values such as 25 or 'banana'. Together literals and variables make up the operands of a program, that is those things which are operated upon - a gerund if you remember your Latin.

Special Numbers

JavaScript makes available these values:

• Infinity - not a real number but a variable name which represents the largest value known to the computer. Use Number.POSITIVE_INFINITY
• -Infinity - Use Number.NEGATIVE_INFINITY
• NaN - not a number - from a mathematical operation which makes no sense

There are also:

• Null - no data in a variable
• Undefined - similar to null but means that nothing has been assigned to a variable which usually means an error in a program

Operators

Operands are operated on by operators - +, -, * and / in plain language. Apart from the unary minus (as in -5) and the unary NOT (as in NOT True) operators require two operands, for example a + b. The operators in JavaScript are:

Computational Operators:

• + is for addition and string concatenation e.g. i+1, 'Hello' + ' Goodbye'
• - is for subtraction and unary minus
• * is for multiplication
• / is for division, including integer division
• % is for modulus e.g. 5%2 equals 1, the remainder after integer division
• ++ is for pre-increment e.g. ++i adds 1 to i before any other operation; post-increment e.g. i++ adds 1 to i after other operations such as comparison
• -- is for pre-decrement and post-decrement e.g. --i, i--

With these you can carry out any calculation a program requires or join strings together. Notice that there is no exponent operator so you cannot write 2^2 or 19^0.5 as you might in BASIC.

Assignment Operators:

• = is the assignment operator e.g. a=1, fruit='apple'
• += is the aggregate plus assignment operator e.g. a+=5 is the same as a=a+5, fruit+='orange' is the same as fruit=fruit+'orange'.
• -= is the aggregate minus operator e.g. a-=5 is the same as a=a-5
• *= is the aggregate multiplication operator e.g. a*=5 is the same as a=a*5
• /=, %=, &=, |=, ^=, ~=, <<=, >>=, >>>= are the other aggregate operators

You will make extensive use of these assignment operators.

Logical Operators:

• == is the test for equality e.g. a==10 - does a equal 10?
• != is the test for inequality e.g. a!=10 - does a not equal 10?
• <, > are for less than or equal to and greater than or equal to e.g. a<10 - a less than 10? and b>10 - b greater than 10?
• <=, >= are for less than or equal to and greater than or equal to e.g. a<=10 - a less than or equal to 10? - and b>=10 b greater than or equal to 10?
• ! is the logical NOT operator e.g. !prime - prime not true?
• && is the logical AND operator which is used to link two or more logical conditions e.g. a==10 && b<20? - a equals 10 and b less than 20?
• || is the logical OR operator which is used to link two or more logical conditions e.g. a==10 || b>20? - a equals 10 or b greater than 20?
• ? and : are for conditional selection, a cryptic form of the if..then..else structure e.g. (a==10)? alert("a equals 10"):confirm("Continue");
• , is used to link logical expressions

Logical operators in expressions like the examples shown are used typically in if statements to test for the status of variables which control program behaviour.

Bitwise Operators:

• & is the bitwise AND operator e.g. 01010101 & 00001111 is 00000101
• | is the bitwise OR operator e.g. 01010101 | 00001111 is 01011111
• ^ is the bitwise XOR operator e.g. 01010101 ^ 00001111 is 01011010
• ~ is the bitwise NOT operator e.g. ~ 01010101 is 10101010
• << is the shift left operator e.g. << 01010101 2 (two left shifts) is 01010100
• >> is the signed shift right operator e.g. >> 11010101 2 (two right shifts) is 11110101 - the sign bit replaces the most significant bits. This is useful when dealing with binary complements (negative numbers).
• >>> is the unsigned shift right operator e.g. >>> 11010101 2 (two right shifts) is 00110101 - most significant bits are replaced by zero regardless of their value.

Bitwise operators are not as commonly used as the other types.

Type Conversion

In some circumstances you need to change the type of a variable into another. This you can do by using the words String, Number or Boolean in front of a variable name to force it into that type, for example: x=String(x) or y=Number(ystring). Often you want to add a number to a string, for example in 'The answer is 10' where the result of an operation is 10 and this is added to the string 'The answer is ' to make the output easier to read - (astr+='The answer is '+x). JavaScript handles this conversion from number to string without complaint but this will only work if astr is a string type. It is not possible to add letters to a numeric variable - you probably thought this was obvious and it hadn't occurred to you to try, but just in case...

Another way of forcing variables into a specific type is as follows:

(a-0)>(b-0> - add or subtract zero
(astr+'')==(bstr+'') - add an empty character

Care must also be taken when using the comparison or Boolean operators ==, >, <, >=, <= and !=. Again you probably wouldn't think of comparing a number with a string but you may want to compare objects and you need to be clear what types the objects revert to in such circumstances - most go to numbers except the date type.

Return to JavaScript Menu