Object.create()


The Object.create() method creates a new object, using an existing object as the prototype of the newly created object. This is a powerful way to implement inheritance in JavaScript, allowing objects to access properties and methods from other objects.


Example 1: Simple Prototypal Inheritance

// A prototype object with a greeting method.
const humanPrototype = {
  greet: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

// Create a new object 'person' with 'humanPrototype' as its prototype.
const person = Object.create(humanPrototype);
person.name = "Alice"; // Add a property to the new object.

person.greet(); // Outputs: Hello, my name is Alice

Explanation

We define a humanPrototype object with a greet method. Object.create() makes a new person object that inherits from humanPrototype, so person can use the greet method.


Example 2: Sharing a Base Configuration

// A base configuration object.
const baseConfig = {
  host: "api.example.com",
  port: 443
};

// Create a specific configuration that inherits from the base.
const userConfig = Object.create(baseConfig);
userConfig.endpoint = "/users";

// Access properties from both the new object and its prototype.
console.log(`${userConfig.host}${userConfig.endpoint}`); // Outputs: api.example.com/users

Explanation

userConfig is created with baseConfig as its prototype. Even though userConfig doesn't have a host property itself, it can access it from baseConfig through the prototype chain.


Example 3: Creating an Object with No Prototype

// Create an object that does not inherit anything.
const pureObject = Object.create(null);

// This object won't have default methods like toString.
console.log(pureObject.toString); // Outputs: undefined

Explanation

By passing null to Object.create(), we create a "pure" dictionary object. It doesn't inherit any properties or methods from Object.prototype, which can be useful for creating hashmaps without potential property name collisions.


Example 4: Extending a Shape Prototype

// A generic shape prototype.
const shape = {
  getType: function() {
    return this.type;
  }
};

// Create a circle that inherits from shape.
const circle = Object.create(shape);
circle.type = "Circle";
circle.radius = 5;

console.log(circle.getType()); // Outputs: Circle

Explanation

The circle object is based on the shape prototype. This allows circle to have its own specific properties (type, radius) while also having access to the shared getType method.


Example 5: Multiple Levels of Inheritance

// Base animal prototype.
const animal = {
  breathe: function() {
    console.log("Breathing...");
  }
};

// Mammal inherits from animal.
const mammal = Object.create(animal);
mammal.feedMilk = function() {
  console.log("Feeding milk...");
};

// Dog inherits from mammal.
const dog = Object.create(mammal);
dog.bark = function() {
  console.log("Barking!");
};

dog.breathe(); // Outputs: Breathing...

Explanation

This shows a prototype chain. The dog object can access methods from its direct prototype (mammal) and also from mammal's prototype (animal), demonstrating multi-level inheritance.


Example 6: Overriding a Prototype Method

// A vehicle prototype.
const vehicle = {
  start: function() {
    console.log("Engine starting...");
  }
};

// Electric car inherits from vehicle.
const electricCar = Object.create(vehicle);

// Override the start method.
electricCar.start = function() {
  console.log("Silent start...");
};

electricCar.start(); // Outputs: Silent start...

Explanation

The electricCar object inherits from vehicle but provides its own, more specific start method. When electricCar.start() is called, its own method is used instead of the one on the vehicle prototype.


Example 7: Initializing Properties with Object.create()

// A student prototype.
const studentProto = {
  displaySchool: function() {
    console.log(`School: ${this.school}`);
  }
};

// Create and initialize a new student in one step.
const newStudent = Object.create(studentProto, {
  name: { value: "Maria" },
  school: { value: "Midtown High", writable: true }
});

newStudent.displaySchool(); // Outputs: School: Midtown High

Explanation

Object.create() can take a second argument to define properties for the new object. This allows you to create an object with a specific prototype and initialize its properties at the same time.