JavaScript Index
JavaScript Tutorial
o JavaScript Introduction
o JavaScript Example
o External JavaScript
JavaScript Basics
o JavaScript Comment
o JavaScript Variable
o JavaScript Global Variable
o JavaScript Data Types
o JavaScript Operators
o JavaScript If Statement
o JavaScript Switch
o JavaScript Loop
o JavaScript Function
JavaScript Objects
o JavaScript Object
o JavaScript Array
o JavaScript String
o JavaScript Date
o JavaScript Math
o JavaScript Number
o JavaScript Boolean
o JavaScript DataView
o JavaScript Function
o JavaScript handler
o JavaScript JSON
o JavaScript Number
o JavaScript Reflect
o JavaScript RegExp
o JavaScript Symbol
JavaScript BOM
o Browser Objects
o 1) Window Object
o 2) History Object
o 3) Navigator Object
o 4) Screen Object
JavaScript DOM
o 5) Document Object
o getElementById
o getElementsByName
o getElementsByTagName
o JavaScript innerHTML property
o JavaScript innerText property
JavaScript Validation
o JavaScript form validation
o JavaScript email validation
JavaScript OOPs
o JavaScript Class
o JavaScript Object
o JavaScript Prototype
o JavaScript constructor Method
o JavaScript static Method
o JavaScript Encapsulation
o JavaScript Inheritance
o JavaScript Polymorphism
o JavaScript Abstraction
JavaScript Cookies
o JavaScript Cookies
o Cookie Attributes
o Cookie with multiple Name
o Deleting Cookies
JavaScript Events
HTML/DOM Events
JavaScript Misc
o JavaScript this Keyword
o JavaScript Debugging
o JavaScript Hoisting
o JavaScript Strict Mode
JavaScript Advance
o JavaScript TypedArray
o JavaScript Set
o JavaScript Map
o JavaScript WeakSet
o JavaScript WeakMap
Interview Questions
o JavaScript Interview Questions
JavaScript Methods
JavaScript Array Object
o JavaScript Array
o Array concat() method
o Array copywithin() method
o Array every() method
o Array fill() method
o Array filter() method
o Array find() method
o Array findIndex() method
o Array forEach() method
o Array includes() method
o Array indexOf() method
o Array join() method
o Array lastIndexOf() method
o Array map() method
o Array pop() method
o Array push() method
o Array reverse() method
o Array shift() method
o Array slice() method
o Array sort() method
o Array splice() method
o Array unshift() method
JavaScript DataView Object
o JavaScript DataView
o DataView getFloat32() method
o DataView getFloat64() method
o DataView getInt8() method
o DataView getInt16() method
o DataView getInt32() method
o DataView getUint8() method
o DataView getUint16() method
o DataView getUint32() method
JavaScript Function Object
o JavaScript Function
o Function apply() method
o Function bind() method
o Function call() method
o Function toString() method
JavaScript Date Object
o JavaScript Date
o date getDate() method
o date getDay() method
o date getFullYears() method
o date getHours() method
o date getMilliseconds() method
o date getMinutes() method
o date getMonth() method
o date getSeconds() method
o date getUTCDate() method
o date getUTCDay() method
o date getUTCFullYears() method
o date getUTCHours() method
o date getUTCMinutes() method
o date getUTCMonth() method
o date getUTCSeconds() method
o date setDate() method
o date setDay() method
o date setFullYears() method
o date setHours() method
o date setMilliseconds() method
o date setMinutes() method
o date setMonth() method
o date setSeconds() method
o date setUTCDate() method
o date setUTCDay() method
o date setUTCFullYears() method
o date setUTCHours() method
o date setUTCMilliseconds() method
o date setUTCMinutes() method
o date setUTCMonth() method
o date setUTCSeconds() method
o date toDateString() method
o date toISOString() method
o date toJSON() method
o date toString() method
o date toTimeString() method
o date toUTCString() method
o date valueOf() method
JavaScript handler Object
o JavaScript handler
o handler apply() method
o handler construct() method
o handler defineProperty() method
o handler deleteProperty() method
o handler get() method
o handler getOwnPropertyDescriptor() method
o handler getPrototypeOf() method
o handler has() method
o handler isExtensible() method
o handler ownKeys() method
o handler preventExtensions() method
o handler set() method
o handler setPrototypeOf() method
JavaScript JSON Object
o JavaScript JSON
o [Link]() method
o [Link]() method
JavaScript Map Object
o JavaScript Map
o Map clear() method
o Map delete() method
o Map entries() method
o Map forEach() method
o Map get() method
o Map has() method
o Map keys() method
o Map set() method
o Map values() method
JavaScript Math Object
o JavaScript Math
o Math abs() method
o Math acos() method
o Math asin() method
o Math atan() method
o Math cbrt() method
o Math ceil() method
o Math cos() method
o Math cosh() method
o Math exp() method
o Math floor() method
o Math hypot() method
o Math log() method
o Math max() method
o Math min() method
o Math pow() method
o Math random() method
o Math round() method
o Math sign() method
o Math sin() method
o Math sinh() method
o Math sqrt() method
o Math tan() method
o Math tanh() method
o Math trunc() method
JavaScript Number Object
o JavaScript Number
o Number isFinite() method
o Number isInteger() method
o Number parseFloat() method
o Number parseInt() method
o Number toExponential() method
o Number toFixed() method
o Number toPrecision() method
o Number toString() method
JavaScript RegExp Object
o JavaScript RegExp
o [Link]() method
o [Link]() method
o [Link]() method
JavaScript Object
o JavaScript Object
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o getOwnPropertyDescriptor() method
o getOwnPropertyDescriptors() method
o getOwnPropertyNames() method
o getOwnPropertySymbols() method
o [Link]() method
o [Link]() method
o preventExtensions() method
o [Link]() method
o [Link]() method
o [Link]() method
JavaScript Reflect Object
o JavaScript Reflect
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o getOwnPropertyDescriptor() method
o [Link]() method
o [Link]() method
o [Link]() method
o [Link]() method
o preventExtensions() method
o [Link]() method
o [Link]() method
JavaScript Set Object
o JavaScript Set
o Set add() method
o Set clear() method
o Set delete() method
o Set entries() method
o Set forEach() method
o Set has() method
o Set values() method
JavaScript String Object
o String charAt() method
o String charAt() method
o String charCodeAt() method
o String concat() method
o String indexOf() method
o String lastIndexOf() method
o String search() method
o String match()
o String replace() method
o String substr() method
o String substring() method
o String slice() method
o String toLowerCase() method
o toLocaleLowerCase() method
o String toUpperCase() method
o toLocaleUpperCase() method
o String toString() method
o String valueOf() method
JavaScript Symbol Object
o JavaScript Symbol
o [Link]() method
o [Link]() method
o [Link]() method
Symbol Property
o [Link] Property
o isConcatSpreadable Property
o [Link] Property
o [Link] Property
o [Link] Property
o [Link] Property
o [Link] Property
o [Link] Property
o [Link] Property
JavaScript TypedArray Object
o JavaScript TypedArray
o TypedArray copyWithin() method
o TypedArray entries() method
o TypedArray every() method
o TypedArray fill() method
o TypedArray filter() method
o TypedArray find() method
o TypedArray findIndex() method
o TypedArray forEach() method
o TypedArray includes() method
o TypedArray indexof() method
o TypedArray join() method
o TypedArray Keys() method
o TypedArray lastIndexof() method
o TypedArray map() method
o TypedArray reduce() method
o TypedArray reduceRight() method
o TypedArray reverse() method
o TypedArray set() method
o TypedArray Slice() method
o TypedArray some() method
o TypedArray sort() method
o TypedArray subarray() method
o TypedArray values() method
o toLocaleString() method
o TypedArray toString() method
JavaScript WeakMap Object
o JavaScript WeakMap
o WeakMap delete() method
o WeakMap get() method
o WeakMap has() method
o WeakMap set() method
JavaScript WeakSet Object
o JavaScript WeakSet
o WeakSet add() method
o WeakSet delete() method
o WeakSet has() method
JavaScript is an object-based scripting language which is lightweight and cross-platform.
JavaScript is not a compiled language, but it is a translated language. The JavaScript Translator (embedded in
the browser) is responsible for translating the JavaScript code for the web browser.
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. It was introduced in the year 1995 for adding
programs to the webpages in the Netscape Navigator browser. Since then, it has been adopted by all other
graphical web browsers. With JavaScript, users can build modern web applications to interact directly without
reloading the page every time. The traditional website uses js to provide several forms of interactivity and
simplicity.
Although, JavaScript has no connectivity with Java programming language. The name was suggested and
provided in the times when Java was gaining popularity in the market. In addition to web browsers, databases
such as CouchDB and MongoDB uses JavaScript as their scripting and query language.
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 a weakly typed language, where certain types are implicitly cast (depending on the
operation).
4. JavaScript is an object-oriented programming language that uses prototypes rather than using classes
for inheritance.
5. It is a light-weighted and interpreted language.
6. It is a case-sensitive language.
7. JavaScript is supportable in several operating systems including, Windows, macOS, etc.
8. It provides good control to the users over the web browsers.
History of JavaScript
In 1993, Mosaic, the first popular web browser, came into existence. In the year 1994, Netscape was founded
by Marc Andreessen. He realized that the web needed to become more dynamic. Thus, a 'glue language' was
believed to be provided to HTML to make web designing easy for designers and part-time programmers.
Consequently, in 1995, the company recruited Brendan Eich intending to implement and embed Scheme
programming language to the browser. But, before Brendan could start, the company merged with Sun
Microsystems for adding Java into its Navigator so that it could compete with Microsoft over the web
technologies and platforms. Now, two languages were there: Java and the scripting language. Further, Netscape
decided to give a similar name to the scripting language as Java's. It led to 'Javascript'. Finally, in May 1995,
Marc Andreessen coined the first code of Javascript named 'Mocha'. Later, the marketing team replaced the
name with 'LiveScript'. But, due to trademark reasons and certain other reasons, in December 1995, the
language was finally renamed to 'JavaScript'. From then, JavaScript came into existence.
Application of JavaScript
JavaScript is used to create interactive websites. It is mainly used for:
o Client-side validation,
o Dynamic drop-down menus,
o Displaying date and time,
o Displaying pop-up windows and dialog boxes (like an alert dialog box, confirm dialog box and prompt
dialog box),
o Displaying clocks etc.
JavaScript Example
<script>
[Link]("Hello JavaScript by JavaScript");
</script>
Output:
JavaScript Example
Within body tag
Within head tag
Javascript example is easy to code. JavaScript provides 3 places to put the JavaScript code: within body tag,
within head tag and external JavaScript file.
Let’s create the first JavaScript example.
<script type="text/javascript">
[Link]("JavaScript is a simple language for javatpoint learners");
</script>
Output:
The script tag specifies that we are using JavaScript.
The text/javascript is the content type that provides information to the browser about the data.
The [Link]() function is used to display dynamic content through JavaScript. We will learn about
document object in detail later.
3 Places to put JavaScript code
1. Between the body tag of html
2. Between the head tag of html
3. In .js file (external javaScript)
1) JavaScript Example : code between the body tag
In the above example, we have displayed the dynamic content using JavaScript. Let’s see the simple example of
JavaScript that displays alert dialog box.
<script type="text/javascript">
alert("Hello Javatpoint");
</script>
2) JavaScript Example : code between the head tag
Let’s see the same example of displaying alert dialog box of JavaScript that is contained inside the head tag.
In this example, we are creating a function msg(). To create function in JavaScript, you need to write function
with function_name as given below.
To call function, you need to work on event. Here we are using onclick event to call msg() function.
<html>
<head>
<script type="text/javascript">
function msg(){
alert("Hello Javatpoint");
}
</script>
</head>
<body>
<p>Welcome to JavaScript</p>
<form>
<input type="button" value="click" > </form>
</body>
</html>
External JavaScript file
We can create external JavaScript file and embed it in many html page.
It provides code re usability because single JavaScript file can be used in several html pages.
An external JavaScript file must be saved by .js extension. It is recommended to embed all JavaScript files into a
single file. It increases the speed of the webpage.
Let's create an external JavaScript file that prints Hello Javatpoint in a alert dialog box.
[Link]
function msg(){
alert("Hello Javatpoint");
}
Let's include the JavaScript file into html page. It calls the JavaScript function on button click.
[Link]
<html>
<head>
<script type="text/javascript" src="[Link]"></script>
</head>
<body>
<p>Welcome to JavaScript</p>
<form>
<input type="button" value="click" > </form>
</body>
</html>
Advantages of External JavaScript
There will be following benefits if a user creates an external javascript:
1. It helps in the reusability of code in more than one HTML file.
2. It allows easy code readability.
3. It is time-efficient as web browsers cache the external js files, which further reduces the page loading
time.
4. It enables both web designers and coders to work with html and js files parallelly and separately, i.e.,
without facing any code conflictions.
5. The length of the code reduces as only we need to specify the location of the js file.
Disadvantages of External JavaScript
There are the following disadvantages of external files:
1. The stealer may download the coder's code using the url of the js file.
2. If two js files are dependent on one another, then a failure in one file may affect the execution of the
other dependent file.
3. The web browser needs to make an additional http request to get the js code.
4. A tiny to a large change in the js code may cause unexpected results in all its dependent files.
5. We need to check each file that depends on the commonly created external javascript file.
6. If it is a few lines of code, then better to implement the internal javascript code.
JavaScript Comment
The JavaScript comments are meaningful way to deliver message. It is used to add information about the code,
warnings or suggestions so that end user can easily interpret the code.
The JavaScript comment is ignored by the JavaScript engine i.e. embedded in the browser.
Advantages of JavaScript comments
There are mainly two advantages of JavaScript comments.
1. To make code easy to understand It can be used to elaborate the code so that end user can easily
understand the code.
2. To avoid the unnecessary code It can also be used to avoid the code being executed. Sometimes, we
add the code to perform some action. But after sometime, there may be need to disable the code. In
such case, it is better to use comments.
Types of JavaScript Comments
There are two types of comments in JavaScript.
1. Single-line Comment
2. Multi-line Comment
JavaScript Single line Comment
It is represented by double forward slashes (//). It can be used before and after the statement.
Let’s see the example of single-line comment i.e. added before the statement.
<script>
// It is single line comment
[Link]("hello javascript");
</script>
Let’s see the example of single-line comment i.e. added after the statement.
<script>
var a=10;
var b=20;
var c=a+b;//It adds values of a and b variable
[Link](c);//prints sum of 10 and 20
</script>
JavaScript Multi line Comment
It can be used to add single as well as multi line comments. So, it is more convenient.
It is represented by forward slash with asterisk then asterisk with forward slash. For example:
/* your code here */
It can be used before, after and middle of the statement.
<script>
/* It is multi line comment.
It will not be displayed */
[Link]("example of javascript multiline comment");
</script>
JavaScript Variable
1. JavaScript variable
2. JavaScript Local variable
3. JavaScript Global variable
A JavaScript variable is simply a name of storage location. There are two types of variables in JavaScript :
local variable and global variable.
There are some rules while declaring a JavaScript variable (also known as identifiers).
1. Name must start with a letter (a to z or A to Z), underscore( _ ), or dollar( $ ) sign.
2. After first letter we can use digits (0 to 9), for example value1.
3. JavaScript variables are case sensitive, for example x and X are different variables.
Correct JavaScript variables
1. var x = 10;
2. var _value="sonoo";
Incorrect JavaScript variables
1. var 123=30;
2. var *aa=320;
Example of JavaScript variable
Let’s see a simple example of JavaScript variable.
<script>
var x = 10;
var y = 20;
var z=x+y;
[Link](z);
</script>
Output of the above example
30
JavaScript local variable
A JavaScript local variable is declared inside block or function. It is accessible within the function or block
only. For example:
<script>
function abc(){
var x=10;//local variable
}
</script>
Or,
<script>
If(10<13){
var y=20;//JavaScript local variable
}
</script>
JavaScript global variable
A JavaScript global variable is accessible from any function. A variable i.e. declared outside the function or
declared with window object is known as global variable. For example:
<script>
var data=200;//gloabal variable
function a(){
[Link](data);
}
function b(){
[Link](data);
}
a();//calling JavaScript function
b();
</script>
JavaScript Global Variable
A JavaScript global variable is declared outside the function or declared with window object. It can be
accessed from any function.
Let’s see the simple example of global variable in JavaScript.
<script>
var value=50;//global variable
function a(){
alert(value);
}
function b(){
alert(value);
}
Declaring JavaScript global variable within function
To declare JavaScript global variables inside function, you need to use window object. For example:
</script>
[Link]=90;
Now it can be declared inside any function and can be accessed from any function. For example:
function m(){
[Link]=100;//declaring global variable by window object
}
function n(){
alert([Link]);//accessing global variable from other function
}
Internals of global variable in JavaScript
When you declare a variable outside the function, it is added in the window object internally. You can access it
through window object also. For example:
var value=50;
function a(){
alert([Link]);//accessing global variable
}
Javascript Data Types
JavaScript provides different data types to hold different types of values. There are two types of data types in
JavaScript.
1. Primitive data type
2. Non-primitive (reference) data type
JavaScript is a dynamic type language, means you don't need to specify type of the variable because it is
dynamically used by JavaScript engine. You need to use var here to specify the data type. It can hold any type
of values such as numbers, strings etc. For example:
var a=40;//holding number
var b="Rahul";//holding string
JavaScript primitive data types
There are five types of primitive data types in JavaScript. They are as follows:
Data Type Description
String represents sequence of characters e.g. "hello"
Number represents numeric values e.g. 100
Boolean represents boolean value either false or true
Undefined represents undefined value
Null represents null i.e. no value at all
JavaScript non-primitive data types
The non-primitive data types are as follows:
Data Type Description
Object represents instance through which we can access members
Array represents group of similar values
RegExp represents regular expression
We will have great discussion on each data type later.
JavaScript Operators
JavaScript operators are symbols that are used to perform operations on operands. For example:
1. var sum=10+20;
Here, + is the arithmetic operator and = is the assignment operator.
There are following types of operators in JavaScript.
1. Arithmetic Operators
2. Comparison (Relational) Operators
3. Bitwise Operators
4. Logical Operators
5. Assignment Operators
6. 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
>>> Bitwise Right Shift with Zero (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.
delete Delete Operator deletes a property from the object.
in In Operator checks if object has the given property
instanceof checks if the object is an instance of given type
new creates an instance (object)
typeof checks the type of object.
void it discards the expression's return value.
yield checks what is returned in a generator by the generator's iterator.
JavaScript If-else
The JavaScript if-else statement is used to execute the code whether condition is true or false . There are three
forms of if statement in JavaScript.
1. If Statement
2. If else statement
3. if else if statement
JavaScript If statement
It evaluates the content only if expression is true. The signature of JavaScript if statement is given below.
1. if(expression){
2. //content to be evaluated
3. }
Flowchart of JavaScript If statement
Let’s see the simple example of if statement in javascript.
<script>
var a=20;
if(a>10){
[Link]("value of a is greater than 10");
}
</script>
Output of the above example
value of a is greater than 10
JavaScript If...else Statement
It evaluates the content whether condition is true of false. The syntax of JavaScript if-else statement is given
below.
if(expression){
//content to be evaluated if condition is true
}
else{
//content to be evaluated if condition is false
}
Flowchart of JavaScript If...else statement
Let’s see the example of if-else statement in JavaScript to find out the even or odd number.
<script>
var a=20;
if(a%2==0){
[Link]("a is even number");
}
else{
[Link]("a is odd number");
}
</script>
Output of the above example
a is even number
JavaScript If...else if statement
It evaluates the content only if expression is true from several expressions. The signature of JavaScript if else if
statement is given below.
if(expression1){
//content to be evaluated if expression1 is true
}
else if(expression2){
//content to be evaluated if expression2 is true
}
else if(expression3){
//content to be evaluated if expression3 is true
}
else{
//content to be evaluated if no expression is true
}
Let’s see the simple example of if else if statement in javascript.
<script>
var a=20;
if(a==10){
[Link]("a is equal to 10");
}
else if(a==15){
[Link]("a is equal to 15");
}
else if(a==20){
[Link]("a is equal to 20");
}
else{
[Link]("a is not equal to 10, 15 or 20");
}
</script>
Output of the above example
a is equal to 20
JavaScript Switch
The JavaScript switch statement is used to execute one code from multiple expressions. It is just like else if
statement that we have learned in previous page. But it is convenient than if..else..if because it can be used with
numbers, characters etc.
The signature of JavaScript switch statement is given below.
switch(expression){
case value1:
code to be executed;
break;
case value2:
code to be executed;
break;
......
default:
code to be executed if above values are not matched;
}
Let’s see the simple example of switch statement in javascript.
<script>
var grade='B';
var result;
switch(grade){
case 'A':
result="A Grade";
break;
case 'B':
result="B Grade";
break;
case 'C':
result="C Grade";
break;
default:
result="No Grade";
}
[Link](result);
</script>
Output of the above example
B Grade
The switch statement is fall-through i.e. all the cases will be evaluated if you don't use break statement.
Let’s understand the behaviour of switch statement in JavaScript.
<script>
var grade='B';
var result;
switch(grade){
case 'A':
result+=" A Grade";
case 'B':
result+=" B Grade";
case 'C':
result+=" C Grade";
default:
result+=" No Grade";
}
[Link](result);
</script>
Output of the above example
undefined B Grade C Grade No Grade
JavaScript Loops
The JavaScript loops are used to iterate the piece of code using for, while, do while or for-in loops. It makes
the code compact. It is mostly used in array.
There are four types of loops in JavaScript.
1. for loop
2. while loop
3. do-while loop
4. for-in loop
1) JavaScript 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. The syntax of for loop is given below.
for (initialization; condition; increment)
{
code to be executed
}
Let’s see the simple example of for loop in javascript.
<script>
for (i=1; i<=5; i++)
{
[Link](i + "<br/>")
}
</script>
Output:
1
2
3
4
5
2) JavaScript while loop
The JavaScript while loop iterates the elements for the infinite number of times. It should be used if number of
iteration is not known. The syntax of while loop is given below.
while (condition)
{
code to be executed
}
Let’s see the simple example of while loop in javascript.
<script>
var i=11;
while (i<=15)
{
[Link](i + "<br/>");
i++;
}
</script>
Output:
11
12
13
14
15
3) JavaScript do while loop
The JavaScript do while loop iterates the elements for the infinite number of times like while loop. But, code
is executed at least once whether condition is true or false. The syntax of do while loop is given below.
do{
code to be executed
}while (condition);
Let’s see the simple example of do while loop in javascript.
<script>
var i=21;
do{
[Link](i + "<br/>");
i++;
}while (i<=25);
</script>
Output:
21
22
23
24
25
JavaScript Functions
JavaScript functions are used to perform operations. We can call JavaScript function many times to reuse the
code.
Advantage of JavaScript function
There are mainly two advantages of JavaScript functions.
1. Code reusability: We can call a function several times so it save coding.
2. Less coding: It makes our program compact. We don’t need to write many lines of code each time to
perform a common task.
JavaScript Function Syntax
The syntax of declaring function is given below.
function functionName([arg1, arg2, ...argN]){
//code to be executed
}
JavaScript Functions can have 0 or more arguments.
JavaScript Function Example
Let’s see the simple example of function in JavaScript that does not has arguments.
<script>
function msg(){
alert("hello! this is message");
}
</script>
<input type="button" value="call function"/>
Output of the above example
JavaScript Function Arguments
We can call function by passing arguments. Let’s see the example of function that has one argument.
<script>
function getcube(number){
alert(number*number*number);
}
</script>
<form>
<input type="button" value="click" > </form>
Output of the above example
Function with Return Value
We can call function that returns a value and use it in our program. Let’s see the example of function that
returns value.
<script>
function getInfo(){
return "hello javatpoint! How r u?";
}
</script>
<script>
[Link](getInfo());
</script>
Output of the above example
hello javatpoint! How r u?
JavaScript Function Object
In JavaScript, the purpose of Function constructor is to create a new Function object. It executes the code
globally. However, if we call the constructor directly, a function is created dynamically but in an unsecured
way.
Syntax
new Function ([arg1[, arg2[, ....argn]],] functionBody)
Parameter
arg1, arg2, .... , argn - It represents the argument used by function.
functionBody - It represents the function definition.
JavaScript Function Methods
Let's see function methods with description.
Method Description
apply() It is used to call a function contains this value and a single array of arguments.
bind() It is used to create a new function.
call() It is used to call a function contains this value and an argument list.
toString() It returns the result in a form of a string.
JavaScript Function Object Examples
Example 1
Let's see an example to display the sum of given numbers.
<script>
var add=new Function("num1","num2","return num1+num2");
[Link](add(2,5));
</script>
Output:
7
Example 2
Let's see an example to display the power of provided value.
<script>
var pow=new Function("num1","num2","return [Link](num1,num2)");
[Link](pow(2,3));
</script>
Output:
8
JavaScript Objects
A javaScript object is an entity having state and behavior (properties and method). For example: car, pen, bike,
chair, glass, keyboard, monitor etc.
JavaScript is an object-based language. Everything is an object in JavaScript.
JavaScript is template based not class based. Here, we don't create class to get the object. But, we direct create
objects.
Creating Objects in JavaScript
There are 3 ways to create objects.
1. By object literal
2. By creating instance of Object directly (using new keyword)
3. By using an object constructor (using new keyword)
1) JavaScript Object by object literal
The syntax of creating object using object literal is given below:
object={property1:value1,property2:value2.....propertyN:valueN}
As you can see, property and value is separated by : (colon).
Let’s see the simple example of creating object in JavaScript.
<script>
emp={id:102,name:"Shyam Kumar",salary:40000}
[Link]([Link]+" "+[Link]+" "+[Link]);
</script>
Output of the above example
102 Shyam Kumar 40000
2) By creating instance of Object
The syntax of creating object directly is given below:
var objectname=new Object();
Here, new keyword is used to create object.
Let’s see the example of creating object directly.
<script>
var emp=new Object();
[Link]=101;
[Link]="Ravi Malik";
[Link]=50000;
[Link]([Link]+" "+[Link]+" "+[Link]);
</script>
Output of the above example
101 Ravi 50000
3) By using an Object constructor
Here, you need to create function with arguments. Each argument value can be assigned in the current object by
using this keyword.
The this keyword refers to the current object.
The example of creating object by object constructor is given below.
<script>
function emp(id,name,salary){
[Link]=id;
[Link]=name;
[Link]=salary;
}
e=new emp(103,"Vimal Jaiswal",30000);
[Link]([Link]+" "+[Link]+" "+[Link]);
</script>
Output of the above example
103 Vimal Jaiswal 30000
Defining method in JavaScript Object
We can define method in JavaScript object. But before defining method, we need to add property in the function
with same name as method.
The example of defining method in object is given below.
<script>
function emp(id,name,salary){
[Link]=id;
[Link]=name;
[Link]=salary;
[Link]=changeSalary;
function changeSalary(otherSalary){
[Link]=otherSalary;
}
}
e=new emp(103,"Sonoo Jaiswal",30000);
[Link]([Link]+" "+[Link]+" "+[Link]);
[Link](45000);
[Link]("<br>"+[Link]+" "+[Link]+" "+[Link]);
</script>
Output of the above example
103 Sonoo Jaiswal 30000
103 Sonoo Jaiswal 45000
JavaScript Object Methods
The various methods of Object are as follows:
S.N Methods Description
o
1 [Link]() This method is used to copy enumerable and own
properties from a source object to a target object
2 [Link]() This method is used to create a new object with the
specified prototype object and properties.
3 [Link]() This method is used to describe some behavioral
attributes of the property.
4 [Link]() This method is used to create or configure multiple object
properties.
5 [Link]() This method returns an array with arrays of the key, value
pairs.
6 [Link]() This method prevents existing properties from being
removed.
7 [Link]() This method returns a property descriptor for the
specified property of the specified object.
8 [Link]() This method returns all own property descriptors of a
given object.
9 [Link]() This method returns an array of all properties
(enumerable or not) found.
10 [Link]() This method returns an array of all own symbol key
properties.
11 [Link]() This method returns the prototype of the specified object.
12 [Link]() This method determines whether two values are the same
value.
13 [Link]() This method determines if an object is extensible
14 [Link]() This method determines if an object was frozen.
15 [Link]() This method determines if an object is sealed.
16 [Link]() This method returns an array of a given object's own
property names.
17 [Link]() This method is used to prevent any extensions of an
object.
18 [Link]() This method prevents new properties from being added
and marks all existing properties as non-configurable.
19 [Link]() This method sets the prototype of a specified object to
another object.
20 [Link]() This method returns an array of values.
JavaScript Array
JavaScript array is an object that represents a collection of similar type of elements.
There are 3 ways to construct array in JavaScript
1. By array literal
2. By creating instance of Array directly (using new keyword)
3. By using an Array constructor (using new keyword)
1) JavaScript array literal
The syntax of creating array using array literal is given below:
var arrayname=[value1,value2.....valueN];
As you can see, values are contained inside [ ] and separated by , (comma).
Let's see the simple example of creating and using array in JavaScript.
<script>
var emp=["Sonoo","Vimal","Ratan"];
for (i=0;i<[Link];i++){
[Link](emp[i] + "<br/>");
}
</script>
The .length property returns the length of an array.
Output of the above example
Sonoo
Vimal
Ratan
2) 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.
Let's see the example of creating array directly.
<script>
var i;
var emp = new Array();
emp[0] = "Arun";
emp[1] = "Varun";
emp[2] = "John";
for (i=0;i<[Link];i++){
[Link](emp[i] + "<br>");
}
</script>
Output of the above example
Arun
Varun
John
3) JavaScript array constructor (new keyword)
Here, you need to create instance of array by passing arguments in constructor so that we don't have to provide
value explicitly.
The example of creating object by array constructor is given below.
<script>
var emp=new Array("Jai","Vijay","Smith");
for (i=0;i<[Link];i++){
[Link](emp[i] + "<br>");
}
</script>
Output of the above example
Jai
Vijay
Smith
JavaScript Array Methods
Let's see the list of JavaScript array methods with their description.
Methods Description
concat() It returns a new array object that contains two or more merged arrays.
copywithin() It copies the part of the given array with its own elements and returns the modified
array.
entries() It creates an iterator object and a loop that iterates over each key/value pair.
every() It determines whether all the elements of an array are satisfying the provided
function conditions.
flat() It creates a new array carrying sub-array elements concatenated recursively till the
specified depth.
flatMap() It maps all array elements via mapping function, then flattens the result into a new
array.
fill() It fills elements into an array with static values.
from() It creates a new array carrying the exact copy of another array element.
filter() It returns the new array containing the elements that pass the provided function
conditions.
find() It returns the value of the first element in the given array that satisfies the
specified condition.
findIndex() It returns the index value of the first element in the given array that satisfies the
specified condition.
forEach() It invokes the provided function once for each element of an array.
includes() It checks whether the given array contains the specified element.
indexOf() It searches the specified element in the given array and returns the index of the
first match.
isArray() It tests if the passed value ia an array.
join() It joins the elements of an array as a string.
keys() It creates an iterator object that contains only the keys of the array, then loops
through these keys.
lastIndexOf() It searches the specified element in the given array and returns the index of the
last match.
map() It calls the specified function for every array element and returns the new array
of() It creates a new array from a variable number of arguments, holding any type of
argument.
pop() It removes and returns the last element of an array.
push() It adds one or more elements to the end of an array.
reverse() It reverses the elements of given array.
reduce(function, It executes a provided function for each value from left to right and reduces the
initial) array to a single value.
reduceRight() It executes a provided function for each value from right to left and reduces the
array to a single value.
some() It determines if any element of the array passes the test of the implemented
function.
shift() It removes and returns the first element of an array.
slice() It returns a new array containing the copy of the part of the given array.
sort() It returns the element of the given array in a sorted order.
splice() It add/remove elements to/from the given array.
toLocaleString() It returns a string containing all the elements of a specified array.
toString() It converts the elements of a specified array into string form, without affecting the
original array.
unshift() It adds one or more elements in the beginning of the given array.
values() It creates a new iterator object carrying values for each index in the array.
JavaScript String
The JavaScript string is an object that represents a sequence of characters.
There are 2 ways to create string in JavaScript
1. By string literal
2. By string object (using new keyword)
1) By string literal
The string literal is created using double quotes. The syntax of creating string using string literal is given below:
1. var stringname="string value";
Let's see the simple example of creating string literal.
<script>
var str="This is string literal";
[Link](str);
</script>
Output:
This is string literal
2) By string object (using new keyword)
The syntax of creating string object using new keyword is given below:
1. var stringname=new String("string literal");
Here, new keyword is used to create instance of string.
Let's see the example of creating string in JavaScript by new keyword.
1. <script>
2. var stringname=new String("hello javascript string");
3. [Link](stringname);
4. </script>
Output:
hello javascript string
JavaScript String Methods
Let's see the list of JavaScript string methods with examples.
Methods Description
charAt() It provides the char value present at the specified index.
charCodeAt() It provides the Unicode value of a character present at the specified index.
concat() It provides a combination of two or more strings.
indexOf() It provides the position of a char value present in the given string.
lastIndexOf() It provides the position of a char value present in the given string by searching a
character from the last position.
search() It searches a specified regular expression in a given string and returns its position
if a match occurs.
match() It searches a specified regular expression in a given string and returns that regular
expression if a match occurs.
replace() It replaces a given string with the specified replacement.
substr() It is used to fetch the part of the given string on the basis of the specified starting
position and length.
substring() It is used to fetch the part of the given string on the basis of the specified index.
slice() It is used to fetch the part of the given string. It allows us to assign positive as well
negative index.
toLowerCase() It converts the given string into lowercase letter.
toLocaleLowerCase() It converts the given string into lowercase letter on the basis of host?s current
locale.
toUpperCase() It converts the given string into uppercase letter.
toLocaleUpperCase() It converts the given string into uppercase letter on the basis of host?s current
locale.
toString() It provides a string representing the particular object.
valueOf() It provides the primitive value of string object.
split() It splits a string into substring array, then returns that newly created array.
trim() It trims the white space from the left and right side of the string.
1) JavaScript String charAt(index) Method
The JavaScript String charAt() method returns the character at the given index.
<script>
var str="javascript";
[Link]([Link](2));
</script>
Output:
v
2) JavaScript String concat(str) Method
The JavaScript String concat(str) method concatenates or joins two strings.
<script>
var s1="javascript ";
var s2="concat example";
var s3=[Link](s2);
[Link](s3);
</script>
Output:
javascript concat example
3) JavaScript String indexOf(str) Method
The JavaScript String indexOf(str) method returns the index position of the given string.
<script>
var s1="javascript from javatpoint indexof";
var n=[Link]("from");
[Link](n);
</script>
Output:
11
4) JavaScript String lastIndexOf(str) Method
The JavaScript String lastIndexOf(str) method returns the last index position of the given string.
<script>
var s1="javascript from javatpoint indexof";
var n=[Link]("java");
[Link](n);
</script>
Output:
16
5) JavaScript String toLowerCase() Method
The JavaScript String toLowerCase() method returns the given string in lowercase letters.
<script>
var s1="JavaScript toLowerCase Example";
var s2=[Link]();
[Link](s2);
</script>
Output:
javascript tolowercase example
6) JavaScript String toUpperCase() Method
The JavaScript String toUpperCase() method returns the given string in uppercase letters.
<script>
var s1="JavaScript toUpperCase Example";
var s2=[Link]();
[Link](s2);
</script>
Output:
JAVASCRIPT TOUPPERCASE EXAMPLE
7) JavaScript String slice(beginIndex, endIndex) Method
The JavaScript String slice(beginIndex, endIndex) method returns the parts of string from given beginIndex to
endIndex. In slice() method, beginIndex is inclusive and endIndex is exclusive.
<script>
var s1="abcdefgh";
var s2=[Link](2,5);
[Link](s2);
</script>
Output:
cde
8) JavaScript String trim() Method
The JavaScript String trim() method removes leading and trailing whitespaces from the string.
<script>
var s1=" javascript trim ";
var s2=[Link]();
[Link](s2);
</script>
Output:
javascript trim
9) JavaScript String split() Method
<script>
var str="This is JavaTpoint website";
[Link]([Link](" ")); //splits the given string.
</script>
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
You can use 4 variant of Date constructor to create date object.
1. Date()
2. Date(milliseconds)
3. Date(dateString)
4. Date(year, month, day, hours, minutes, seconds, milliseconds)
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 60 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 60 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.
setUTCDate() It sets the day value for the specified date on the basis of universal time.
setUTCDay() It sets the particular day of the week on the basis of universal time.
setUTCFullYears() It sets the year value for the specified date on the basis of universal time.
setUTCHours() It sets the hour value for the specified date on the basis of universal time.
setUTCMilliseconds() It sets the millisecond value for the specified date on the basis of universal time.
setUTCMinutes() It sets the minute value for the specified date on the basis of universal time.
setUTCMonth() It sets the month value for the specified date on the basis of universal time.
setUTCSeconds() It sets the second value for the specified date on the basis of universal time.
toDateString() It returns the date portion of a Date object.
toISOString() It returns the date in the form ISO format string.
toJSON() It returns a string representing the Date object. It also serializes the Date object
during JSON serialization.
toString() It returns the date in the form of string.
toTimeString() It returns the time portion of a Date object.
toUTCString() It converts the specified date in the form of string using UTC time zone.
valueOf() It returns the primitive value of a Date object.
JavaScript Date Example
Let's see the simple example to print date object. It prints date and time both.
Current Date and Time: <span id="txt"></span>
<script>
var today=new Date();
[Link]('txt').innerHTML=today;
</script>
Output:
Current Date and Time: Mon Feb 27 2023 18:28:41 GMT+0530 (India Standard Time)
Let's see another code to print date/month/year.
<script>
var date=new Date();
var day=[Link]();
var month=[Link]()+1;
var year=[Link]();
[Link]("<br>Date is: "+day+"/"+month+"/"+year);
</script>
Output:
Date is: 27/2/2023
JavaScript Current Time Example
Let's see the simple example to print current time of system.
Current Time: <span id="txt"></span>
<script>
var today=new Date();
var h=[Link]();
var m=[Link]();
var s=[Link]();
[Link]('txt').innerHTML=h+":"+m+":"+s;
</script>
Output:
Current Time: 18:28:41
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.
Current Time: <span id="txt"></span>
<script>
[Link]=function(){getTime();}
function getTime(){
var today=new Date();
var h=[Link]();
var m=[Link]();
var s=[Link]();
// add a zero in front of numbers<10
m=checkTime(m);
s=checkTime(s);
[Link]('txt').innerHTML=h+":"+m+":"+s;
setTimeout(function(){getTime()},1000);
}
//setInterval("getTime()",1000);//another way
function checkTime(i){
if (i<10){
i="0" + i;
}
return i;
}
</script>
Output:
Current Time:
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.
acos() It returns the arccosine of the given number in radians.
asin() It returns the arcsine of the given number in radians.
atan() It returns the arc-tangent of the given number in radians.
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.
cos() It returns the cosine of the given number.
cosh() It returns the hyperbolic cosine of 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.
hypot() It returns square root of sum of the squares of given numbers.
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
sin() It returns the sine of the given number.
sinh() It returns the hyperbolic sine of the given number.
sqrt() It returns the square root of the given number
tan() It returns the tangent of the given number.
tanh() It returns the hyperbolic tangent of the given number.
trunc() It returns an integer part of the given number.
[Link](n)
The JavaScript [Link](n) method returns the square root of the given number.
Square Root of 17 is: <span id="p1"></span>
<script>
[Link]('p1').innerHTML=[Link](17);
</script>
[Link]()
The JavaScript [Link]() method returns the random number between 0 to 1.
Random Number is: <span id="p2"></span>
<script>
[Link]('p2').innerHTML=[Link]();
</script>
Output:
Random Number is: 0.2545327521120717
[Link](m,n)
The JavaScript [Link](m,n) method returns the m to the power of n that is mn.
3 to the power of 4 is: <span id="p3"></span>
<script>
[Link]('p3').innerHTML=[Link](3,4);
</script>
Output:
3 to the power of 4 is: 81
[Link](n)
The JavaScript [Link](n) method returns the lowest integer for the given number. For example 3 for 3.7, 5
for 5.9 etc.
Floor of 4.6 is: <span id="p4"></span>
<script>
[Link]('p4').innerHTML=[Link](4.6);
</script>
Output:
Floor of 4.6 is: 4
[Link](n)
The JavaScript [Link](n) method returns the largest integer for the given number. For example 4 for 3.7, 6 for
5.9 etc.
Ceil of 4.6 is: <span id="p5"></span>
<script>
[Link]('p5').innerHTML=[Link](4.6);
</script>
Output:
Ceil of 4.6 is: 5
[Link](n)
The JavaScript [Link](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.
Round of 4.3 is: <span id="p6"></span><br>
Round of 4.7 is: <span id="p7"></span>
<script>
[Link]('p6').innerHTML=[Link](4.3);
[Link]('p7').innerHTML=[Link](4.7);
</script>
Output:
Round of 4.3 is: 4
Round of 4.7 is: 5
[Link](n)
The JavaScript [Link](n) method returns the absolute value for the given number. For example 4 for -4, 6.6
for -6.6 etc.
Absolute value of -4 is: <span id="p8"></span>
<script>
[Link]('p8').innerHTML=[Link](-4);
</script>
Output:
Absolute value of -4 is: 4
JavaScript Number Object
The JavaScript number object enables you to represent a numeric value. It may be integer or floating-point.
JavaScript number object follows IEEE standard to represent the floating-point numbers.
By the help of Number() constructor, you can create number object in JavaScript. For example:
1. var n=new Number(value);
If value can't be converted to number, it returns NaN(Not a Number) that can be checked by isNaN() method.
You can direct assign a number to a variable also. For example:
var x=102;//integer value
var y=102.7;//floating point value
var z=13e4;//exponent value, output: 130000
var n=new Number(16);//integer value by number object
Output:
102 102.7 130000 16
JavaScript Number Constants
Let's see the list of JavaScript number constants with description.
Constant Description
MIN_VALUE returns the largest minimum value.
MAX_VALUE returns the largest maximum value.
POSITIVE_INFINITY returns positive infinity, overflow value.
NEGATIVE_INFINITY returns negative infinity, overflow value.
NaN represents "Not a Number" value.
JavaScript Number Methods
Let's see the list of JavaScript number methods with their description.
Methods Description
isFinite() It determines whether the given value is a finite
number.
isInteger() It determines whether the given value is an integer.
parseFloat() It converts the given string into a floating point
number.
parseInt() It converts the given string into an integer number.
toExponential() It returns the string that represents exponential notation
of the given number.
toFixed() It returns the string that represents a number with exact
digits after a decimal point.
toPrecision() It returns the string representing a number of specified
precision.
toString() It returns the given number in the form of string.
JavaScript Boolean
JavaScript Boolean is an object that represents value in two states: true or false. You can create the JavaScript
Boolean object by Boolean() constructor as given below.
1. Boolean b=new Boolean(value);
The default value of JavaScript Boolean object is false.
JavaScript Boolean Example
1. <script>
2. [Link](10<20);//true
3. [Link](10<5);//false
4. </script>
JavaScript Boolean Properties
Property Description
constructor returns the reference of Boolean function that created
Boolean object.
prototype enables you to add properties and methods in Boolean
prototype.
JavaScript Boolean Methods
Method Description
toSource() returns the source of Boolean object as a string.
toString() converts Boolean into String.
valueOf() converts other type into Boolean.
Browser Object Model
1. Browser Object Model (BOM)
The Browser Object Model (BOM) is used to interact with the browser.
The default object of browser is window means you can call all the functions of window by specifying window
or directly. For example:
1. [Link]("hello javatpoint");
is same as:
1. alert("hello javatpoint");
You can use a lot of properties (other objects) defined underneath the window object like document, history,
screen, navigator, location, innerHeight, innerWidth,
Note: The document object represents an html document. It forms DOM (Document Object Model).
Window Object
1. Window Object
2. Properties of Window Object
3. Methods of Window Object
4. Example of Window Object
The window object represents a window in browser. An object of window is created automatically by the
browser.
Window is the object of browser, it is not the object of javascript. The javascript objects are string, array, date
etc.
Note: if html document contains frame or iframe, browser creates additional window objects for each frame.
Methods of window object
The important methods of window object are as follows:
Method Description
alert() displays the alert box containing message with ok button.
confirm() displays the confirm dialog box containing message with ok and cancel button.
prompt() displays a dialog box to get input from the user.
open() opens the new window.
close() closes the current window.
setTimeout() performs action after specified time like calling function, evaluating expressions etc.
Example of alert() in javascript
It displays alert dialog box. It has message and ok button.
1. <script type="text/javascript">
2. function msg(){
3. alert("Hello Alert Box");
4. }
5. </script>
6. <input type="button" value="click" >
Example of confirm() in javascript
It displays the confirm dialog box. It has message with ok and cancel buttons.
<script type="text/javascript">
function msg(){
var v= confirm("Are u sure?");
if(v==true){
alert("ok");
}
else{
alert("cancel");
}
}
</script>
<input type="button" value="delete record" >
Example of prompt() in javascript
It displays prompt dialog box for input. It has message and textfield.
<script type="text/javascript">
function msg(){
var v= prompt("Who are you?");
alert("I am "+v);
}
</script>
<input type="button" value="click" >
Example of open() in javascript
It displays the content in a new window.
<script type="text/javascript">
function msg(){
open("[Link]
}
</script>
<input type="button" value="javatpoint" >
Example of setTimeout() in javascript
It performs its task after the given milliseconds.
<script type="text/javascript">
function msg(){
setTimeout(
function(){
alert("Welcome to Javatpoint after 2 seconds")
},2000);
}
</script>
<input type="button" value="click" >