Javascript

Intro to Javascript
By Dr. Shikha Verma
1
THE THREE LAYERS OF THE
WEB
 HTML for Content
 <p class=“warning”>There is no <em>download
link</em> on this page.</p>
 CSS for Presentation

 .warning { color: red; }
 JavaScript for Behavior

 <script type=“text/javascript”>
window.alert(document.getElementsByClassName(“
warning”)[0].innerHTML);
</script>
Client Side Scripting
3
Why use client-side programming?
PHP already allows us to create dynamic web pages. Why also use
client-side scripting?
• client-side scripting (JavaScript) benefits:
• usability: can modify a page without having to post back to the server (faster
UI)
• efficiency: can make small, quick changes to page without waiting for server
• event-driven: can respond to user actions like clicks and key presses
4
Why use client-side programming?
• server-side programming (PHP) benefits:

• security: has access to server's private data; client can't see source code
• compatibility: not subject to browser compatibility issues
• power: can write files, open connections to servers, connect to databases, ...
5
What is Javascript?
• a lightweight programming language ("scripting language")

• used to make web pages interactive
• insert dynamic text into HTML (ex: user name)
• react to events (ex: page load user click)
• get information about a user's computer (ex: browser type)
• perform calculations on user's computer (ex: form validation)
6
What is Javascript?
• a web standard (but not supported identically by all browsers)

• NOT related to Java other than by name and some syntactic
similarities
7
Javascript vs Java
• interpreted, not compiled

• more relaxed syntax and rules
• fewer and "looser" data types
• variables don't need to be declared
• errors often silent (few exceptions)
• key construct is the function rather than the class
• "first-class" functions are used in many situations
• contained within a web page and integrates with its HTML/CSS
content
8
Javascript vs Java
+ =
9
Advantages of javascript
1. Easy to use and learn
2. An interpreted language
3. Used to create interactive websites
4. Embedded within HTML
5. Quick development
6. Used to add dynamic functionality to websites
7. Validate the user input
8. Event-driven
9. Platform independence
10. Easy debugging and testing
10
Limitations of javascript
• Limited range of built-in methods

• No code hiding
• Lack of Debugging and Development tools
11
Syntax of Javascript
<html>
<body>
<script type=“text/javascript”>
-----------------------------------
</script>
</body>
</html>
12
Write output to a Page
<html>
<body>
<script type=“text/javascript”>
document.write(“hello world”)
</script>
</body>
</html>
13
Different Places where Javascript can be Placed
1. Placing a Javascript in HEAD section

2. Placing a Javascript in BODY section
3. Placing a Javascript in both HEAD & BODY section
4. Placing a Javascript in EXTERNAL FILE
14
Using JavaScript in your HTML
• JavaScript can be inserted into documents by

using the SCRIPT tag
<html>
<head>
<title>Hello World in JavaScript</title>
</head>
<body>
<script type="text/javascript">
document.write("Hello World!");
</script>
</body>
</html>
15
A Simple Script
<html>
<head><title>First JavaScript Page</title></head>
<body>
<h1>First JavaScript Page</h1>
document.write("<hr>");
document.write("Hello World Wide Web");
</script>
</body>
</html>
16
Embedding JavaScript
<html>
<head><title>First JavaScript Program</title></head>
<body>
<script type="text/javascript"
src="your_source_file.js"></script>
</body>
Inside your_source_file.js
</html>
document.write("Hello World Wide Web");
 Use the src attribute to include JavaScript codes

from an external file.
 The included code is inserted in place.
17
Embedding JavaScript
 The scripts inside an HTML document is

interpreted in the order they appear in the
document.
 Scripts in a function is interpreted when the function
is called.
 So where you place the <script> tag matters.
18
Hiding JavaScript from Incompatible Browsers
<!–
document.writeln("Hello, WWW");
// -->
</script>
<noscript>
Your browser does not support JavaScript.
</noscript>
19
alert(), confirm(), and prompt()
alert("This is an Alert method");
confirm("Are you OK?");
prompt("What is your name?");
prompt("How old are you?","20");
</script>
20
alert() and confirm()
alert("Text to be displayed");
 Display a message in a dialog box.
 The dialog box will block the browser.
var answer = confirm("Are you sure?");

 Display a message in a dialog box with two buttons:
"OK" or "Cancel".
 confirm() returns true if the user click "OK".
Otherwise it returns false.
21
prompt()
prompt("What is your student id number?");
prompt("What is your name?”, "No name");

 Display a message and allow the user to enter a value
 The second argument is the "default value" to be
displayed in the input textfield.
 Without the default value, "undefined" is shown in the
input textfield.
 If the user click the "OK" button, prompt() returns the

value in the input textfield as a string.
 If the user click the "Cancel" button, prompt() returns
null.
22
JavaScript Datatypes
• JavaScript allows you to work with three primitive data types −

• Numbers, eg. 123, 120.50 etc.
• Strings of text e.g. "This text string" etc.
• Boolean e.g. true or false.
• JavaScript also defines two trivial data
types, null and undefined, each of which defines only a single value.
In addition to these primitive data types, JavaScript supports a
composite data type known as object.
23
JavaScript Variables
javaScript variables are containers for storing data

values.
In this example, x, y, and z, are variables, declared

with the var keyword:
Example
var x = 5;
var y = 6;
var z = x + y;
24
JavaScript Identifiers
• All JavaScript variables must be identified with unique names.

• These unique names are called identifiers.
• Identifiers can be short names (like x and y) or more descriptive names
(age, sum, totalVolume).
• The general rules for constructing names for variables (unique
identifiers) are:
• Names can contain letters, digits, underscores, and dollar signs.
• Names must begin with a letter
• Names can also begin with $ and _ (but we will not use it in this tutorial)
• Names are case sensitive (y and Y are different variables)
• Reserved words (like JavaScript keywords) cannot be used as names
25
JavaScript is untyped language. This means that a JavaScript
variable can hold a value of any data type. Unlike many other
languages, you don't have to tell JavaScript during variable
declaration what type of value the variable will hold. The
value type of a variable can change during the execution of a
program and JavaScript takes care of it automatically.
26
JavaScript Variable Scope
• The scope of a variable is the region of your program in

which it is defined. JavaScript variables have only two
scopes.
• Global Variables − A global variable has global scope
which means it can be defined anywhere in your
JavaScript code.
• Local Variables − A local variable will be visible only
within a function where it is defined. Function
parameters are always local to that function.
27
EXAMPLE
<html>
<body onload = checkscope();>
<script type = "text/javascript">

</script>
</body>
</html>
28
JavaScript Reserved Words
A list of all the reserved words in JavaScript are given in the

following table. They cannot be used as JavaScript variables,
functions, methods, loop labels, or any object names.
29
What is an Operator?
• Let us take a simple expression 4 + 5 is equal to 9. Here 4 and 5

are called operands and ‘+’ is called the operator. JavaScript
supports the following types of operators.
• Arithmetic Operators
• Comparison Operators
• Logical (or Relational) Operators
• Assignment Operators
• Conditional (or ternary) Operators
30
JavaScript Arithmetic Operators
31
• Exponentiation
• The exponentiation operator (**) raises the first operand to the
power of the second operand.
• Example
• let x = 5; Ans =25
• let z = x ** 2;
x ** y produces the same result as Math.pow(x,y):
• Example
• let x = 5;
• let z = Math.pow(x,2);
32
• Incrementing
• The increment operator (++) increments Ans =6
numbers.
• Example
• let x = 5;
• x++;
• let z = x;
• Decrementing
• The decrement operator (--) decrements
numbers.
• Example
• let x = 5;
• x--;
• let z = x;
Ans =4
33
JavaScript Assignment Operators
34
JavaScript String Operators
35
• The += assignment operator can also be used to add (concatenate)
strings:
• Example
• var txt1 = "What a very ";
• txt1 += "nice day";
• The result of txt1 will be:
• What a very nice day
36
JavaScript Comparison Operators
37
JavaScript Logical Operators
38
Conditional (Ternary) Operator
• JavaScript also contains a conditional operator that assigns a value to

a variable based on some condition.
• Syntax
• variablename = (condition) ? value1:value2
• Example
• let voteable = (age < 18) ? "Too young":"Old enough";
39
JavaScript Type Operators
40
JavaScript Comments
41
Multi-line Comments
42
JavaScript If-else
• The JavaScript if-else statement is used to execute the code whether condition is
true or false. There are three forms of if statement in JavaScript.
• 1. If Statement
• 2. If else statement
• 3. if else if statement
43
JavaScript If statement
It evaluates the content only if expression is true. The signature of JavaScript if
statement is given below.
1. if(expression){
2. //content to be evaluated
3. }
Let’s see the simple example of if statement in javascript.
• 1. <script>
• 2. var a=20;
• 3. if(a>10){
• 4. document.write("value of a is greater than 10");
• 5. }
• 6. </script>
44
JavaScript If...else Statement
It evaluates the content whether condition is true of false. The syntax of JavaScript
if-else statement is given below.
• if(expression){
• //content to be evaluated if condition is true
• }
• else{
• //content to be evaluated if condition is false
• }
45
• Let’s see the example of if-else statement in JavaScript to find out the even or odd
number.
• <script>
• var a=20;
• if(a%2==0){
• document.write("a is even number");
• }
• else{
• document.write("a is odd number");
• }
• </script>
• Output of the above
46
JavaScript If...else if statement
• It evaluates the content only if expression is true from several expressions. The
signature of JavaScript if else if statement is given below.
• if(expression1){
• //content to be evaluated if expression1 is true
• }
• else if(expression2){
• }
• else if(expression3){
• }
• else{
• //content to be evaluated if no expression is true
• }
47
• Let’s see the simple example of if else if statement in javascript.
• <script>
• var a=20;
• if(a==10){
• document.write("a is equal to 10");
• }
• else if(a==15){
• }
• else if(a==20){
• }
• else{
• document.write("a is not equal to 10, 15 or 20");
• }
• </script>
48
JavaScript Switch
• The JavaScript switch statement is used to execute one code from multiple expressions. It is just like
else if statement that we have learned in previous page. But it is convenient than if..else..if because it
can be used with numbers, characters etc.
• The signature of JavaScript switch statement is given below.
• switch(expression){
• case value1:
• code to be executed;
• break;
• case value2:
• code to be executed;
• break;
• ......
• default:
• code to be executed if above values are not matched;
• }
49
Let’s see the simple example of switch statement in javascript.
<script>
var grade='B';
var result;
switch(grade){
case 'A’:
result="A Grade";
break;
case 'B':
result="B Grade";
break;
default:
result="No Grade";
}
document.write(result);
</script>
50
Loops in JavaScript
• Looping in programming languages is a feature which facilitates the execution of
a set of instructions/functions repeatedly while some condition evaluates to true.
For example, suppose we want to print “Hello World” 10 times. This can be done
in two ways as shown below:
• Iterative Method
• Using Loops
51
• Iterative Method
• Iterative method to do this is to write the document.write() statement 10 times. <script
type = "text/javascript">
• document.write("Hello World\n");
• < /script>
52
• Using Loops
• In Loop, the statement needs to be written only once and the loop will be
executed 10 times as shown below:
• <script type = "text/javascript">
• var i;
• for (i = 0; i < 10; i++)
• {
• document.write("Hello World!\n");
• }
• < /script>
53
• In computer programming, a loop is a sequence of instructions that is repeated
until a certain condition is reached.
• An operation is done, such as getting an item of data and changing it, and then
some condition is checked such as whether a counter has reached a prescribed
number.
• Counter not Reached: If the counter has not reached the desired number, the
next instruction in the sequence returns to the first instruction in the sequence and
repeat it.
• Counter reached: If the condition has been reached, the next instruction “falls
through” to the next sequential instruction or branches outside the loop.
54
• There are mainly two types of loops:
• 1. Entry Controlled loops: In this type of loops the test condition is tested before
entering the loop body. For Loop and While Loop are entry controlled loops.
• 2. Exit Controlled Loops: In this type of loops the test condition is tested or
evaluated at the end of loop body. Therefore, the loop body will execute atleast
once, irrespective of whether the test condition is true or false. do – while loop is
exit controlled loop.
55
While Loop
• 1. while loop: A while loop is a control flow statement that allows code to be
executed repeatedly based on a given Boolean condition. The while loop can be
thought of as a repeating if statement.
• Syntax :
• while (boolean condition)
• {
• loop statements...
• }
56
While Loop
• While loop starts with the checking of condition. If it evaluated to true, then the
loop body statements are executed otherwise first statement following the loop is
executed. For this reason it is also called Entry control loop
• Once the condition is evaluated to true, the statements in the loop body are
executed. Normally the statements contain an update value for the variable being
processed for the next iteration.
• When the condition becomes false, the loop terminates which marks the end of
its life cycle.
57
Example
• <script type = "text/javaScript">

• // JavaScript program to illustrate while loop
• var x = 1;
• // Exit when x becomes greater than 4
• while (x <= 4)
• {
• document.write("Value of x:" + x + "<br />");
• // increment the value of x for
• // next iteration
• x++;
• }
• < /script>
58
FOR LOOP
• for loop: for loop provides a concise way of writing the loop structure. Unlike a
while loop, a for statement consumes the initialization, condition and
increment/decrement in one line thereby providing a shorter, easy to debug
structure of looping. Syntax: for (initialization condition; testing condition;
• 2. increment/decrement)
• 3. {
• 4. statement(s)
• 5. }
59
• Initialization condition: Here, we initialize the variable in use. It marks the start
of a for loop. An already declared variable can be used or a variable can be
declared, local to loop only.
• 2. Testing Condition: It is used for testing the exit condition for a loop. It must
return a boolean value. It is also an Entry Control Loop as the condition is
checked prior to the execution of the loop statements.
• 3. Statement execution: Once the condition is evaluated to true, the statements in
the loop body are executed.
• 4. Increment/ Decrement: It is used for updating the variable for next iteration.
• 5. Loop termination:When the condition becomes false, the loop terminates
marking the end of its life cycle.
60
EXAMPLE FOR LOOP

• // JavaScript program to illustrate for loop
• var x;
• // for loop begins when x=2
• // and runs till x <=4
• for (x = 2; x <= 4; x++)
• {
• }
61
for…in loop
• JavaScript also includes another version of for loop also known as the for..in
Loops. The for..in loop provides a simpler way to iterate through the properties of
an object. This will be more clear after leaning objects in JavaScript. But this loop
is seen to be very useful while working with objects.
• Syntax:
• for (variableName in Object)
• {
• statement(s)
• }
• In each iteration, one of the properties of Object is assigned to the variable named
variableName and this loop continues until all of the properties of the Object are
processed. Lets take an example to demonstrate how for..in loop can be used to
simplify the work.
62
• // JavaScript program to illustrate for..in loop
• // creating an Object
• var languages = { first : "C", second : "Java",
• third : "Python", fourth : "PHP",
• fifth : "JavaScript" };
• // iterate through every property of the
• // object languages and print all of them
• // using for..in loops
• for (itr in languages)
• {
• document.write(languages[itr] + "<br >");
• }
• < /script>
63
DO-WHILE
• do while: do while loop is similar to while loop with only difference that it
checks for condition after executing the statements, and therefore is an example
of Exit Control Loop. Syntax:
• do
• {
• statements..
• }
• while (condition);
64
• 1. do while loop starts with the execution of the statement(s). There is no
checking of any condition for the first time.
• 2. After the execution of the statements, and update of the variable value, the
condition is checked for true or false value. If it is evaluated to true, next iteration
of loop starts.
• 3. When the condition becomes false, the loop terminates which marks the end of
its life cycle.
• 4. It is important to note that the do-while loop will execute its statements atleast
once before any condition is checked, and therefore is an example of exit control
loop.
65
• // JavaScript program to illustrate do-while loop
• var x = 21;
• do
• {
• // The line while be printer even
• // if the condition is false
• x++;
• } while (x < 20);
• < /script>
• Output:
• Value of x: 21
66
ARRAYS
• In JavaScript, array is a single variable that is used to store different elements. It

is often used when we want to store list of elements and access them by a single
variable. Unlike most languages where array is a reference to the multiple
variable, in JavaScript array is a single variable that stores multiple elements.
• Declaration of an Array There are basically two ways to declare an array.
Example:
• var House = [ ]; // method 1
• var House = new array(); // method 2
• But generally method 1 is preferred over the method 2. Let us understand the
reason for this.
67
• Initialization of an Array Example (for Method 1): // Initializing while declaring
• var house = ["1BHK", "2BHK", "3BHK", "4BHK"];
• // Initializing after declaring
• house[0] = "1BHK";
• Example (for Method 2): // Initializing while declaring
• // Creates an array having elements 10, 20, 30, 40, 50
• var house = new Array(10, 20, 30, 40, 50);
• //Creates an array of 5 undefined elements
• var house1 = new Array(5);
• //Creates an array with element 1BHK
• var home = new Array("!BHK");
• As shown in above example the house contains 5 elements i.e. (10 , 20, 30, 40, 50) while
house1 contains 5 undefined elements instead of having a single element 5. Hence, while
working with numbers this method is generally not preferred but it works fine with
Strings and Boolean as shown in the example above home contains a single element
1BHK.
68
• An array in JavaScript can hold different elements We can store Numbers,
Strings and Boolean in a single array. Example: Storing number, boolean, strings
in an Array
• var house = ["1BHK", 25000, "2BHK", 50000, "Rent", true];
69
• Accessing Array Elements Array in JavaScript are indexed from 0 so we can
access array elements as follows: var house = ["1BHK", 25000, "2BHK", 50000,
"Rent", true];
alert(house[0]+" cost= "+house[1]);
• var cost_1BHK = house[1];
• var is_for_rent = house[5];
alert("Cost of 1BHK = "+ cost_1BHK);
alert("Is house for rent = ")+ is_for_rent);
70
• Length property of an Array Length property of an Array returns the length of
an Array. Length of an Array is always one more than the highest index of an
Array. Example below illustrates the length property of an Array:
• var house = ["1BHK", 25000, "2BHK", 50000, "Rent", true];
• //len conatains the length of the array
• var len = house.length;
• for (var i = 0; i < len; i++)
• alert(house[i]);
71
JavaScript Functions
72
JavaScript Function Syntax
73
Function Invocation
74
Function Return
75
Linking to a JavaScript file: script
<script src="filename" type="text/javascript"></script>

HTML
• script tag should be placed in HTML page's head
• script code is stored in a separate .js file
• JS code can be placed directly in the HTML file's body or head (like CSS)
• but this is bad style (should separate content, presentation, and behavior
76
Event-driven programming
 split breaks apart a string into an array using a

delimiter
 can also be used with regular expressions (seen later)
 join merges an array into a single string, placing a
delimiter between them
77
Event-driven programming
 you are used to programs start with a main

method (or implicit main like in PHP)
 JavaScript programs instead wait for user actions
called events and respond to them
 event-driven programming: writing programs
driven by user events
 Let's write a page with a clickable button that pops
up a "Hello, World" window...
78
Buttons
<button>Click me!</button> HTML
• button's text appears inside tag; can also contain images

• To make a responsive button or other UI control:
1. choose the control (e.g. button) and event (e.g. mouse 1. click) of interest
2. write a JavaScript function to run when the event occurs
3. attach the function to the event on the control
79
JavaScript functions
function name() {
statement ;
statement ;
...
statement ;
} JS
function myFunction() {
alert("Hello!");
alert("How are you?");
} JS
 the above could be the contents of example.js

linked to our HTML page
 statements placed into functions can be evaluated
in response to user events
80
Event handlers
<element attributes onclick="function();">...
HTML
<button onclick="myFunction();">Click me!</button>

HTML
• JavaScript functions can be set as event handlers
• when you interact with the element, the function will execute
• onclick is just one of many event HTML attributes we'll use
• but popping up an alert window is disruptive and annoying
• A better user experience would be to have the message appear on the page...
81
Events
Event handlers are created as attributes added to the HTML tags in
which the event is triggered.
An Event handler adopts the event name and appends the word
“on” in front of it.
Thus the “click” event becomes the onclick event handler.

Mouse Events
Event handler Description

onmousedown when pressing any of the mouse buttons.
onmousemove when the user moves the mouse pointer within an element.
onmouseout when moving the mouse pointer out of an element.

onmouseup when the user releases any mouse button pressed
onmouseover when the user moves the mouse pointer over an element.
onclick when clicking the left mouse button on an element.
ondblclick when Double-clicking the left mouse button on an

element.
ondragstart When the user has begun to select an element
Keyboard
Events
Event handler Description
onkeydown When User holds down a key
onkeypress When User presses a key
onkeyup When User releases the pressed a key

JAVASCRIPT OBJECTS
• A javaScript object is an entity having state and

behavior (properties and method). For example:
car, pen, bike, chair, glass, keyboard, monitor
etc.
• JavaScript is an object-based language.
Everything is an object in JavaScript.
• JavaScript is template based not class based.
Here, we don't create class to get the object.
But, we direct create objects.
85
PROPERTIES OF AN OBJECT
• The named values, in JavaScript objects, are called properties.
Property Value
firstName John
lastName Doe
Age 50
eyeColor blue
86
Object Methods
• Methods are actions that can be performed on objects.

• Object properties can be both primitive values, other objects, and
functions.
• An object method is an object property containing a function definition.
Property Value
firstName John
lastName Doe
age 50
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}
• JavaScript objects are containers for named values, called properties and
methods.
87
Creating a JavaScript Object
There are 3 ways to create objects.
1.By object literal

2.By creating instance of Object directly (using
new keyword)
3.By using an object constructor (using new
keyword)
88
BY OBJECT LITERAL
The syntax of creating object using object literal is given below:

object={property1:value1,property2:value2.....propertyN:valueN}
As you can see, property and value is separated by : (colon).

Let’s see the simple example of creating object in JavaScript.
<script>
emp={id:102,name:"Shyam Kumar",salary:40000}
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>
89
2) By creating instance of Object
The syntax of creating object directly is given below:

var objectname=new Object();
Here, new keyword is used to create object.
Let’s see the example of creating object directly.
<script>
var emp=new Object();
emp.id=101;
emp.name="Ravi Malik";
emp.salary=50000;
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>
90
3) By using an Object constructor
Here, you need to create function with arguments. Each argument value
can be assigned in the current object by using this keyword.
The this keyword refers to the current object.
The example of creating object by object constructor is given below.
<script>
function emp(id,name,salary){
this.id=id;
this.name=name;
this.salary=salary;
}
e=new emp(103,"Vimal Jaiswal",30000);
document.write(e.id+" "+e.name+" "+e.salary);

</script>
91
Defining method in JavaScript Object
92
Data Validation
• Data validation is the process of ensuring that user input is

clean, correct, and useful.
• Typical validation tasks are:
• has the user filled in all required fields?
• has the user entered a valid date?
• has the user entered text in a numeric field?
• Most often, the purpose of data validation is to ensure correct
user input.
• Validation can be defined by many different methods, and
deployed in many different ways.
• Server side validation is performed by a web server, after
input has been sent to the server.
• Client side validation is performed by a web browser,
before input is sent to a web server.
121
• JavaScript Form Validation
• HTML form validation can be done by JavaScript.
• If a form field (fname) is empty, this function alerts a
message, and returns false, to prevent the form from
being submitted:
122
Example
script>
function validateform(){
var name=document.myform.name.value;
var password=document.myform.password.value;
if (name==null || name==""){
alert("Name can't be blank");
return false;
}else if(password.length<6){
alert("Password must be at least 6 characters long.");
return false;
}
}
</script>
<body>
<form name="myform" method="post" action="abc.jsp" onsubmit="return validatefor
m()" >
Name: <input type="text" name="name"><br/>
Password: <input type="password" name="password"><br/>
<input type="submit" value="register">
</form> 123

Javascript

Uploaded by

Document Informationclick to expand document informationthis is java script notes

Document Informationclick to expand document information

Copyright:

Available Formats

Javascript

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Javascript

Uploaded by

Copyright:

Available Formats

Intro to Javascript

By Dr. Shikha Verma

 CSS for Presentation

 JavaScript for Behavior

• server-side programming (PHP) benefits:

• a lightweight programming language ("scripting language")

• a web standard (but not supported identically by all browsers)

• interpreted, not compiled

• Limited range of built-in methods

1. Placing a Javascript in HEAD section

• JavaScript can be inserted into documents by

 Use the src attribute to include JavaScript codes

 The scripts inside an HTML document is

 So where you place the <script> tag matters.

var answer = confirm("Are you sure?");

prompt("What is your student id number?");

prompt("What is your name?”, "No name");

 If the user click the "OK" button, prompt() returns the

• JavaScript allows you to work with three primitive data types −

javaScript variables are containers for storing data

In this example, x, y, and z, are variables, declared

• All JavaScript variables must be identified with unique names.

• The scope of a variable is the region of your program in

A list of all the reserved words in JavaScript are given in the

• Let us take a simple expression 4 + 5 is equal to 9. Here 4 and 5

• What a very nice day

• JavaScript also contains a conditional operator that assigns a value to

• <script type = "text/javaScript">

• <script type = "text/javaScript">

• In JavaScript, array is a single variable that is used to store different elements. It

<script src="filename" type="text/javascript"></script>

 split breaks apart a string into an array using a

 you are used to programs start with a main

• button's text appears inside tag; can also contain images

 the above could be the contents of example.js

<button onclick="myFunction();">Click me!</button>

Thus the “click” event becomes the onclick event handler.

Event handler Description

onmouseout when moving the mouse pointer out of an element.

onclick when clicking the left mouse button on an element.

ondblclick when Double-clicking the left mouse button on an

Event handler Description

onkeydown When User holds down a key

onkeypress When User presses a key

onkeyup When User releases the pressed a key

• A javaScript object is an entity having state and

• The named values, in JavaScript objects, are called properties.

• Methods are actions that can be performed on objects.

There are 3 ways to create objects.

1.By object literal

The syntax of creating object using object literal is given below:

As you can see, property and value is separated by : (colon).

The syntax of creating object directly is given below:

document.write(e.id+" "+e.name+" "+e.salary);

• Data validation is the process of ensuring that user input is

You might also like