22.04.

2020

JavaScript…
Functions
A lot of the values provided in the default environment have the type function. A function is a piece
of program wrapped in a value. Such values can be applied in order to run the wrapped program. For
example, in a browser environment, the binding prompt holds a function that shows a little dialog
box asking for user input. It is used like this:

prompt ("Enter passcode");

Executing a function is called invoking, calling, or applying it. You can call a function by putting
parentheses(put ( )) after an expression that produces a function value. Usually you’ll directly use
the name of the binding that holds the function. The values between the parentheses are given to
the program inside the function. In the example, the prompt function uses the string that we give it
as the text to show in the dialog box. Values given to functions are called arguments. Different
functions might need a different number or different types of arguments.

The prompt function isn’t used much in modern web programming, mostly because you have no
control over the way the resulting dialog looks, but can be helpful in toy programs and experiments.
Function have following syntax :

function fun_name (arguments )

function statements;

where : function is keyword ,fun_name is name for function, arguments are list value pass to
function and function statements are logical operation that would be performed by function.

return
As you'll recall, invoking a function with the ( ) operator is an expression. All expressions have values;
the return statement is used to specify the value returned by a e value of the function invocation
expression. The syntax of the return statement is:

return expression;

A return statement may appear only within the body of a function. It is a syntax error for it to appear
anywhere else. when return statement is executed, expression is evaluated and returned as the
value of the function. Execution of the function stops when return statement is executed, even if
there are other statements remaining in the function. The return statement can be used to return a
value like this:

function square(x) { return x*x; }

Control Statements (control Program flow)

1. If...
The if statement is the fundamental control statement that allows JavaScript to make
decisions, or, more precisely, to execute statements conditionally. Syntax of if is:

if (expression)
statement

expression is evaluated. If the resulting value is true or can be converted to true, statement is
executed. If expression is false or converts to false, the statement is not executed. Example:

if (a > b)

document.write( “ a is greater value”)

if… else….. is second form of if. The syntax for it is as follow:

if(expression)

statement1

else

statement2

In this form of the statement, expression is evaluated, and if it is true, statement1 executed;
otherwise, statement2 is executed. For example:

if (a > b)

document.write( “ a is greater value”)

else

document.write( “ b is greater value”)

2. Switch
An if statement causes a branch in the flow of a program's execution. You can use multiple if
statements, to perform a multiway branch. The switch case syntax :

switch(expression)
{
case 1:
Block1 codes;
break;
case 2:
execute Block2 codes;
break;
case n:
 execute Blockn codes;
break;
default:

Execute default block codes

break;

The switch statement first evaluates the expression that follows the switch keyword, then evaluates
the case expressions, in the order in which they appear, until it finds a value that matches. if none of
the case expressions match the switch expression, the switch statement begins executing its body at
the statement labeled default:.If there is no default: label, the switch statement skips its body
altogether.

Loops
While writing a program, you may encounter a situation where you need to perform an action
over and over again. In such situations, you would need to write loop statements to reduce the
number of lines.

1. while loop
The most basic loop in JavaScript is the while loop , The purpose of a while loop is to
execute a statement or code block repeatedly as long as an expression is true. Once the
expression becomes false, the loop terminates. syntax of While loop is :

while (expression)
{
Statement(s) to be executed
if expression is true
}

Flow Chart :

Example :
while (count < 7)
{
document.write("Current Count : " + count + "<br />");
 count++;
}

2. do...while Loop

The do...while loop is similar to the while loop except that the condition check happens
at the end of the loop. This means that the loop will always be executed at least once,
even if the condition is false.

Syntax :

do {

Statement(s) to be executed;

} while (expression);

Example:

do
{
document.write("Current Count : " + count + "<br />");
count++;
}while (count < 4);
3. for loop
The for loop is the most compact form of looping. It includes the following three
important parts :

i. The loop initialization where we initialize our counter to a starting value. The
initialization statement is executed before the loop begins.
ii. The test statement which will test if a given condition is true or not. If the condition is
true, then the code given inside the loop will be executed, otherwise the control will
come out of the loop.
iii. The iteration statement where you can increase or decrease your counter.

You can put all the three parts in a single line separated by semicolons .

Syntax :
for (initialization; test condition/statement; iteration statement)
{
Statement(s) to be executed
if test condition is true
}

Example :

for(count = 0; count < 10; count++)

{
 document.write("Current Count : " + count );

document.write("<br />");

}
23.04.2020

Array

JavaScript array is an object that represents a collection of similar type of elements. There are 3
ways to construct array in JavaScript

a) By array literal
b) By creating instance of Array directly (using new keyword)
c) By using an Array constructor (using new keyword)

a. JavaScript array literal

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

var array_name=[value1,value2.....valueN];

values are contained inside [ ] and separated by , (comma).

Example : var num=[10,20,30,40,50]

Javascript code:

<script>

var num=[10,20,30,40,50]

len=num.length (.length return the length (element count) of array)

for (i=0; i<len;i++)

document.write( num[i] + “<br>”)

</script>

b. JavaScript Array directly (new keyword)

The syntax of creating array directly is given below: var arrayname=new Array();
Here, new keyword is used to create instance of array.

Javascript code:

<script>

var num= new Array()

num[0]=10

num[1]=20

num[2]=30

num[3]=40

num[5]=50

len=num.length (.length return the length (element count) of array)

for (i=0; i<len;i++)

document.write( num[i] + “<br>”)

</script>

c. JavaScript array constructor (new keyword)

you need to create instance of array by passing arguments in constructor so that we don't
have to provide value explicitly.

Javascript Code:

var num=new Array(10,20,30,40,50)

len=num.length (.length return the length (element count) of array)

for (i=0; i<len;i++)

document.write( num[i] + “<br>”)

</script>

Event
JavaScript's interaction with HTML is handled through events that occur when the user or the
browser manipulates a page.

When the page loads, it is called an event. When the user clicks a button, that click too is an event.
Other examples include events like pressing any key, closing a window, resizing a window, etc.
Developers can use these events to execute JavaScript coded responses, which cause buttons to
close windows, messages to be displayed to users, data to be validated, and virtually any other type
of response imaginable. Events are a part of the Document Object Model (DOM) Level 3 and every
HTML element contains a set of events which can trigger JavaScript Code.
onclick Event Example :

<html>

<head>

<title> Function Demo</title>

<script language="JavaScript">

function fact_num()

var num,fact=1,i

num=Number(document.getElementById("first").value)

for( i=1; i<=num; i++)

fact=fact*i

document.getElementById("ans").value=fact

</script>

</head>

<body>

Enter a Number : <input id="first"> <br>

<button onclick="fact_num()"> Answer </button> </t>

Factorial of given no is :<input id="ans">

</body>

</html>

JavaScript - Document Object Model

Every web page resides inside a browser window which can be considered as an object.

A Document object represents the HTML document that is displayed in that window. The Document
object has various properties that refer to other objects which allow access to and modification of
document content.
The way a document content is accessed and modified is called the Document Object Model, or
DOM. The Objects are organized in a hierarchy. This hierarchical structure applies to the
organization of objects in a Web document.

Window object − Top of the hierarchy. It is the outmost element of the object hierarchy.

Document object − Each HTML document that gets loaded into a window becomes a document
object. The document contains the contents of the page.

Form object − Everything enclosed in the <form>...</form> tags sets the form object.

Form control elements − The form object contains all the elements defined for that object such as
text fields, buttons, radio buttons, and checkboxes.

JavaScript String
The JavaScript string is an object that represents a sequence of characters. There are 2 ways to
create string in JavaScript:

a) By string literal
b) By string object (using new keyword)

a. By string literal
The string literal is created using double quotes. The syntax of creating string using string literal is
given below:

var string_name="string value";

simple example of creating string literal.

<script>

var str="This is string literal Demostration";

document.write(str);

</script>

b. By string object (using new keyword)

The syntax of creating string object using new keyword is given below:

var stringname=new String("string literal");

new keyword is used to create instance of string.

example of creating string in JavaScript by new keyword.

<script>

var str=new String("hello javascript string Demostration ");

document.write(str);

</script>