JavaScript is a widely used programming language supported by all web browsers. It enables web developers to design and develop highly interactive web pages. It is a simple and easy to learn language yet powerful enough to add interfaces that are highly responsive to the user. The use of JavaScript and the two other web technologies HTML 5 and CSS, have greatly changed the way web pages are designed, developed and used.
A JavaScript program is a set of statements to be executed one after the other. These statements "tell" the computer what to do. These statements are made up of standard objects such as Array, Math, Boolean, along with their methods and properties. Various operators are also needed in order to evaluate numerical expressions, compare quantities. Control structures which allow a change of program flow within a block of code, are also needed in JavaScript. It has a large library of objects such as Maths, Boolean, Strings,... These easy to use objects, along with their properties and methods may be used to build more powerful programs.
Example of statements in a JavaScript program
JavaScript Statement | |
var x,y,z,p,w; | This statement declares x,y,z,p and w as variables |
var x = 2; | assign 2 to the variable x |
var y = 4; | assign 4 to y |
var z = x + y; | add x and y and assign the result to z (operator + is used) |
var p = Math.PI; | use Math.PI from library to assign π (≈ 3.14) to p (use standard object Math and its property) |
if(z > p){w = 0} | |
else {w=1} | The last two statements:compare z and p; if z is greater than p, assign 0 to w, otherwise assign 1 to w |
In order to write and develop javascript programs, you need an editor. I suggest that you download the free code editor Notpad++ (click on "Notepad++ Installer" it is the easiest to install). You also need to to check your JavaScript source code for common mistakes. I suggest the online use of JavaScript Lint.
Download Notpad++ and follow instructions to install it. Open a new file. Copy and paste the following code into the new file area; then save the file with html extension.
Then click on run (as shown below) and select any of the browser in your computer. I have selected Chrome in this example as shown in figure 1 below.
.
The alert window with the message "This is my first javascript program !!" should appear as shown in figure 2 below
.
We now examine the use of "JavaScript Lint" to check a javascript program. Click on JavaScript Lint so that it opens in another window as shown below.
.
Copy and paste the program below and run it in Notepad++, nothing happens. Let us see why
Copy and paste the javascript program shown below and paste into the blank area of "JavaScript Lint" then click on the button "Lint" located below the blank area.
The "JavaScript Lint" reports an error somewhere in the program. The closing tag </srcip> needs a "t" at the end (line 7 below) and has to be written as </srcipt> .
.
1 - A Smarter Way to Learn JavaScript: The new approach that uses technology to cut your effort in half - Mark Myers
2 - JavaScript and JQuery: Interactive Front-End Web Development 1st Edition - Jon Duckett - ISBN-13: 978-1118531648
3 - A Smarter Way to Learn HTML & CSS: Learn it faster. Remember it longer. (Volume 2) - Mark Myers
4 - http://www.w3schools.com/js/default.asp - JavaScript Tutorial