L3. Operators in JS, CSE 202, BN11.pdf JavaScript

Course Code: CSE 202
Course Title: Computer Programming Lab
Lecture 3: Operators in JS
Course Teacher: Saurav Barua (SB)
Assistant Professor, Dept. of CE, DIU
Phone: +88-01715334075
Email: saurav.ce@diu.edu.bd

Contents
2
Logical
operators
Arithmetic
operator
Assignment
operator
Comparison
operator
Types of
operators
.
Ternary operator

Types of operators
3
There are different types of JavaScript operators:
1. Arithmetic Operators
2. Assignment Operators
3. Comparison Operators
4. String Operators
5. Logical Operators
6. Bitwise Operators
7. Ternary Operators
8. Type Operators

Arithmetic operator
4
Operator Description
+ Addition
- Subtraction
* Multiplication
** Exponentiation (ES2016)
/ Division
% Modulus (Division Remainder)
++ Increment
-- Decrement

Arithmetic operator
5
 i++ stands for i= i+1
 % stands for reminder. Example: 6%4 = 2.

Assignment operator
6
Operator Example Same As
= x = y x = y
+= x += y x = x + y
-= x -= y x = x - y
*= x *= y x = x * y
/= x /= y x = x / y
%= x %= y x = x % y
**= x **= y x = x ** y

Comparison operator
7
Operator Description
== equal to
=== equal value and equal type
!= not equal
!== not equal value or not equal type
> greater than
< less than
>= greater than or equal to
<= less than or equal to
? ternary operator

Comparison operator
8
 20==“20”. //output: True. == only check value.
 20===“20”. //output: False. === check value and data type.
Syntax for ternary operator:
condition ? exprIfTrue : exprIfFalse
Example:
const age = 26;
const beverage = age >= 5 ? “Coke" : "Juice";
console.log(beverage); // output: Coke
Syntax:
variablename = (condition) ? value1:value2
Example: let voteable = (age < 18) ? "Too young":"Old enough";

Logical operator
9
Operator Description Example
&& and (x < 10 && y > 1) is true
|| or (x == 5 || y == 5) is false
! not !(x == y) is true

logical operator
10
Logical operator only return true (1) or false (0).
 Evaluate: (2<3)&&(4>2||3<2)
 Evaluate: (!1&&2>=3)||(3<4)

Worked out example
11
Example 3: Program to take input from prompt and calculate through JS and
display in the browser. (Calculate area of a triangle, take length and height as an
input through prompt and display in the browser.)
Google drive link:
https://drive.google.com/drive/folders/1DNqm-
2rFkuRJXg5Cb6PMa9fgd82mE-pD?usp=drive_link
Git-hub link: https://github.com/sauravbarua02/triangleAreaCalculation

html codes
13
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-
scale=1.0">
<title>LogicControl</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container"
id="container">
<div id="result"></div>
<script src="app.js"></script>
</div>
</body>
</html>

css codes
14
body{
margin: 0px;
background-color: rgba(90,90,230,0.6);
}
.container{
background-color: rgba(90,90,230,0.3);
width: 300px;
height: 300px;
margin: 20px auto;
padding: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
border-radius: 10px;
box-shadow: 0 0 3px 1px rgba(0,0,0,0.5);
font-size: large;
}

JS codes
15
const resultEl =
document.getElementById("result");
const length = prompt("Enter length in meter
= ");
const height = prompt("Enter height in meter
= ");
function areaCal(){
const area = 0.5*length*height;
resultEl.innerText = "Area of the
triangle: " + area + " sq. meter";
}
areaCal();

Class tasks
16
Task 3.1: Program to calculate average penetration in mm from three bitumen
samples in the bitumen penetration test. Take penetration values as input and
display average value in the browser. (hints: average = (val1 + val2 +val3)/3)
Task 3.2: Program to calculate area of a rectangular industrial plot. Take width and
breadth as input and display area (sq. ft) in the browser. (hints: areaRectangle = width x
breadth)
Task 3.3: Program to calculate discharge of an irrigation canal. Take cross-section and
water velocity as input and display discharge (cum/sec) in the browser. (hints:
discharge= crossSection x velocity)
Task 3.4: Program to calculate delay in a signalized intersection. Take travel time and
free flow travel time as input and display delay (sec) in the browser.(hints: delay =
travelTime – freeFlowTravelTime)
Task 3.5: Program to calculate maximum bending moment of a simply supported
beam under UDL . Take UDL and span length as input and display moment (kip-ft) in
the browser.(hints: maxMoment = 1/8 x UDL x span x span)

L3. Operators in JS, CSE 202, BN11.pdf JavaScript

Recommended

More Related Content

Similar to L3. Operators in JS, CSE 202, BN11.pdf JavaScript (20)

More from SauravBarua11 (20)

Recently uploaded (20)

L3. Operators in JS, CSE 202, BN11.pdf JavaScript