JavaScript was invented by Brendan Eich in 1995.

Brendan Eich is an
American computer programmer and technology executive. He created the
JavaScript programming language

What is JavaScript

JavaScript (js) is a light-weight object-oriented programming language which

is used by several websites for scripting the webpages.

It is an interpreted, full-fledged programming language that enables dynamic

interactivity on websites when applied to an HTML document.

2.Features of JavaScript:

There are following features of JavaScript:

1. All popular web browsers support JavaScript as they provide built-in

execution environments.
2. JavaScript follows the syntax and structure of the C programming language.
Thus, it is a structured programming language.
3. JavaScript is an object-oriented programming language that uses
prototypes rather than using classes for inheritance.
4. It is a light-weighted and interpreted language.
5. It is a case-sensitive language.
6. JavaScript is supportable in several operating systems including,
Windows, macOS, etc.
7. It provides good control to the users over the web browsers.

JavaScript Can Change HTML Content

One of many JavaScript HTML methods is getElementById().

 5.JavaScript Operators:-

JavaScript operators are symbols that are used to perform operations on

operands. For example:
var sum=10+20;
Here, + is the arithmetic operator and = is the assignment operator.
There are following types of operators in JavaScript.
Arithmetic Operators
Comparison (Relational) Operators
Bitwise Operators
Logical Operators
Assignment Operators
Special Operators
JavaScript Arithmetic Operators
Arithmetic operators are used to perform arithmetic operations on the
operands. The following operators are known as JavaScript arithmetic
operators.
Operator Description Example
+ Addition 10+20 = 30
- Subtraction 20-10 = 10
* Multiplication 10*20 = 200
/ Division 20/10 = 2
% Modulus (Remainder) 20%10 = 0
++ Increment var a=10; a++; Now a = 11
-- Decrement var a=10; a--; Now a = 9
JavaScript Comparison Operators
The JavaScript comparison operator compares the two operands. The
comparison operators are as follows:
Operator Description Example
== Is equal to 10==20 = false
=== Identical (equal and of same type) 10==20 = false
!= Not equal to 10!=20 = true
!== Not Identical 20!==20 = false
> Greater than 20>10 = true
>= Greater than or equal to 20>=10 = true
< Less than 20<10 = false
<= Less than or equal to 20<=10 = false
JavaScript Bitwise Operators
The bitwise operators perform bitwise operations on operands. The bitwise
operators are as follows:
Operator Description Example
& Bitwise AND (10==20 & 20==33) = false
| Bitwise OR (10==20 | 20==33) = false
^ Bitwise XOR (10==20 ^ 20==33) = false
~ Bitwise NOT (~10) = -10
<< Bitwise Left Shift (10<<2) = 40
>> Bitwise Right Shift (10>>2) = 2
JavaScript Logical Operators
The following operators are known as JavaScript logical operators.
Operator Description Example
&& Logical AND (10==20 && 20==33) = false
|| Logical OR (10==20 || 20==33) = false
! Logical Not !(10==20) = true
JavaScript Assignment Operators
The following operators are known as JavaScript assignment operators.
Operator Description Example
= Assign 10+10 = 20
+= Add and assign var a=10; a+=20; Now a = 30
-= Subtract and assign var a=20; a-=10; Now a = 10
*= Multiply and assign var a=10; a*=20; Now a = 200
/= Divide and assign var a=10; a/=2; Now a = 5
%= Modulus and assign var a=10; a%=2; Now a = 0
JavaScript Special Operators
The following operators are known as JavaScript special operators.
Operator Description
(?:) Conditional Operator returns value based on the condition. It is like if-
else.
, Comma Operator allows multiple expressions to be evaluated as single
statement. let a, b, c;

a = b = 3, c = 4;
delete Delete Operator deletes a property from the object.
The delete operator deletes both the value of the property and the property
itself.
E.g : object
let human = {
name: "John Doe",
age: 15,
country: "Japan"}
delete human["country"]
in this operator checks if object has the given property
instanceof checks if the object is an instance of given type
E.g:
const auto = new Car('Honda', 'Accord', 1998);
console.log(auto instanceof Car);
// Expected output: true

new creates an instance (object)

typeof checks the type of object.
E.g
}
</script>
</body>
</html>
O/P:-
Jai
Vijay
Smith
11.JavaScript Date Object:-

The JavaScript date object can be used to get year, month and day. You
can display a timer on the webpage by the help of JavaScript date object.
You can use different Date constructors to create date object. It provides
methods to get and set day, month, year, hour, minute and seconds.
Constructor
Use of Date constructor to create date object.
Date()
JavaScript Date Example:-

Let's see the simple example to print date object. It prints date and time
both.
The <span> tag is an inline container used to mark up a part of a text, or
a part of a document. The <span> tag is easily styled by CSS or manipulated
with JavaScript using the class or id attribute. The <span> tag is much like the
<div> element, but <div> is a block-level element and <span> is an inline
element.

<html>
<body>
Current Date and Time: <span id="txt"></span>
<script>
var today=new Date();
document.getElementById('txt').innerHTML=today;
</script>
</body>
</html>
O/P:-

JavaScript Current Time Example

Let's see the simple example to print current time of system.
<html>
<body>
Current Time: <span id="txt"></span>
<script>
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
</script>
</body>
</html>
O/P:-

Another code to print date/month/year.

 <html>
<body>
<script>
var date=new Date();
var day=date.getDate();
var month=date.getMonth()+1;
var year=date.getFullYear();
document.write("<br>Date is: "+day+"/"+month+"/"+year);
</script>
</body>
</html>

JavaScript Date Methods:-

Let's see the list of JavaScript date methods with their description.

Methods Description

getDate() It returns the integer value between 1 and 31 that

represents the day for the specified date on the basis
of local time.
getDay() It returns the integer value between 0 and 6 that
represents the day of the week on the basis of local
time.
getFullYears() It returns the integer value that represents the year
on the basis of local time.
getHours() It returns the integer value between 0 and 23 that
represents the hours on the basis of local time.
getMilliseconds() It returns the integer value between 0 and 999 that
represents the milliseconds on the basis of local time.
getMinutes() It returns the integer value between 0 and 59 that
represents the minutes on the basis of local time.
getMonth() It returns the integer value between 0 and 11 that
represents the month on the basis of local time.
getSeconds() It returns the integer value between 0 and 59 that
represents the seconds on the basis of local time.
getUTCDate() It returns the integer value between 1 and 31 that
represents the day for the specified date on the basis
of universal time.
getUTCDay() It returns the integer value between 0 and 6 that
represents the day of the week on the basis of
universal time.
getUTCFullYears() It returns the integer value that represents the year
on the basis of universal time.
getUTCHours() It returns the integer value between 0 and 23 that
represents the hours on the basis of universal time.
getUTCMinutes() It returns the integer value between 0 and 59 that
represents the minutes on the basis of universal time.
getUTCMonth() It returns the integer value between 0 and 11 that
represents the month on the basis of universal time.
getUTCSeconds() It returns the integer value between 0 and 59 that
represents the seconds on the basis of universal
time.
setDate() It sets the day value for the specified date on the basis
of local time.
setDay() It sets the particular day of the week on the basis of
local time.
setFullYears() It sets the year value for the specified date on the
basis of local time.
setHours() It sets the hour value for the specified date on the
basis of local time.
setMilliseconds() It sets the millisecond value for the specified date on
the basis of local time.
setMinutes() It sets the minute value for the specified date on the
basis of local time.
setMonth() It sets the month value for the specified date on the
basis of local time.
setSeconds() It sets the second value for the specified date on the
basis of local time.

JavaScript Digital Clock Example

Let's see the simple example to display digital clock using JavaScript date
object.
There are two ways to set interval in JavaScript: by setTimeout() or setInterval()
method.
<html>
<body>
Current Time: <span id="txt"></span>
<script>
window.onload=function(){getTime();}
function getTime(){
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
var s=today.getSeconds();
// add a zero in front of numbers<10
m=checkTime(m);
s=checkTime(s);
document.getElementById('txt').innerHTML=h+":"+m+":"+s;
set Timeout(function(){getTime()},1000);
}
//setInterval("getTime()",1000);//another way
function checkTime(i){
if (i<10){
i="0" + i;
}
return i;
}
</script>
</body>
</html>
The setTimeout() method calls a function after a number of milliseconds.
1 second = 1000 milliseconds.

12.JavaScript Math:-

The JavaScript math object provides several constants and methods to

perform mathematical operation. Unlike date object, it doesn't have
constructors.

JavaScript Math Methods

Let's see the list of JavaScript Math methods with description.

Methods Description

abs() It returns the absolute value of the given number.

cbrt() It returns the cube root of the given number.
ceil() It returns a smallest integer value, greater than or equal to the
given number.
exp() It returns the exponential form of the given number.
floor() It returns largest integer value, lower than or equal to the given
number.
log() It returns natural logarithm of a number.
max() It returns maximum value of the given numbers.
min() It returns minimum value of the given numbers.
pow() It returns value of base to the power of exponent.
random() It returns random number between 0 (inclusive) and 1
(exclusive).
round() It returns closest integer value of the given number.
sign() It returns the sign of the given number
sqrt() It returns the square root of the given number

Math.sqrt(n)
The JavaScript math.sqrt(n) method returns the square root of the given
number.
<!DOCTYPE html>
<html>
<body>
 Square Root of 17 is: <span id="p1"></span>
<script>
document.getElementById('p1').innerHTML=Math.sqrt(17);
</script>
</body>
</html>

Math.random()
The JavaScript math.random() method returns the random number between 0
to 1.
<!DOCTYPE html>
<html>
<body>
Random Number is: <span id="p2"></span>
<script>
document.getElementById('p2').innerHTML=Math.random();
</script>
</body>
</html>

Math.floor(n)

The JavaScript math.floor(n) method returns the lowest integer for the
given number. For example 3 for 3.7, 5 for 5.9 etc.

<!DOCTYPE html>
<html>
<body>
 Floor of 4.6 is: <span id="p4"></span>
<script>
document.getElementById('p4').innerHTML=Math.floor(4.6);
</script>
</body>
</html>

Math.ceil(n)
The JavaScript math.ceil(n) method returns the largest integer for the
given number. For example 4 for 3.7, 6 for 5.9 etc.

<!DOCTYPE html>
<html>
<body>
Ceil of 4.6 is: <span id="p5"></span>
<script>
document.getElementById('p5').innerHTML=Math.ceil(4.6);
</script>
</body>
</html>

Math.round(n)
The JavaScript math.round(n) method returns the rounded integer nearest
for the given number. If fractional part is equal or greater than 0.5, it goes to
upper value 1 otherwise lower value 0. For example 4 for 3.7, 3 for 3.3, 6 for 5.9
etc.
<!DOCTYPE html>
<html>
<body>
Round of 4.3 is: <span id="p6"></span><br>
Round of 4.7 is: <span id="p7"></span>
<script>
document.getElementById('p6').innerHTML=Math.round(4.3);
document.getElementById('p7').innerHTML=Math.round(4.7);
</script>
</body>
</html>

Math.abs(n)
The JavaScript math.abs(n) method returns the absolute value for the given
number. For example 4 for -4, 6.6 for -6.6 etc.

<!DOCTYPE html>
<html>
<body>
Absolute value of -4 is: <span id="p8"></span>
<script>
document.getElementById ('p8').innerHTML=Math.abs (-4);
</script>
</body>
</html>