Scribd
Upload
36 views

L6 - If - Switch - Case - (1.5 - 1.6)

The document provides an overview of JavaScript programming basics including features, objects, values, variables, operators, conditional statements like if/else, switch/case, loops, and querying/setting/deleting properties. It covers topics like dot notation, properties, methods, if/else statements, switch/case statements, for, while, do/while and for/in loops.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
36 views

L6 - If - Switch - Case - (1.5 - 1.6)

The document provides an overview of JavaScript programming basics including features, objects, values, variables, operators, conditional statements like if/else, switch/case, loops, and querying/setting/deleting properties. It covers topics like dot notation, properties, methods, if/else statements, switch/case statements, for, while, do/while and for/in loops.

Uploaded by

Aryan K
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 28

Overview :

Client Side Scripting


Language (22519)
Unit 1 :
Basics of JavaScript
Programming
(12 M)

P R O G R A M : IN F O R M ATI O N T E C H N O L O G Y ( N B A
A C C R E D ITED )
: V
N A M E O F FA C U LTY: M S . E M A I L :
y o g it a . k h a n d a g a le@v p t . e d u . in
Basics of JavaScript
Programming
1.1 Features of JavaScript
1.2 Object Name, Property, Method, Dot Syntax, Main Event
1.3 Values and Variables
1.4 Operators and Expressions
1.5 if statement , if…else. If…elseif, Nested if
1.6 switch… case statement
1.7 Loop statement
1.8 Querying and setting properties and Deleting properties,
Property Getters and Setters
1.5 if statement(Conditional)
Conditional statements are used to perform different actions based on
different conditions.
In JavaScript we have the following conditional statements:
The if Statement
Use if statement to specify a block of JavaScript code to be executed if a
condition is true.
if (condition)
Syntax: {
//block of code to be executed if the condition is
true
}

<html>
Example: <body>
<script>
if (new Date().getHours() < 18)
{
document.write("Good day!");
}
</script>
</body>
</html>
The else Statement
Use else statement to specify a block of code to be executed if the
condition is false.
Syntax:
if (condition)
{
// block of code to be executed if the condition
is true
} else
{
// block of code to be executed if the condition
is false
}
The else Statement-Example
<html> <body>
<script>
if (new Date().getHours() < 18)
{
document.write("Good day!");
}
else
{
document.write("Good Evening!");
}
</script>
</body> </html>
The else if Statement
Use else if statement to specify a new condition if the first condition is
false.
 Syntax:
if (condition1)
{ // block of code to be executed if condition1 is true
}
else if (condition2)
{ // block of code to be executed if the condition1 is false
and condition2 is true
}
else
{ // block of code to be executed if the condition1 is false
and condition2 is false
}
The else if Statement-Example
<html> greeting = "Good day";
<body> }
<script> else
var greeting; {
var time = new Date().getHours();
greeting = "Good evening";
if (time < 10)
}
{
document.write(greeting);
greeting = "Good morning";
</script>
}
</body>
else if (time < 20)
</html>
{
The switch case Statement
The switch statement is used to perform different actions based on
different conditions.
It is used to select one of many code blocks to be executed.
Syntax:
switch(expression)
{
This is how it works:
case x:
// code block
•The switch expression is evaluated once.
break; •The value of the expression is compared with the values
case y: of each case.
// code block •If there is a match, the associated block of code is
break; executed.
default: •If there is no match, the default code block is executed.
// code block
}
1.6 The switch case-Example
<html> case 3:
<body> day = "Wednesday";
<script> break;
var day; Case 4:
switch (new Date().getDay()) day = "Thursday";
{ break;
case 0: case 5:
day = "Sunday"; day = "Friday";
break; break;
case 1: case 6:
day = "Monday"; day = "Saturday";
break; }
case 2: document.write("Today is " +
day);
day = "Tuesday";
</script>
break;
</body>
</html>
default keyword
default keyword specifies the code to run if there is no case match.
The getDay() method returns the weekday as a number between 0
and 6.
If today is neither Saturday (6) nor Sunday (0), write a default
message.
switch (new Date().getDay())
{
case 6:
text = "Today is Saturday";
break;
case 0:
text = "Today is Sunday";
break;
default:
text = "Looking forward to the Weekend";
}
1.7 JavaScript Loop Statement
The JavaScript loops are used to iterate the piece of code using
for, while, do while or for-in loops.
There are four types of loops in JavaScript.
for loop
while loop
do-while loop
for-in loop
for Loop
The JavaScript for loop iterates the elements for the fixed
number of times. It should be used if number of iteration is
known.
for (initialization; condition; increment)
Syntax: {
Code to be executed
}
<script>
Example: for (i=0; i<=10; i=i+2)
{
document.write(i + "<br/>")
}
</script>
do while Loop
loop is a variant of the while loop.
This loop will execute the code block once.
before checking if the condition is true, then it will repeat the loop as
long as the condition is true.
do
Syntax: <script> {
code to be executed
var i=21; }
do{ while (condition);
document.write(i +"<br/>");
Example:
i++;
}while (i<=25);
</script>
while Loop
The JavaScript while loop loops through a block of code as long as
a specified condition is true.
Syntax: while ( condition)
{
Code to be executed
}
Example: var i=11;
while (i<=20)
{
document.write(i + "<br/>");
i++;
}
For-in Loop
The for..in statement loops through the properties of an object.
The block of code inside the loop will be executed once for each
property. for (variable_name in object)
Syntax: {
Code to be executed
}
<script type = "text/javaScript">
var lang = { first : "C", second : "Java",third : "Python", fourth :
Example: “PHP"};
for (prog in lang)
{ C
document.write(lang[prog] + "<br >"); Java
} Python
</script> PHP
break statement
break statement breaks the loop and continues executing the code after
the loop.
The break statement can also be used to jump out of a loop.
Example: var text = "";
var i; The number is 0
for (i = 0; i < 10; i++) The number is 1
{ The number is 2
The number is 3
if (i === 4)
{ break;
}
text =text + "The number is " + i + "<br>";
}
document.write(text);
</script>
continue statement
Continue statement breaks one iteration (in the loop), if a specified
condition occurs, and continues with the next iteration in the loop.
Example:
var text = "";
var i; The number is 0
for (i = 0; i < =6; i++) The number is 1
The number is 2
{
The number is 3
if (i === 4) The number is 5
{continue; The number is 6
}
text =text + "The number is " + i + "<br>";
}
document.write(text);
</script>
1.8 Querying and Setting Properties
To obtain the value of a property, use . (dot) operator or square[ ]
bracket.
The left hand side should be an expression whose value is an
object.
If using dot (.) operator, the right-hand must be a simple
identifier that names the property.
If using square brackets, the value within the brackets must be an
expression that evaluates to a string that contains the desired
property name.
1.8 Querying and Setting Properties
Example,
var name=author.lastname; //get the “lastname ” property of the book.

var title=book[“main title”]; //get the “main title” property of the book.

To create or set a property, use a dot or square brackets as you


would to query the property, but put them on the left-hand side of
an assignment expression:
Example, book.price=250; //create or set a property of price.

book[“main title”]=“JavaScript” //set the “main title” property.


Deleting properties
The delete operator deletes a property from an object.
The delete operator deletes both the value of the property and the
property itself.
Syntax:
delete var_name.property;
Example, delete person.name; or
delete person[“name”];
Deleting properties
<html>
<body>
<script>
var a={name:"Priti",age:35};
document.write(a.name+" "+a.age+"<br>");
delete a.age; //delete property
document.write(a.name+" "+a.age);
</script>
</body> Priti 35
</html Priti undefined
Property getter and setter
Also known as Javascript assessors.
Getters and setters allow you to control how important variables
are accessed and updated in your code.
JavaScript can secure better data quality when using getters and
setters.
JavaScript Function or Getter ?

<script>
// Create an object:
var person = { firstName: "Chirag", lastName : "Shetty",
fullName : function()
{
return this.firstName + " " + this.lastName;
}
}; This example access fullName as a
document.write(person.fullName());function: person.fullName().
</script>
JavaScript Function or Getter ?

<script>
// Create an object:
var person = { firstName: "Yash ", lastName : "Desai",
get fullName()
{
return this.firstName + " " + this.lastName;
} This example fullName as a
}; property: person.fullName.
// Display data from the object using a getter
document.write(person.fullName);
</script>
Quiz ?

https://forms.office.com/Pages/ResponsePage.aspx?
id=QEUap70T20yz690UXwrJwIuVSIKHZ3RDo4EeJ2CYjgFUMENJTl
FVWDVaQVEwSUU1REY2RVZVOVVMWC4u

You might also like