Objects

Object Introduction:
 An object is a real world entity such as pen, car, chair etc.,
 Java script is also an object oriented programming (OOP) Language.
 A javaScript object is an entity having state and behavior (properties and method).
 JavaScript is template based not class based. Here, we don't create class to get the
object. But, we direct create objects.
There are three ways to create an object in java script. They are:
1. By object literal
2. By creating instance of Object directly (using new keyword)
3. By using an object constructor (using new keyword)
1. By object literal:
Syntax:object={property1:value1,property2:value2.....propertyN:valueN}
Example:
<script>
emp={id:102,name:"Shyam Kumar",salary:40000}
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>

Output:102 Shyam Kumar 40000

2. By creating instance of Object directly (using new keyword):
Syntax:var objectname=new Object();
Here, new keyword is used to create object.
Example:
<script>
var emp=new Object();
emp.id=101;
emp.name="Ravi Malik";
emp.salary=50000;
document.write(emp.id+" "+emp.name+" "+emp.salary);
</script>
Output:101 Ravi 50000
3. By using an object constructor (using new keyword):
 Here, you need to create function with arguments. Each argument value can be
assigned in the current object by using this keyword.
 Thethis keyword refers to the current object.
Example:
<script>
function emp(id,name,salary){
this.id=id;
this.name=name;
this.salary=salary;
}
e=new emp(103,"Vimal Jaiswal",30000);
document.write(e.id+" "+e.name+" "+e.salary);
</script>

Output:103 VimalJaiswal 30000

Built in objects:
Java script has several built in (or) native objects. These objects are accessible
anywhere in the program.

List of Java script built in objects:

 Number Object
 Boolean Object
 String Object
 Array Object
 Date Object
 Math Object
 RegExp Object

Date and math related objects

Java script 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)

Date Methods:

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.
getFullYear() 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.
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.

Example Output
<!DOCTYPE html> Today's day: 24
<html>
<body>
<script>
var date=new Date();
document.writeln("Today's day: "+date.getDate());
</script>
</body>
</html>

Java script Math Object:

The JavaScript math object provides several constants and methods to
perform mathematical operation. Unlike date object, it doesn't have constructors.

Math Properties:
JavaScript provides 8 mathematical constants that can be accessed as Math
properties:
Example:
1. Math.E // returns Euler's number
2. Math.PI // returns PI
3. Math.SQRT2 // returns the square root of 2
4. Math.SQRT1_2 // returns the square root of ½
5. Math.LN2 // returns the natural logarithm of 2
6. Math.LN10 // returns the natural logarithm of 10
7. Math.LOG2E // returns base 2 logarithm of E
8. Math.LOG10E // returns base 10 logarithm of E
Math Methods:
Methods Description

abs() It returns the absolute value 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.

exp() It returns the exponential form of the given number.

floor() It returns largest integer value, lower than or equal to the given number.

log() It returns natural logarithm of a number.

max() It returns maximum value of the given numbers.

min() It returns minimum value of the given numbers.

pow() It returns value of base to the power of exponent.

random() It returns random number between 0 (inclusive) and 1 (exclusive).

round() It returns closest integer value of the given number.

Document Object Model (DOM)

"The W3C Document Object Model (DOM) is a platform and language-neutral
interface that allows programs and scripts to dynamically access and update the
content, structure, and style of a document."

 The DOM is a W3C (World Wide Web Consortium) standard.

 The DOM defines a standard for accessing documents:

The W3C DOM standard is separated into 3 different parts:

 Core DOM - standard model for all document types
 XML DOM - standard model for XML documents
 HTML DOM - standard model for HTML documents

HTML DOM:
The HTML DOM is a standard object model and programming interface for
HTML. It defines:
 The HTML elements as objects
 The properties of all HTML elements
 The methods to access all HTML elements
 The events for all HTML elements

In other words: The HTML DOM is a standard for how to get, change, add, or delete
HTML elements.

The HTML DOM (Document Object Model)

When a web page is loaded, the browser creates a Document Object Model of
the page.
The HTML DOM model is constructed as a tree of Objects:
The HTML DOM Tree of Objects

With the object model, JavaScript gets all the power it needs to create dynamic HTML:
 JavaScript can change all the HTML elements in the page
 JavaScript can change all the HTML attributes in the page
 JavaScript can change all the CSS styles in the page
 JavaScript can remove existing HTML elements and attributes
 JavaScript can add new HTML elements and attributes
 JavaScript can react to all existing HTML events in the page
 JavaScript can create new HTML events in the page

EVENT HANDLING
JavaScript's interaction with HTML is handled through events that occur
when the user or the browser manipulates a page.

When the page loads, it is called an event. When the user clicks a button, that
click too is an event. Other examples include events like pressing any key, closing a
window, resizing a window, etc.

Developers can use these events to execute JavaScript coded responses,

which cause buttons to close windows, messages to be displayed to users, data to be
validated, and virtually any other type of response imaginable.

Events are a part of the Document Object Model (DOM) Level 3 and every
HTML element contains a set of events which can trigger JavaScript Code.