Dynamic objects in JavaScript
JavaScript has modernized object-oriented languages with dynamic construction. There is no such classes as in the C language, where methods and attributes are first defined and then used as models to create instances.
A JavaScript object is syntactically defined as a function, which is itself a first instance and that is cloned to create more instances.
In addition, this structure is dynamic, methods (in fact inner functions) and attributes may be added during the execution of the script.
The main question is whether a method or attribute is dynamically added to an object, they become available for derived objects, what we will see.
An object is defined as a function
The object is created by defining a constructor and by assigning it to an identifier.
function car(speed)
{
var passengers = 4;
this.speed = speed;
}
The constructor
may have arguments, and it contains properties.
It is assigned with the new keyword:
mycar = new car(120);
It is possible to create an object by assigning a literal consisting in list of properties/values separated by a comma:
mycar = { speed:120, passengers:4 };
Example:
function car(v)
{
this.speed = v;
}
var mycar=new car(120)
document.write(mycar.speed);
The instance can be declared directly with the definition of the object providing a value is assigned to the parameters if you want to access it after. Example:
var mycar = new car(v = 200)
{
this.speed = v;
}
document.write(mycar.speed);
Properties of an object are added during the processing
An object can be defined as a list of properties, equivalent to the attributes of a class.
You can add a property in accordance with the following syntax:
objectname.propertyname = xxxx
The property is accessed according to the same syntax. Example for the object car which has a speed property:
alert(car.speed);
The prototype can be changed after inheritances by changing an instance
You can add a property directly to an already defined object. To dynamically add a property and that it is used by all clones derived from the same object, even if they are created before the property is added, use the reserved word prototype.
car.prototype.fuel = 10;
The fuel property belongs to mycar and all other objects defined from car.
Example of inheritance in JavaScript and retroactive modification of the prototype (and all its instances):
var mycar = new car(v = 200)
{
this.speed = v;
}
truck = mycar;
document.write(truck.speed);
car.prototype.fuel=50;
document.write("fuel=" + truck.fuel);
An object can contain other objects assigned as values of attributes
A property can
be another object. In
this case we access properties of the inner object by a chain of identifiers
separated by a dot.
For example, if
the object mycar contains an object so which has the constructor
driver with the property age, one can reach age
by:
function driver(age)
{
this.age = age;
}
so = new driver(25);
mycar.driver = so;
document.write(mycar.driver.age);
An object can be incorporated into an another object in the shape of a literal:
mycar = {
speed:120,
passengers:4,
so : {
age:25
}
};
The object mycar contains the object so defined too with a literal. Take note of the comma separating the items instead of semi-colons.
Values of attributes are accessed as in an array
Values of properties are accessed by name, as above or through their order in the list of properties of the object, as with the elements of an array, provided they the object is part of a HTML document.
If the object is not part of the HTML document, you can access the value by the name of the properties, or by an index if the value has been added at a position.
For example, if one assigns a value by a position:
car[4] = "demo";
We access the value in the same way:
alert(car[4]);
An object corresponds to an ambivalent array, with ordinal elements or properties, unlike PHP which uses numbers both as keys and ordinals, which makes the contents of array sometimes indeterminable.
Examples of objects uses
function car(speed)
{
var passengers = 4;
this.speed= speed;
}
mycar= new car(120);
document.write("speed: ");
document.write(mycar.speed);
function driver(age)
{
this.age = age;
}
so= new driver(25);
mycar.driver= so;
document.write("age driver: ");
document.write(mycar.driver.age)
mycar = { speed:120, passengers:4, so: { age:25 } };
document.write("assignement of a literal object: ");
document.write(mycar.so.age);
car[1] = "demo";
document.write("indice: ");
document.write(car[1]);
More examples are given in the chapters about builtin objets (return to the summary).