JS: Object.create

By Xah Lee. Date: . Last updated: .

The most general way to create a object is using Object.create(…). It lets you specify its parent object, and also specify the new object's properties, and each property's attributes.



Object.create(parent, properties_spec)



Return a new empty object such that its parent is parent.

// Example of using Object.create(obj)
const o1 = {b:7};
const o2 = Object.create(o1); // o2 is now child of o1
console.log(Object.getPrototypeOf(o2) === o1); // true

You can write Object.create(null) to create a object that has no parent. Note: it won't have basic methods such as toString().

// create a object with no parent
const xx = Object.create(null);

Object.create(‹parent›, ‹properties_spec›)

Object.create(parent, {k1:descriptor_1, k2:descriptor_2, …})

Return a new object such that its prototype (parent) is parent. Also defines the new object's properties and their attributes.

Property Descriptor is the syntax for a property's value and attributes. It has the form:

{ value: value, writable: boolean, enumerable: boolean, configurable: boolean }

[see JS: Property Descriptor]

[see JS: Property Attributes, writable, enumerable, configurable]

// using Object.create() to create a object with specific parents, properties, and property attributes

const o1 = {p1:1};

// create a object o2, with parent o1, and also with property “p2”, and also set p2's value and attributes
const o2 = Object.create( o1,
                         { value : 2,
                           writable: true,
                           enumerable: true,
                           configurable: true

console.log(o2["p1"]); // prints 1
console.log(o2["p2"]); // prints 2

Create Getter/Setter Properties

Property Descriptor for getter property is: { get: function, enumerable: boolean, configurable: boolean }

Property Descriptor for setter property is: { set: function, enumerable: boolean, configurable: boolean }

// define getter and setter properties using Object.create

const obj = Object.create (
        "a": { get : function (x) { console.log ( "getter called" ) },
               enumerable: false,
               configurable: false },
        "b": { set : function (x) { console.log ( "setter called with arg "+x ) },
               enumerable: false,
               configurable: false }

// prints
// getter called

obj.b = 3;
// prints
// setter called with arg 3

Use Object.create() to Emulate Constructor

JS: How to Use Object.create() to Emulate Constructor?

JS Object and Inheritance

  1. Object Overview
  2. Object Type
  3. Find Object's Type
  4. Prototype Chain
  5. Create Object
  6. Object Literal Expr
  7. Create Object with Parent X
  8. Get/Set Parent
  9. Show Prototype Chain
  10. Prevent Adding Property
  11. Clone Object
  12. Test Object Equality
  13. Add Method to Prototype
Liket it? I spend 2 years writing this tutorial. Help me spread it. Tell your friends. Or, Put $5 at patreon.

Or, Buy JavaScript in Depth

If you have a question, put $5 at patreon and message me.

Web Dev Tutorials

  1. HTML
  2. Visual CSS
  3. JS in Depth
  4. JS Object Reference
  5. DOM Scripting
  6. SVG
  7. Blog