Javascript

Related applications

Search a word:

JavaScript Objects

1. Definitions


JavaScript is an Object Oriented Programming (OOP) language. With an OOP 
language, we can define our own objects, and make your own variable types.

In JavaScript software we are using, we have already many built-in 
JavaScript classes, such as String, 
Array, Date, Image, ... ; with their properties and 
method. 
Properties are the values associated with an object; methods are functions 
associated to this object.

If we write:
var txt = "Regards";
document.write(txt.length);
document.write(txt.toUpperCase());

txt is an object of the class String
txt.length is the property  length 
applied to the object "txt". 
It will outputs the length of the string "Regards", that is 7.
txt.toUpperCase() is the method UpperCase() applied to the String object "txt". 
It will output REGARDS.

We can define an object by two manners:

2. Creating an instance of object with its properties and methods:


We perform only three steps

- We create an instance of an object:
object_name = new Object();
- We define a property:
obj_name.property_name = value;
- We define a method as a function
object_name.method_name=method_namet();



Where:
Object is the name of the class
document.write(obj_name.property_name); will display value
function method_name(){
... some code
return some_thing;
}

- To access a property of an object:
obj_name.property_name;
- To apply a method to an object:
obj_name.method_name();

<html>
<head>
<script type="text/javascript">
//Example:
//We create an object (an atom)
atom = new Object();
//We add three properties to it:
atom.name="Helium";
atom.charge=2;
atom.weight=4.50;
//We add a method called rare()
atom.rare = rare();

function rare(){
if (atom.charge == 2 || atom.charge == 10 || atom.charge == 18 ){
document.write("The atom is a noble gas. ");}
else{
document.write("The atom is not a noble gas. ");}
}

</script>
</head>

<body >
<script type="text/javascript">
//get the object name:
document.write(atom.name);
document.write("<br />");
atom.rare();
</script>
</body>
</html>

3. We create a templete of an object:


The template defines the structure of an object. It 
is a function that contains the definition of the properties' and method's 
current object:

Example:
<html>
<head>
<script type="text/javascript">
//Example:
function rare_gas(symbol,charge,weight)
{
this.symbol = symbol;
this.charge = charge;
this.weight = weight;

this.noble=noble;
}


/*noble refers to noble() function added to the rare_gas object. 
We have to define this function inside the templete. 
A definition for this function can be:
*/
function noble(){
if (this.symbol == "Ne"){
document.write("The atom is  a neon. ");
}
else{
document.write("The atom is not a neon. Its symbol is: " + this.symbol + "." );
}
}
</script>
</head>
<body >
<script type="text/javascript">


helium = new rare_gas ("He",2,4.00);
neon = new rare_gas ("Ne",10,20.18);
argon = new rare_gas ("Ar",18,39.95);
krypton = new rare_gas ("Kr",36,83.80);

//get the object name:
document.write(argon.weight + " g/mol");
document.write("<br />");
//apply the method to the object:
neon.noble();
document.write("<br />");
krypton.noble();
</script>
</body>
</html>

Web

ScientificSentence