LEARN
JAVASCRIPT QUICKLY
AND
JAVASCRIPT
CODING EXERCISES
CODING FOR BEGINNERS
WITH HANDS ON PROJECTS
BY
J J TAM
Introduction to Javascript
Javascript is a scripting language, used to validate html form data, before submitting to the server. Now a days javaScript is also used for server side development (Read node.js)
What can I do with Javascript?
a. You can perform client side validation.
b. You can give dynamic behavior to static HTML pages.
c. Show animations on web page
d. You can update partial portion of page using AJAX.
e. Develop Server side applications using frameworks like node.js
Javascript is interpreted language
Javascript is interpreted language, write once and attach it to HTML page. No further compilation is required.
Is there any relation between JavaScript and Java?
Absolutely there is no relation between JavaScript and Java.
What is ECMAScript?
ECMAScript is a standard, JavaScript is the language that implement ECMAScript standard.
Is JavaScript supports Unicode?
JavaScript programs are written in Unicode. ECMAScript 5 standard supports Unicode 3.
Is JavaScript case-sensitive?
Yes JavaScript is a case sensitive language.
Is it compulsory to end statement using ;?
Many languages like Java, C, C++ use ; as statement terminator. Usage of ; is optional in JavaScript, but I always prefer to use ; to maintain consistency.
Is JavaScript support automatic garbage collection?
Yes, JavaScript support automatic garbage collection, whenever JavaScript interpreter finds an unreachable object (or) variable, it frees the memory allocated for that variable (or) object.
Is JavaScript an object oriented language?
Yes, JavaScript is an object-oriented language, but the kind of inheritance it provides is different from the inheritance provided by languages like Java and C++. JavaScript supports Prototype inheritance.
Javascript: Hello world program
helloWorld.html
document.write("Hello World");
document.write("Hello World");
Above statement gives instruction to the browser to write "Hello World". Java Script is embedded between tags.
Javascript: Variables
Variable holds a value. Following are some of the examples of variables.
var name = "Krishna"
var id=123
Above statements define two variables name, id. var keyword is used to define variables.
Naming constraints
a. Variable name must begin with any alphabet, _ (or) $.
b. Variable name can contain any character.
c. Spaces are not allowed in between variable names.
d. Dont use Javascript keywords as variable names.
e. Variable names are case sensitive. Name, NAme, name are 3 different variables.
variables.html
var name = "Krishna";
var id=123;
document.write("name = " + name + "
");
document.write("id = " + id);
Note
Java script is case sensitive, so the names banana, Banana, BaNaNa are three different variables.
Javascript: Statements
Statement is an executable statement, statements in Javascript are terminated using ;.
statements.html
document.write("Hello World" + "
");
document.write("Hello PTR");
In the above example, below are the java script statements.
document.write("Hello World" + "
");
document.write("Hello PTR");
Javascript: comments
Comments are used to document the source code. Comments in javaScript, makes the program more readable. Comments are ignored by JavaScript.
Suppose you written thousand lines of program, with out proper documentation, after some time, for the owner of the application also, it is very difficult to figure out what was written.
Comments solve this problem:
By using comments, you can document your code at the time of writing program. Comments won't affect your program execution. Comments simply document your code.
Javascript support 2 kinds of comments.
a. Single line comments
b. Multi line comments
Single line comment :
Single line comments starts with //
// It is a single line comment
Multi Line comment
Multi line comments are encoded in /* */
/* I am a mulltiline comment */
sample.html
/*
Java script is weakly typed language
Author: Hari krishna
*/
var a = 10;
document.write("Value of a is " + a + "
");
a = "Hello World"; // Assigning string
document.write("Value of a is " + a + "
");
a = true; // Assigning boolean
document.write("Value of a is " + a + "
");
a = 10.09; // Assigning number
document.write("Value of a is " + a + "
");
JavaScript: Types
Types are used to represent the type of data. Primarily, there are two categories of types.
a. Primitive types
b. Reference types
Primitive Types
Numbers, strings and Boolean values considered as primitive types. In addition to these, special values null, undefined are also considered as primitive types.
Reference Types
Objects and arrays are considered as reference types. An object is a collection of name and value pairs. Array is a collection of elements.
One more thing to note is that JavaScript treats functions also objects.
types.html
>
var a = 10;
var b = 10.01;
var c = true;
var d = "Hello World";
var e = {
name : "Hari krishna",
city : "Bangalore"
};
var f = [2, 3, 5, 7];
document.write("a = " + a + " Type of a = " + (typeof a) + "
");
document.write("b = " + b + " Type of b = " + (typeof b) + "
");
document.write("c = " + c + " Type of c = " + (typeof c) + "
");
document.write("d = " + d + " Type of d = " + (typeof d) + "
");
document.write("e = " + e + " Type of e = " + (typeof e) + "
");
document.write("f = " + f + " Type of f = " + (typeof f) + "
");
Open above page in browser, you can able to see following messages in the html page.
a = 10 Type of a = number
b = 10.01 Type of b = number
c = true Type of c = boolean
d = Hello World Type of d = string
e = [object Object] Type of e = object
f = 2,3,5,7 Type of f = object
As you see the output, JavaScript treats both integer and float values as type number and arrays, objects are treated as type object.
Javascript: operators
An operator is a symbol which perform an operation
An operator is said to be unary, if it performs operation on single operand.
An operator is said to be binary, if it performs operation on two operands
An Operator is said to be ternary if it perform operation on three operands.
Javascript provides following operators.
