Java Script
CS242
Department of CSE
IIT Guwahati
Akshay Parekh
Phd, CSE
JavaScript Facts ●
●
Lightweight programming language.
Developed by Brendan Eich at Netscape in
1995..
● Generally used for client-side scripting,
making web-pages dynamic, responsive, and
interactive.
● Also used for plug-in scripting,
browser-based game scripting, etc.
Installation and
● No installation is required.
● Majority of the web-browser supports JS.
Running ● To run,
○ JS code is written in a html file.
○ Open the file in browser.
○ Inspect Element.
○ Console
<html>
<head>
<script>
[Link](“Hello
World!”);
</script>
</head>
<body>
</body>
</html>
Statement & Comment Every Statement in JS is like,
[Link](“Hello World!”);
Semicolon
marks the
end
Single line comment,
// This is single line comment
Multi line comment,
/* This is
multi line
Comment */
Variables
Variable are declared with var keyword.
Declaration and Initialization separately,
var x;
x = 5;
[Link](x);
Declaration and initialization simultaneously
var y = x + 5;
[Link](x);
● Variables can later be re-assigned.
● Variables can also store result of an expression.
● Types are not specified (loosely typed). Can find
out variable’s type
[Link](typeof x);
Primitive Data Types
● Number: Integer and Real.
var x = 25;
● String: immutable sequence of characters.
var genre = ‘rock and roll’;
● Boolean: Logical values True or False.
var iambatman = true;
● Undefined: not defined yet
var robin;
● Null: represents explicitly empty value.
var aquamanOnLand = null;
Expressions and
Expressions involving numbers,
Operators
var x = 25 + 4;
var y;
y = x - 20;
[Link](x, y);
Expressions involving string,
var name = ‘Dany';
var greeting = 'Hello ' + name;
[Link](greeting);
‘+’ is also used for string concatenation.
● All the operators (arithmetic, logical, etc) are
similar to C/C++/Java.
● Most operators automatically do
type-conversion.
Pop-up Box 1. To display message box on screen.
alert(“I am Ironman”);
2. To accept Yes/No from user.
confirm(“Are you Sure?”);
3. To accept user input.
prompt(“Input Username”);
Functions for type-conversion,
● Boolean(value)
● parseInt(value)
● parseFloat(value)
● Number(value)
● String(value)
Functions function keyword is used while defining function.
function getName(){
var name = prompt(‘Enter Name’)
[Link](name)
}
getName()
function getDetail(str){
value = prompt(‘Enter ’+str)
[Link](value)
}
getDetail(‘roll’)
function getDetail(str){
value = Number(prompt(‘Enter
’+str))
return value
}
var roll = getDetail(‘roll’)
[Link](roll, typeof roll)
Conditional ● If-else are similar to other programming
languages like C/C++/JAVA.
Statement if (condition) {
statements;
} else if (condition) {
statements;
} else {
statements;
}
Loops ● for
for (initialization; condition; update) {
statements;
}
● while
while (condition) {
statements;
}
● do while
do {
statements;
} while (condition);
Strings length property gives then size (number of
character) of the string.
var sup = ‘I am Ironman;
[Link](sup);
console([Link]);
String Indexing,
[Link](sup[0]);
[Link](sup[[Link]-1]);
Explore following string methods,
charAt, charCodeAt, fromCharCode,
indexOf, lastIndexOf, replace, split,
substring, toLowerCase, toUpperCase
Arrays An array is a type of data-type that holds an
ordered list of values, of any type.
var arrayName = [ele0, ele1, ...];
var stud = [‘Peter’, 123, ‘Spiderman’]
[Link](stud)
length property gives the size of array
[Link]([Link])
Array indexing
[Link](stud[0]);
[Link](stud[[Link]-1]);
Array Explore following array methods,
concat, join, pop, push, reverse,
shift, slice, sort, splice, toString,
unshift
Adding/Modifying elements in an array,
stud[4] = ‘Team Ironman’
Objects
● Objects are data types that lets us store
collection of properties and methods.
● Similar to class.
var aboutMe = {
degree: ‘PhD’,
department: ‘CSE’,
University: ‘IIT G’
};
var myDegree = [Link]
[Link](myDegree)
var myDegree = aboutMe[‘degree’]
[Link](myDegree)
● Non-existing property will return undefined.
● Can change values of existing properties.
● Can add new properties
● Can delete existing property using delete.
Objects: Methods
● Object properties can also be functions. Object
functions are called "methods".
var aboutMe = {
degree: ‘PhD’,
department: ‘CSE’,
University: ‘IIT G’,
name : function() {
name = prompt(‘Input Name: ’);
return name;
}
};
[Link](aboutMe)
[Link]([Link])
● To list all the properties of an object
[Link](aboutme)
● Explore built-in Objects (Date, Math, Array,
String).
References
● [Link]
JavaScript/Guide
● [Link]