JavaScript Operators

Java Script Operators
DR.G.JASMINE BEULAH
ASSISTANT PROFESSOR, KRISTU JAYANTI COLLEGE, BENGALURU

Assign values to variables and add them together:
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Operators</h2>
<p>x = 5, y = 2, calculate z = x + y, and display z:</p>
<p id="demo"></p>
<script>
var x = 5;
var y = 2;
var z = x + y;
document.getElementById("demo").innerHTML = z;
</script>
</body>
</html>

The assignment operator (=) assigns a value to
a variable.
<!DOCTYPE html>
<html>
<body>
<h2>The = Operator</h2>
<p id="demo"></p>
<script>
var x = 10;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>

JavaScript Arithmetic Operators

JavaScript Assignment Operators

Assignment
<!DOCTYPE html>
<html>
<body>
<h2>The += Operator</h2>
<p id="demo"></p>
<script>
var x = 10;
x += 5;
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>

JavaScript String Operators
The + operator can also be used to add
(concatenate) strings.
<!DOCTYPE html>
<html>
<body>
<p>The + operator concatenates (adds) strings.</p>
<p id="demo"></p>
<script>
var txt1 = "John";
var txt2 = "Doe";
document.getElementById("demo").innerHTML = txt1 + " " + txt2;
</script>
</body>
</html>

Adding Strings and Numbers
<!DOCTYPE html>
<html>
<body>
<p>Adding a number and a string, returns a string.</p>
<p id="demo"></p>
<script>
var x = 5 + 5;
var y = "5" + 5;
var z = "Hello" + 5;
document.getElementById("demo").innerHTML =
x + "<br>" + y + "<br>" + z;
</script>
</body>
</html>

JavaScript Comparison Operators

JavaScript if else and else if
Conditional statements are used to perform different actions based on different conditions.
 In JavaScript we have the following conditional statements:
 Use if to specify a block of code to be executed, if a specified condition is true
 Use else to specify a block of code to be executed, if the same condition is false
 Use else if to specify a new condition to test, if the first condition is false
 Use switch to specify many alternative blocks of code to be executed

The If Statement
 Use the if statement to specify a block of JavaScript code to be executed if a condition is true.
 Syntax
 if (condition) {
// block of code to be executed if the condition is true
}

The If Statement
<html>
<body>
<p>Display "Good day!" if the hour is less than 18:00:</p>
<p id="demo">Good Evening!</p>
<script>
if (new Date().getHours() < 18)
{
document.getElementById("demo").innerHTML = "Good day!";
}
</script>
</body>
</html>

<html>
<body>
<p>Click the button to display a time-based greeting:</p>
<button onclick="myFunction()">Try it</button>
<p id="demo"></p>
<script>
function myFunction() {
var hour = new Date().getHours();
var greeting;
if (hour < 18) {
greeting = "Good day";
} else {
greeting = "Good evening";
}
document.getElementById("demo").innerHTML = greeting;
}
</script>
</body>
</html>

The JavaScript Switch Statement
 Use the switch statement to select one of many code blocks to be executed.
Syntax
switch(expression) {
case x:
// code block
break;
case y:
// code block
break;
default:
// code block
}
This is how it works:
 The switch expression is evaluated once.
 The value of the expression is compared with the values of each case.
 If there is a match, the associated block of code is executed.
 If there is no match, the default code block is executed.

<html>
<body>
<p id="demo"></p>
<script>
var day;
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;

case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
}
document.getElementById("demo").innerHTML = "Today is " + day;
</script>
</body>
</html>

JavaScript Operators

More Related Content

What's hot (20)

Similar to JavaScript Operators (20)

More from Dr. Jasmine Beulah Gnanadurai (20)

Recently uploaded (20)

JavaScript Operators