JavaScript – Objects

In JavaScript Objects are just data, with Properties and Methods.

The code:

<!DOCTYPE html>
<html>

<head>
<title>Title</title>
 
<script language="javascript">
// Object Creation START
var person=new Object();    // The object   is - person -
person.firstname="Andrea";  // The property is - firstname -
person.lastname="Tonin";    // The property is - lastname -
person.age=39;              // The property is - age -
person.eyecolor="green";    // The property is - eyecolor -
// Object Creation END

// Accessing Object Properties - objectName.propertyName -
document.write(person.firstname + " is " + person.age + " years old." + "</br>");
// The result is "Andrea is 39 years old."

// Accessing Object Methods    - objectName.propertyName.methodName() -
document.write(person.firstname.toUpperCase()); 
// The result is "ANDREA"

</script>

<noscript>
Your browser does not support JavaScript!
</noscript>
 
</head>
  
<body>
... this is the web page content ...
</body>

</html>

The object is – person -, it is a sort of container.
The property is – firstname – with the value of “Andrea”
To access object Properties you can write – objectName.propertyName –
To access object Methods you can write – objectName.propertyName.methodName() –

Objects can be:
– Booleans
– Numbers
– Strings
– Dates
– Maths and Regular Expressions
– Arrays
– Functions

Using an Object Constructor:

<!DOCTYPE html>
<html>
<body>

<script>
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}

myFather=new person("Bruce","Lee",50,"brown");
myMother=new person("Brigitte","Bardot",48,"blue");

document.write(myFather.firstname + " is " + myFather.age + " years old.");
document.write(myMother.firstname + " is " + myMother.age + " years old.");
</script>

</body>
</html>

Adding Methods to JavaScript Objects:

<!DOCTYPE html>
<html>

<head>
<title>Title</title>
 
<script>
function person(firstname,lastname,age,eyecolor)
{
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
 
this.changeName=changeName;

	function changeName(name)
	{
	this.lastname=name;
	}
}
myMother=new person("Brigitte","Bardot",48,"green");
myMother.changeName("Marilyn");

document.write(myMother.lastname); // The result is Marilyn
</script>

<noscript>
Your browser does not support JavaScript!
</noscript>
 
</head>
  
<body>

</body>

</html>

My official WebSite >