Scribd
Upload
23 views82 pages

Unit - 3 JavaScript

Uploaded by

narwalmanish826
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
23 views82 pages

Unit - 3 JavaScript

Uploaded by

narwalmanish826
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/ 82

Gateway Institute of Engineering and Technology

Department: Department of Computer


Science

Topic Program: BCA

Semester: III

Web Subject: Web Technology(WT)


Sub. Code: BCA207C
Technolog Presented By:
y Dr. Amita Gandhi
Associate Professor
BCA Web and Internet Technology
Department
Dr. Amita Gandhi
GIET
of Computer Science
1

Gateway Institute of Engineering and


Introduction

JavaScript is Netscape’s cross-platform, object- based scripting language for


client and server applications.

JavaScript is not Java. They are similar in some ways but fundamentally
different in others.

BCA Web and Internet Technology Dr. Amita Gandhi


JavaScript and Java
The JavaScript resembles Java but does not have Java's static typing and
strong type checking.
JavaScript supports most Java expression syntax and basic control-flow
constructs.
JavaScript has a simple, instance-based object model that still provides
significant capabilities.

JavaScript Types
There’re 2 types:
 Navigator’s JavaScript, also called client-side JavaScript
 LiveWire JavaScript, also called server-side JavaScript
3

BCA Web and Internet Technology Dr. Amita Gandhi


Embedding JavaScript in HTML
By using the SCRIPT tag
By specifying a file of JavaScript code
By specifying a JavaScript expression as the value for an HTML attribute
By using event handlers within certain other HTML tags

BCA Web and Internet Technology Dr. Amita Gandhi


SCRIPT Tag
The <SCRIPT> tag is an extension to HTML that can enclose any number of
JavaScript statements as shown here:
Syntax
<SCRIPT>
JavaScript statements...
</SCRIPT>
A document can have multiple SCRIPT tags, and each can enclose any
number of JavaScript statements.

BCA Web and Internet Technology Dr. Amita Gandhi


Famous “Hello World” Program
<html>
<body>
Output
<script language="JavaScript">
Hello, World!
document.write(“Hello, World!”)
</script>
</body>
</html>

BCA Web and Internet Technology Dr. Amita Gandhi


Statements
Conditional Statement: if…else
if (condition) {
statements1
} else {
statements2
}

BCA Web and Internet Technology Dr. Amita Gandhi


Variables
 variables are declared with the var keyword (case sensitive)
 types are not specified, but JS does have types ("loosely typed")
Number, Boolean, String, Array, Object, Function, Null, Undefined
can find out a variable's type by calling typeof

var name = expression; JS

var clientName = "Connie Client";


var age = 32;
var weight = 127.4; JS

BCA Web and Internet Technology Dr. Amita Gandhi


Number type
integers and real numbers are the same type (no int vs. double)
same operators: + - * / % ++ -- = += -= *= /= %=
similar precedence to Java
many operators auto-convert types: "2" * 3 is 6

var enrollment = 99;


var medianGrade = 2.8;
var credits = 5 + 4 + (2 * 3);
JS

BCA Web and Internet Technology Dr. Amita Gandhi


Loop Statements
for statement:
for ([initial-expression]; [condition]; [increment-expression]) {
statements
}

while statement:
while (condition) {
statements
}
10

BCA Web and Internet Technology Dr. Amita Gandhi


Expressions
An expression is any valid set of literals, variables, operators, and
expressions that evaluates to a single value; the value can be a number, a
string, or a logical value.
JavaScript has the following types of expressions:
 Arithmetic: evaluates to a number, for example 3.14159
 String: evaluates to a character string, for example, "Fred" or "234"
 Logical: evaluates to true or false

11

BCA Web and Internet Technology Dr. Amita Gandhi


Datatype conversion
JavaScript is a loosely typed language. That means you do not have to
specify the data type of a variable when you declare it, and data types are
converted automatically as needed during script execution. So, for example,
you could define a variable as follows: var answer = 42
And later, you could assign the same variable a string value, for example,
answer = "Thank you"
 In expressions involving numeric and string values, JavaScript converts the
numeric values to strings. For example, consider the following statements:
x = "The answer is " + 42
y = 42 + " is the answer."

12

BCA Web and Internet Technology Dr. Amita Gandhi


Defining and calling Functions
Functions are one of the fundamental building blocks in JavaScript. A
function is a JavaScript procedure--a set of statements that performs a
specific task. A function definition has these basic parts:
The function keyword.
A function name.
A comma-separated list of arguments to the function in
parentheses.
The statements in the function in curly braces.

13

BCA Web and Internet Technology Dr. Amita Gandhi


Functions example
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function square(number)
{
return number * number
}
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT>
document.write("The function returned ", square(5), ".")
</SCRIPT>
<P> All done. 14

</BODY> Web and Internet Technology


BCA Dr. Amita Gandhi
Logical operators
> < >= <= && || ! == != === !==
most logical operators automatically convert types:
5 < "7" is true
42 == 42.0 is true
"5.0" == 5 is true
=== and !== are strict equality tests; checks both type and value
"5.0" === 5 is false

15

BCA Web and Internet Technology Dr. Amita Gandhi


if/else statement (same as Java)
• identical structure to Java's if/else statement
• JavaScript allows almost anything as a condition

if (condition) {
statements;
} else if (condition) {
statements;
} else {
statements;
}
JS

16

BCA Web and Internet Technology Dr. Amita Gandhi


Boolean type
any value can be used as a Boolean
• "falsey" values: 0, 0.0, NaN, "", null, and undefined
• "truthy" values: anything else
converting a value into a Boolean explicitly:
• var boolValue = Boolean(otherValue);
• var boolValue = !!(otherValue);
var iLike190M = true;
var ieIsGood = "IE6" > 0; // false
if ("web devevelopment is great") { /* true */ }
if (0) { /* false */ }
JS
17

BCA Web and Internet Technology Dr. Amita Gandhi


for loop (same as Java)
var sum = 0;
for (var i = 0; i < 100; i++) {
sum = sum + i;
}
JS
var s1 = "hello";
var s2 = "";
for (var i = 0; i < s.length; i++) {
s2 += s1.charAt(i) + s1.charAt(i);
}
// s2 stores "hheelllloo"
JS

18

BCA Web and Internet Technology Dr. Amita Gandhi


while loops (same as Java)
break and continue keywords also behave as in Java

while (condition) {
statements;
} JS

do {
statements;
} while (condition);
JS

19

BCA Web and Internet Technology Dr. Amita Gandhi


Popup boxes
alert("message"); // message
confirm("message"); // returns true or false
prompt("message"); // returns user input string
JS

20

BCA Web and Internet Technology Dr. Amita Gandhi


Arrays
var name = []; // empty array
var name = [value, value, ..., value]; // pre-filled
name[index] = value; // store element
JS

var ducks = ["Huey", "Dewey", "Louie"];


var stooges = []; // stooges.length is 0
stooges[0] = "Larry"; // stooges.length is 1
stooges[1] = "Moe"; // stooges.length is 2
stooges[4] = "Curly"; // stooges.length is 5
stooges[4] = "Shemp"; // stooges.length is 5
JS

21

BCA Web and Internet Technology Dr. Amita Gandhi


String type
methods: charAt, charCodeAt, fromCharCode, indexOf, lastIndexOf, replace,
split, substring, toLowerCase, toUpperCase
• charAt returns a one-letter String (there is no char type)
length property (not a method as in Java)
Strings can be specified with "" or ''
concatenation with + :
• 1 + 1 is 2, but "1" + 1 is "11"
var s = "Connie Client";
var fName = s.substring(0, s.indexOf(" ")); // "Connie"
var len = s.length; // 13
var s2 = 'Melvin Merchant';
22
JS
BCA Web and Internet Technology Dr. Amita Gandhi
Event handlers
JavaScript applications in the Navigator are largely event-driven.
Events are actions that occur usually as a result of something the user does.
For example, clicking a button is an event, as is changing a text field or
moving the mouse over a hyperlink.
You can define event handlers, such as onChange and onClick, to make
your script react to events.

23

BCA Web and Internet Technology Dr. Amita Gandhi


BCA Web and Internet Technology Dr. Amita Gandhi GIET 24
BCA Web and Internet Technology Dr. Amita Gandhi GIET 25
BCA Web and Internet Technology Dr. Amita Gandhi GIET 26
BCA Web and Internet Technology Dr. Amita Gandhi GIET 27
BCA Web and Internet Technology Dr. Amita Gandhi GIET 28
Few Event Handler Function
onAbort: user aborts the loading

onClick: user clicks on the link

onChange: user changes value of an element

onFocus: user gives input focus to window

onLoad: user loads page in Navigator


29

BCA Web and Internet Technology Dr. Amita Gandhi


BCA Web and Internet Technology Dr. Amita Gandhi GIET 30
Why use Client-Side Programming?
client-side scripting (JavaScript) benefits:
• usability: can modify a page without having to post back to the server
(faster UI)
• efficiency: can make small, quick changes to page without waiting for
server
• event-driven: can respond to user actions like clicks and key presses

server-side programming (PHP) benefits:


• security: has access to server's private data; client can't see source code
• compatibility: not subject to browser compatibility issues
31
• power: can write files, open connections to servers, connect to databases,
BCA ... Web and Internet Technology Dr. Amita Gandhi
Event-Driven Programming
you are used to programs start with a main method (or implicit main like in
PHP)
JavaScript programs instead wait for user actions called events and respond
to them
event-driven programming: writing programs driven by user events
Let's write a page with a clickable button that pops up a "Hello, World"
window...

32

BCA Web and Internet Technology Dr. Amita Gandhi


Event-driven programming

33

BCA Web and Internet Technology Dr. Amita Gandhi


A JavaScript statement: alert
alert("IE6 detected. Suck-mode enabled.");

JS

A JS command that pops up a dialog box with a message.


34

BCA Web and Internet Technology Dr. Amita Gandhi


Document Object Model (DOM)
most JS code manipulates elements on an HTML page
we can examine elements' state
• e.g. see whether a box is checked
we can change state
• e.g. insert some new text into a div
we can change styles
• e.g. make a paragraph red

35

BCA Web and Internet Technology Dr. Amita Gandhi


Button
button's text appears inside tag; can also contain images
To make a responsive button or other UI control:
 choose the control (e.g. button) and event (e.g. mouse 1. click) of
interest
 write a JavaScript function to run when the event occurs
 attach the function to the event on the control

<button>Click me!</button> HTML

36

BCA Web and Internet Technology Dr. Amita Gandhi


DOM element objects

37

BCA Web and Internet Technology Dr. Amita Gandhi


Accessing elements: document.getElementById
document.getElementById returns the DOM object for an element with a
given id
can change the text inside most elements by setting the innerHTML
property
var name = document.getElementById("id");
can change the text in form controls by setting the value property
JS
<button onclick="changeText();">Click me!</button>
<span id="output">replace me</span>
<input id="textbox" type="text" />
HTML
function changeText() {
var span = document.getElementById("output");
var textBox = document.getElementById("textbox");
textbox.style.color = "red"; } 38
JS
BCA Web and Internet Technology Dr. Amita Gandhi
Changing element style: element.style

39

BCA Web and Internet Technology Dr. Amita Gandhi


Forms

What are forms?


• An HTML form is an area of the document that allows users to enter
information into fields.
• A form may be used to collect personal information, opinions in polls,
user preferences and other kinds of information.

There are two basic components of a Web form: the shell, the part that the
user fills out, and the script which processes the information
HTML tags are used to create the form shell. Using HTML you can create
text boxes, radio buttons, checkboxes, drop-down menus, and more...
40

BCA Web and Internet Technology Dr. Amita Gandhi


Example: Form

Text Box

Drop-down Menu
Radio Buttons
Checkboxes

Text Area

41

Reset Button
BCA Web and Internet Technology
Submit Button Dr. Amita Gandhi
The Form Shell

A form shell has three important parts:


• the <FORM> tag, which includes the address of the script which will
process the form
• the form elements, like text boxes and radio buttons
• the submit button which triggers the script to send the entered
information to the server

42

BCA Web and Internet Technology Dr. Amita Gandhi


Creating the Shell

To create a form shell, type <FORM METHOD=POST ACTION=“script_url”>


where “script_url” is the address of the script
Create the form elements
End with a closing </FORM> tag

43

BCA Web and Internet Technology Dr. Amita Gandhi


Creating Text Boxes

To create a text box, type <INPUT TYPE=“text” NAME=“name”


VALUE=“value” SIZE=n MAXLENGTH=n>
The NAME, VALUE, SIZE, and MAXLENGTH attributes are optional

44

BCA Web and Internet Technology Dr. Amita Gandhi


Text Box Attributes

The NAME attribute is used to identify the text box to the processing script
The VALUE attribute is used to specify the text that will initially appear in
the text box
The SIZE attribute is used to define the size of the box in characters
The MAXLENGTH attribute is used to define the maximum number of
characters that can be typed in the box

45

BCA Web and Internet Technology Dr. Amita Gandhi


Example: Text Box

First Name: <INPUT TYPE="text" NAME="FirstName" VALUE="First Name"


SIZE=20>
<BR><BR>
Last Name: <INPUT TYPE="text" NAME="LastName" VALUE="Last Name"
SIZE=20>
<BR><BR>
Output
Here’s how it would look on the Web:

46

BCA Web and Internet Technology Dr. Amita Gandhi


Creating Larger Text Areas

To create larger text areas, type <TEXTAREA NAME=“name” ROWS=n1


COLS=n2 WRAP> Default Text </TEXTAREA>, where n1 is the height of the
text box in rows and n2 is the width of the text box in characters
The WRAP attribute causes the cursor to move automatically to the next
line as the user types
Example: Text Area
<B>Comments?</B>
<BR>
<TEXTAREA NAME="Comments" ROWS=10 COLS=50 WRAP>
</TEXTAREA> 47

BCA Web and Internet Technology Dr. Amita Gandhi


Creating Radio Buttons

To create a radio button, type <INPUT TYPE=“radio” NAME=“name”


VALUE=“data”>Label, where “data” is the text that will be sent to the
server if the button is checked and “Label” is the text that identifies the
button to the user
Example: Radio Buttons
<B> Size: </B>
VALUE="Small">Small
<INPUT TYPE="radio" NAME="Size"
VALUE="Large">Large
<INPUT TYPE="radio" NAME="Size" 48

BCA
VALUE="Medium">Medium
Web and Internet Technology Dr. Amita Gandhi
Creating Checkboxes

To create a checkbox, type <INPUT TYPE=“checkbox” NAME=“name”


VALUE=“value”>Label
If you give a group of radio buttons or checkboxes the same name, the user
will only be able to select one button or box at a time
Example: Checkboxes
<B> Color: </B>
<INPUT TYPE="checkbox" NAME="Color" VALUE="Red">Red
<INPUT TYPE="checkbox" NAME="Color"
VALUE="Navy">Navy
<INPUT TYPE="checkbox" NAME="Color" 49

BCA Web and Internet Technology


VALUE="Black">Black Dr. Amita Gandhi
Creating Drop-down Menus

 To create a drop-down menu, type <SELECT NAME=“name” SIZE=n MULTIPLE>


 Then type <OPTION VALUE= “value”>Label
 In this case the SIZE attribute specifies the height of the menu in lines and
MULTIPLE allows users to select more than one menu option
Example: Drop-down Menu
<B>WHICH IS FAVOURITE FRUIT:</B>
<SELECT>
<OPTION VALUE="MANGOES">MANGOES
<OPTION VALUE="PAPAYA">PAPAYA
<OPTION VALUE="GUAVA">GUAVA
<OPTION VALUE="BANANA"> BANANA 50

<OPTION VALUE="PINEAPPLE">PINEAPPLE
BCA Web and Internet Technology Dr. Amita Gandhi
Creating a Submit Button

To create a submit button, type <INPUT TYPE=“submit”>


If you would like the button to say something other than submit, use the
VALUE attribute
For example, <INPUT TYPE=“submit” VALUE=“Buy Now!”> would create a
button that says “Buy Now!”

51

BCA Web and Internet Technology Dr. Amita Gandhi


Creating a Reset Button

To create a reset button, type <INPUT TYPE=“reset”>


The VALUE attribute can be used in the same way to change the text that
appears on the button

52

BCA Web and Internet Technology Dr. Amita Gandhi


Form: Example

<!DOCTYPE html>
<html lang="en">
<head>
<title>JavaScript Form Demo</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body>
<div class="container">
<form action="signup.html" method="post" id="signup">
<h1>Sign Up</h1>
<div class="field">
<label for="name">Name:</label> 53

<input type="text" id="name" name="name" placeholder="Enter your fullname" />


BCA Web and Internet Technology Dr. Amita Gandhi
Form: Example

<small></small>
</div>
<div class="field">
<label for="email">Email:</label>
<input type="text" id="email" name="email" placeholder="Enter your email address" />
<small></small>
</div>
<div class="field">
<button type="submit" class="full">Subscribe</button>
</div>
</form>
</div>
<script src="js/app.js"></script> 54

</body>
BCA Web and Internet Technology Dr. Amita Gandhi
Form: Output

55

BCA Web and Internet Technology Dr. Amita Gandhi


Output in JavaScript
JavaScript Output defines the ways to display the output of a given code.
The output can be displayed by using four different ways which are listed
below:
innerHTML: It is used to access an element. It defines the HTML content.
Syntax:
document.getElementById("id").innerHTML;

56

BCA Web and Internet Technology Dr. Amita Gandhi


innerHTML: Example
<body>
<h2>
JavaScript Display Possibilities
Using innerHTML
</h2>
Output
<p id="GFG"></p>
<!-- Script to use innerHTML -->
<script>
document.getElementById("GFG").innerHTML = 10 * 2; 57

</script></body>
BCA Web and Internet Technology Dr. Amita Gandhi
document.write( )
Document.write: It is used for testing purpose.
Syntax
document.write()

58

BCA Web and Internet Technology Dr. Amita Gandhi


document.write( ): Example
<h2>
JavaScript Display Possibilities
Using document.write()
</h2>
<p id="GFG"></p>
<!-- Script to uses document.write() -->
Output
<script>
document.write(10 * 2);
59

</script>
BCA Web and Internet Technology Dr. Amita Gandhi
window.alert( )
 window.alert(): It displays the content using an alert box.
Syntax
window.alert()

60

BCA Web and Internet Technology Dr. Amita Gandhi


window.alert( ): Example
<h2>
JavaScript Display Possibilities
Output
Using window.alert()
</h2>
<p id="GFG"></p>
<!-- Script to use window.alert() -->
<script>
window.alert(10 * 2);
61

</script>
BCA Web and Internet Technology Dr. Amita Gandhi
console.log( )
console.log(): It is used for debugging purposes.
Syntax:
console.log()

62

BCA Web and Internet Technology Dr. Amita Gandhi


console.log( ): Example
<body>
<h2>
JavaScript Display Possibilities
Output
Using console.log()
</h2>
<p id="GFG"></p>
<!-- Script to use console.log() -->
<script>
63

console.log(10*2);
BCA Web and Internet Technology Dr. Amita Gandhi
window.prompt( )
window.prompt():- it Allows to take input from user.
Syntax :
window.prompt()

64

BCA Web and Internet Technology Dr. Amita Gandhi


window.prompt( ) : Example
<body>
<h2>
JavaScript Display Possibilities
Output
Using window.alert()
</h2>
<p id="GFG"></p>
<!-- Script to use window.alert() -->
<script>
65

window.prompt("Please Enter your Input");


BCA Web and Internet Technology Dr. Amita Gandhi
Cookie
Cookies are data, stored in small text files, on your computer.
When a web server has sent a web page to a browser, the connection is
shut down, and the server forgets everything about the user.
Cookies were invented to solve the problem "how to remember information
about the user“.
When a user visits a web page, his/her name can be stored in a cookie.
Next time the user visits the page, the cookie "remembers" his/her name.

66

BCA Web and Internet Technology Dr. Amita Gandhi


Cookies
Cookies are saved in name-value pairs like:
username = Gateway
 When a browser requests a web page from a server, cookies belonging to
the page are added to the request. This way the server gets the necessary
data to "remember" information about users.

67

BCA Web and Internet Technology Dr. Amita Gandhi


Create a Cookie with JavaScript
JavaScript can create, read, and delete cookies with the document.cookie
property.
With JavaScript, a cookie can be created like this:
document.cookie = "username= Gateway";
You can also add an expiry date (in UTC time). By default, the cookie is
deleted when the browser is closed:
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013
12:00:00 UTC";

68

BCA Web and Internet Technology Dr. Amita Gandhi


Create a Cookie with JavaScript
With a path parameter, you can tell the browser what path the cookie
belongs to. By default, the cookie belongs to the current page.
document.cookie = "username=John Doe; expires=Thu,
18 Dec 2013 12:00:00 UTC; path=/";

69

BCA Web and Internet Technology Dr. Amita Gandhi


Read a Cookie with JavaScript
With JavaScript, cookies can be read like this:
let x = document.cookie;
document.cookie will return all cookies in one string much like:
cookie1=value; cookie2=value; cookie3=value;

70

BCA Web and Internet Technology Dr. Amita Gandhi


Change a Cookie with JavaScript
With JavaScript, you can change a cookie the same way as you create it:
document.cookie = "username=John Smith;
expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
The old cookie is overwritten.

71

BCA Web and Internet Technology Dr. Amita Gandhi


Delete a Cookie with JavaScript
Deleting a cookie is very simple.
You don't have to specify a cookie value when you delete a cookie.
Just set the expires parameter to a past date:
document.cookie = "username=; expires=Thu,
01 Jan 1970 00:00:00 UTC; path=/;";

72

BCA Web and Internet Technology Dr. Amita Gandhi


Hidden Field
Hidden object represents a hidden input field in an HTML form and it is
invisible to the user. This object can be placed anywhere on the web page.
It is used to send hidden form of data to a server.
Syntax:
<input type= “hidden”>

73

BCA Web and Internet Technology Dr. Amita Gandhi


Hidden Field: Example

74

BCA Web and Internet Technology Dr. Amita Gandhi


Images in JavaScript
In the HTML file, create an HTML image tag like <img/>. In JavaScript, get a
reference to the image tag using the querySelector() method.
const img = document.querySelector("img");
img.src = "https://picsum.photos/200/301";
Then, assign an image URL to the src attribute of the image element. We
can set an src attribute to the image tag using the square brackets syntax
like:
img["src"] = "https://picsum.photos/200/301";

75

BCA Web and Internet Technology Dr. Amita Gandhi


Images in JavaScript: Example

76

BCA Web and Internet Technology Dr. Amita Gandhi


Set Multiple Src Attributes In JavaScript
<img/> // image 1
...
<img/> // image 2
...
<img/> // image 2
To get a reference to all three image elements, we’ll need to use
querySelectorAll().
const img = document.querySelectorAll("img");

77

BCA Web and Internet Technology Dr. Amita Gandhi


Set Multiple Src Attributes In JavaScript
This will get all of the image element references and create a Node List
Array from them.
img[0].src = "https://picsum.photos/200/301"; // image 1
img[1].src = "https://picsum.photos/200/302"; // image 2
img[2].src = "https://picsum.photos/200/303"; // image 3

78

BCA Web and Internet Technology Dr. Amita Gandhi


Application of JavaScript
Websites: JavaScript add behavior to the web page where the page
responds to actions without loading a new page to request processing. It
enables the website to interact with visitors and execute complex actions.
Web Applications: As browsers and personal computers have continued
to improve, JavaScript gained the ability to create robust web applications.
Consider applications like Google Maps. If we want to explore a map in
Google Maps, all you have to do is click and drag with the mouse.
Presentations: A very popular use of JavaScript is to create presentations
as websites. This becomes really easy if you are familiar with HTML and
CSS.
79

BCA Web and Internet Technology Dr. Amita Gandhi


Application of JavaScript
Server Applications: JavaScript made its way from the browser into the
server. Node is adopted by major companies such as Wal-Mart, as a key part
of back end infrastructure.
Web Servers: We can create much more robust servers using Node or the
standard server application framework Express.js.
Games: With the addition of HTML5 canvas, the browser-based games has
increased exponentially.
Art: One of the new features of HTML5 specification is the canvas element,
which allows the browser to render three-dimensional spaces. This helps to
open the browser as a new source for digital art projects.
80

BCA Web and Internet Technology Dr. Amita Gandhi


Application of JavaScript
Smartwatch Apps: A small JavaScript framework that allows a developer
to create an application for the Pebble watches in JavaScript.
Mobile Apps: One of the most powerful things we can do with JavaScript is
to build an application for non-web contexts. For example – Mobile devices
are now the most popular way to access the internet.
Flying Robots: This means that we can program a flying robot with
JavaScript. So, it’s good to see that it is creating such a wide range of
applications.

81

BCA Web and Internet Technology Dr. Amita Gandhi


Thank
You… 82

BCA Web and Internet Technology Dr. Amita Gandhi

You might also like