Flash cards
Review the key moves
What is the main idea behind JavaScript Object Prototypes?
Lesson checks
Practice each idea before moving on
Short Mimo-style checks built from this lesson's code, terms, and sequence.
Which statement best captures the main point of this lesson?
Complete the missing token from the example code.
___ Person(first, last, age, eyecolor) {Put the learning moves in the order that makes the concept easiest to apply.
Prototype Inheritance
All JavaScript objects inherit properties and methods from a prototype:
- Date objects inherit from Date.prototype
- Array objects inherit from Array.prototype
The Object.prototype is on the top of the prototype inheritance chain.
Date objects, Array objects, and all other objects inherit from Object.prototype .
Adding Properties and Methods to Objects
Sometimes you want to add new properties (or methods) to all existing objects of a given type.
Sometimes you want to add new properties (or methods) to an object constructor.
Example
function Person(first, last, age, eyecolor) {
this.firstName = first;
this.lastName = last;
this.age = age;
this.eyeColor = eyecolor;
}
const myFather = new Person("John", "Doe", 50, "blue");
const myMother = new Person("Sally", "Rally", 48, "green");You cannot add a new property to an existing object constructor:
Person.nationality = "English";To add a new property to a constructor, you must add it to the constructor function:
Example
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
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 object constructors:
Example
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;
};Warning
Only modify your own prototypes. Never modify the prototypes of standard JavaScript objects.
Advanced Chapters
JavaScript Object Definitions
JavaScript Object Advanced this
JavaScript Object Iterations
JavaScript Object Getters & Setters
JavaScript Object Management
JavaScript Object Protection
JavaScript Object Prototypes
JavaScript Object Reference