JavaScript - Introduction to JavaScript, What is Data Type & Variables?

Introduction to JavaScript
What is Data Type & Variables?

Introduction to JavaScript

What is JavaScript?

Html is providing static web pages but with the developments in internet & World Wide Web the interactive communication became a necessity. The World Wide Web is a heap of pages having information if form of text, graphics, pictures, sounds etc. Every page is linked to another page on web and the linked page can have links to other pages.

Browser is a program responsible to understand and interpret the language and perform according to the instructions written in HTML file. Internet Explorer, Netscape Navigator, Fire Fox etc. are such programs.

HTML, JavaScript is integrated with browser & this integration enables the programmer to add dynamic interaction to the text, picture, information on the web page. JavaScript is case sensitive language i.e.; state is different from State or STATE (these are three different words for JavaScript). JavaScript is capable of sensing the events like mousing clicking, mousing moving etc. JavaScript files are directly executed when user double clicks on them or opens them in Browser.

JavaScript is Java or what?

No, JavaScript is not java.

Java is a complex and much more powerful language like C & C++.

While

HTML, JavaScript are integrated with browser & this integration enables the programmer to add dynamic interaction to the text, picture, information on the web page. JavaScript is case sensitive language i.e.; state is different from State or STATE (these are three different words for JavaScript). JavaScript is capable of sensing the events like mousing clicking, mousing moving etc. JavaScript files are directly executed when user double clicks on them or opens them in Browser.

HTML coders are not programmer but using JavaScript an html operator can do programming in a very simple way because JavaScript is very simple and easy to learn and understand. JavaScript is capable of making a static page as dynamic page, where the programmer can put variables. JavaScript has the ability to sense the events like mouse click, movement, keyboarding events etc. We can use HTML in JavaScript i.e. JavaScript can understand HTML. The JavaScript program hence decreasing the unnecessary traffic on lines and useless processing at server end can validate the data fed by the user at client end.

What we can do using JavaScript?

HTML coders are not programmer but using JavaScript a html operator can do programming in a very simple way because JavaScript is very simple and easy to learn and understand. JavaScript is capable of making a static page as dynamic page, where the programmer can put variables. JavaScript has the ability to sense the events like mousing click, movement, keyboarding events etc. We can use HTML in JavaScript i.e. JavaScript can understand HTML. The JavaScript program hence decreasing the unnecessary traffic on lines and useless processing at server end can validate the data fed by the user at client end.

What we should know before learning JavaScript ?

We should have knowledge of HTML before learning JavaScript. A JavaScript program can be typed in head or in body part of the HTML page or it could be attached externally to the web page.

What minimum Hardware and Software requirements are to run JavaScript?

Hardware Requirements

Processor:	486 dx4 or above
RAM:	16 MB
VDU:	VGA or SVGA
HDD:	1.2 GB or above

Software Requirements

Operating System:	Windows or Linux with browser
Text Editor:	Any text editor likes notepad or editplus etc.

How to use JavaScript into HTML code?

A JavaScript program can be kept in html page under <script> JavaScript program </script> tag. We can place unlimited number of scripts in the html program in head or body section.

Keeping JavaScript in head section

If we want that the JavaScript program should be executed when it is called, then we should keep it in head section.

How to keep JavaScript in head section of a HTML file:

<html>

<head>

script code

</script>

</head>

This is just syntax (how & where to type), we will learn it in detail after learning functions.

Keeping JavaScript in body section

If we want that the script should be executed when the page loads then we should keep the JavaScript program in body section.

How to keep JavaScript in body section of a HTML file :

<html>

<head>

</head>

<body>

script code

</script>

</body>

</head>

This is just syntax (how & where to type) we will learn it in detail after learning variables.

Is semi colon needed to end the statement in JavaScript?

Putting semi color at the end of the statement is optional, if you want you can place else you can leave. Putting semi color at end of the statement depends on the user's choice.

What is Data Type & Variables?

Number

The number type deals with digits, It covers both floating point numbers and integers.

Floating point numbers are like - 412.562, 9.2, 0.468

Integer numbers are like : 25, 1258, 968

Initializing number type variables

Var age = 25

Var is javascript keyword, age is a variable name, 25 is value assigned to age variable, variable age is of number type because the value assigned to age is of number type.

Var hra = 1585.56

Var is javascript keyword, hra is a variable name, 1585.56 is value assigned to hra variable, variable hra is of number type because the value assigned to hra is of number type.

In the example given below we have used keyword document.write (messge ) which is used to print the message or variable value given with it.

Example

<html>

<body>

var age=25 document.write("Age is : "+age);

</script >

</body>

</html>

Understanding the program

Output of this program

Age is : 25

Example

<html>

<head>

</head>

<body>

var hra=1585.25 document.write("HRA is : "+hra);

</script >

</body>

</html>

Understanding the program

Output of this program

HRA is : 25

String

String type deals with a single character or a series of characters enclosed with single quotes or double quotes respectively.

Initializing string type variables

var sect = 'a'

var is JavaScript keyword, sect is a variable name, a is value assigned to sect variable, variable sect is of string type because the value assigned to sect is of string type.

var country="India"

var is JavaScript keyword, country is a variable name, India is value assigned to country variable, variable country is of string type because the value assigned to country is of string type.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 1

<html>

<head>

</head>

<body>

var sect=’a’

document.write("Section is : "+sect);

</script >

</body>

</html>

Understanding the program

Output of this program

sectoion is : a

Example 2:

<html>

<head>

</head>

<body>

var country=’India’

document.write("Country is : "+country);

</script >

</body>

</html>

Understanding the program

Output of this program

Country is : India

Boolean

Boolean type has only two values true and false. These constant values are case-sensitive.

Initializing Boolean type variables

var present = true

var is JavaScript keyword, present is a variable name, true is value assigned to present variable, variable present is of Boolean type because the value assigned to present is of boolean type.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 1

<html>

<head>

</head>

<body>

var present = true

var attend = false

document.write("Student Status in School : "+present);

document.write("<br>Class Attended : "+attend);

</script >

</body>

</html>

Understanding the program

present & absent are two variables of Boolean type having values true and false respectively. <BR> is a html tag used to insert a new line.

Output of this program

Student Status in School : true

Class Attended : false

null & undefined

Null type has only one value, null. The null value means 'no data' or this variable do not have any useful data.

Undefined type has one value, undefined, undefined means nothing is stored in this variable. Undefined is not even null.

Initializing null type variable

var food = null

var is JavaScript keyword, food is a variable name, null is value assigned to food variable.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 1

<html>

<head>

</head>

<body>

var food=null

document.write("food is : "+food);

</script >

</body>

</html>

Understanding the program

food is a variable of null type having no type of values or data.

output of this program

food is : null

Knowing undefined type variable

var food ;

var is JavaScript keyword, food is a variable name, no value is assigned to variable food.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 2

<html>

<head>

</head>

<body>

var food;

document.write("food is : "+food);

</script >

</body>

</html>

Understanding the program

food is a variable of undefined type , because nothing is defined to it .

Output of this program

food is : undefined

infinity and NAN

infinity is a property of a number. It represents mathematical infinity.

Example

Var infi= 1e400*1e350;

Var is javascript keyword, infi is a variable name, 1e400 * 1e350 value assigned to infi variable.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 1

<html>

<head>

</head>

<body>

var infi = 1e300 * 1e300;

document.write("Value stored in infi is : "+infi);

</script >

</body>

</html>

Output of this program

Value stored in infi is : Infinity

Nan Stands for not a number and is a result of a mathematical operation which do not have any sense. This happens generally when we divide a 0 by 0.

Example

var k = 0/0 ;

var is JavaScript keyword, k is a variable name, 0/0 value is assigned to variable k.

In the example given below we have used keyword document.write (message ) which is used to print the message or variable value given with it.

Example 2

<html>

<head>

</head>

<body>

var k = 0/0;

document.write("Value stored in k is : "+k);

</script >

</body>

</html>

Output of this program

Value stored in k is : NaN

Arrays

If we require many variables of same or different types then a problem of remembering names of variables and many functional problems will arise. Concept of array allows us to store different data type data pieces under the same name in an ordered way. It helps in creating many variables. There is no need of remembering their names because they all have the same name but different positions in the array. The count of location in an array starts from 0 not from 1, means the first location is 0th location and 12th is 11th .

Declaring an array variable

Method 1

var d = new Array ("One", "Two", "Three", "Four");

Understanding the declaration

var - is reserve word

d - is the name of the array

new - is a reserve word , sets that much number of locations in memory as much parameters given with Array( );

Array( ) - is a reserve word , provides the input to new that how much memory locations are to be reserved.

"One", "Two", "Three"," Four" - are the values to set in d named array variable as much the count of these variables is that much of locations in memory will be reserved by new (reserve word).

Method 2

var sales = new Array (12);

Understanding the declaration

var - is reserve word

sales - is the name of the array

new - is a reserve word , sets that much number of locations in memory as much parameters given with Array( ), in this case 12 locations will be occupied;

Array( ) - is a reserve word , provides the input to new that how much memory locations are to be reserved. 12 - is the count of locations to be reserved.

Assigning values to an array locations

Sales[0] = "Rubber";

Sales [1] = 12000;

Sales[2] = "Plastic";

Sales [3] = 18000;

At 0th position of sales named array the value is "Rubber " and at 1st position 12000 is stored. So we can place different data types data in the same array.

Example 1

<html>
<head>
</head>
<body>
<script type="text/JavaScript">
var d = new Array("One","Two","Three","Four");
document.write("Value at 0th position of d is "+d[0]);
document.write("<br>Value at 1st position of d is "+d[1]);
document.write("<br>Value at 2nd position of d is "+d[2]);
document.write("<br>Value at 3rd position of d is "+d[3]);
</script >
</body>
</html>

Output is

Value at 0th position of d is One
Value at 1st position of d is Two
Value at 2nd position of d is Three
Value at 3rd position of d is Four

Example 2

<html>
<head>
</head>
<body>
<script type="text/javascript">
var sales = new Array(12);
sales[0]="Rubber";
sales[1]=12000;
sales[2]="Plastic"
sales[3]=18000;
document.write("Value at 0th position of sales is "+sales[0]);
document.write("<br>Value at 1st position of sales is "+sales[1]);
</script >
</body>
</html>

Output is

Value at 0th position of sales is Rubber
Value at 1st position of sales is 12000

Next Chapter »

SHARE THIS PAGE

JavaScript - Introduction to JavaScript, What is Data Type & Variables?

0 Comments:

Post a Comment