10.7 Object Prototypes

In the previous chapter we learned how to use an object constructor:

Example 1: JS Objects - Using an object constructor

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
}

var myFather = new Person("John", "Doe", 50, "blue");
var myMother = new Person("Sally", "Rally", 48, "green");

We also learned that you can not add a new property to an existing object constructor:

Example 2: JS Object Constructors - Adding a Property to a Constructor part 1

Person.nationality = "English";

To add a new property to a constructor, you must add it to the constructor function:

Example 3: JS Object Constructors - Adding a Property to a Constructor part 2

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
  this.nationality = "English";
}

Using the prototype Property

The JavaScript prototype property allows you to add new properties to object constructors:

Example 4: JS Objects - Using the prototype Property part 1

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
}
Person.prototype.nationality = "English";

The JavaScript prototype property also allows you to add new methods to objects constructors:

Example 5: JS Objects - Using the prototype Property part 2

function Person(first, last, age, eyecolor) {
  this.firstName = first;
  this.lastName = last;
  this.age = age;
  this.eyeColor = eyecolor;
}
Person.prototype.name = function() {
  return this.firstName + " " + this.lastName;
};

Only modify your own prototypes. Never modify the prototypes of standard JavaScript objects.