Introduction to JavaScript Programming – part 1

Introduction to JavaScript Programming – part 1

JavaScript is the most popular web programming language today. JavaScript can be used on the server to create a dynamic web site or to retrieve information from the user, similar to CGI scripts. JavaScript can also be used on the client browser to provide dynamic content or a dynamic web page without having to access the server. This tutorial is an introduction to basic JavaScript Programming. Nothing advanced is presented here. If you like, you can follow the instructions for some hands-on programming.

To program JavaScript, you don’t need any special editors or compilers. You should use a simple text editor like Windows Notepad to create Web pages containing your code. All modern Web browsers have a javascript interpreter built-in for you to run your programs. This is the first release of Basic JavaScript programming. I guess I’m anxious to get the new material out for you to take a look at. I will be updating this tutorial in the future, adding much more material and many more hands-on experiments.

JavaScript Programming

To add JavaScript to your web page, place the tag where the JavaScript code starts, and place the tag where the JavaScript code ends.

You can place your JavaScript in a separate file and then place a line on your web page to include the external script as shown below.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js" type="text/javascript"></script>

The external file must be ASCII text with the file extension .js. Do not use the beginning and ending tags in the external .js file.

JavaScript Variables:
In many programming languages, when you use a variable, you must state the type of the variable, for example, whether it is an integer, a string of characters, etc. JavaScript automatically allows a variable of the correct type for the data that you assign to a variable. If during execution, your code causes the data type to change, JavaScript automatically converts between variable types.

Data Types Used by JavaScript:

Type Example Description
Boolean bTest = true; A logical value that is either true or false.
Number nNum = 32; An integer or floating pointvalue.
String strString = “hello”; A string of characters.

A variable that is not assigned a value is type NULL;

Notes:
– variable names are case sensitive.
– To define a hexadecimal number, prefix the number with 0x.
– You can use single or double quotation marks to enclose a string value.
– If a variable is a string type and you want to use it in a mathematical operation, use the built-in function ParseInt() or ParseFloat() to convert the string to a number.

example :

strNum = "32";
 strDen = "2.5";
 nQuotient = ParseInt(strNum) / ParseFloat(strDen);

– If a variable is type Number and you want to use it in a string, use the toString() method.

example :

nNum = 15.5;
 strNum = nNum.toString();

Hands-on Learning

I know that just reading about programming is pretty boring. It is much easier to learn by doing. To program JavaScript, you don’t need any special editors or compilers. You should use a simple text editor like Windows Notepad. You can embed your code in a Web page. Create a Web page by typing the following text into your text editor and saving the file with the extension .html.

<html>
<header></header>
<body>
<h1>Hello!</h1>
</body>
</html>

To add JavaScript to your Web page, you must place the code between script tags as shown below.

<script>//Your code goes here</script>

A very useful feature of JavaSCript is the alert() method. You can use the alert() method to display a message in a dialog box with an OK button. Create a Web page with the text shown below.

<script>
 alert("Hello!");
</script>

The alert method accepts a string between quotation marks inside the brackets. You can enter a literal string, as shown above, or you can enter the name of a string variable. When you use the name of a string
variable you don’t need the quotation marks. You can use the procedure described above to experiment with the examples provided in this tutorial.

This note will continue in Introduction to JavaScript Programming – part 2 page