• Skip to main content
  • Skip to search
  • Skip to select language
  • Sign up for free
  • English (US)

Object.setPrototypeOf()

The Object.setPrototypeOf() static method sets the prototype (i.e., the internal [[Prototype]] property) of a specified object to another object or null .

Warning: Changing the [[Prototype]] of an object is, by the nature of how modern JavaScript engines optimize property accesses, currently a very slow operation in every browser and JavaScript engine. In addition, the effects of altering inheritance are subtle and far-flung, and are not limited to the time spent in the Object.setPrototypeOf(...) statement, but may extend to any code that has access to any object whose [[Prototype]] has been altered. You can read more in JavaScript engine fundamentals: optimizing prototypes .

Because this feature is a part of the language, it is still the burden on engine developers to implement that feature performantly (ideally). Until engine developers address this issue, if you are concerned about performance, you should avoid setting the [[Prototype]] of an object. Instead, create a new object with the desired [[Prototype]] using Object.create() .

The object which is to have its prototype set.

The object's new prototype (an object or null ).

Return value

The specified object.

Thrown in one of the following cases:

  • The obj parameter is undefined or null .
  • The obj parameter is non-extensible , or it's an immutable prototype exotic object , such as Object.prototype or window . However, the error is not thrown if the new prototype is the same value as the original prototype of obj .
  • The prototype parameter is not an object or null .

Description

Object.setPrototypeOf() is generally considered the proper way to set the prototype of an object. You should always use it in favor of the deprecated Object.prototype.__proto__ accessor.

If the obj parameter is not an object (e.g. number, string, etc.), this method does nothing — without coercing it to an object or attempting to set its prototype — and directly returns obj as a primitive value. If prototype is the same value as the prototype of obj , then obj is directly returned, without causing a TypeError even when obj has immutable prototype.

For security concerns, there are certain built-in objects that are designed to have an immutable prototype . This prevents prototype pollution attacks, especially proxy-related ones . The core language only specifies Object.prototype as an immutable prototype exotic object, whose prototype is always null . In browsers, window and location are two other very common examples.

Pseudoclassical inheritance using Object.setPrototypeOf()

Inheritance in JS using classes.

However, if we want to implement subclasses without using class , we can do the following:

The similarity between classical inheritance (with classes) and pseudoclassical inheritance (with constructors' prototype property) as done above is mentioned in Inheritance chains .

Since function constructors' prototype property is writable, you can reassign it to a new object created with Object.create() to achieve the same inheritance chain as well. There are caveats to watch out when using create() , such as remembering to re-add the constructor property.

In the example below, which also uses classes, SuperHero is made to inherit from Human without using extends by using setPrototypeOf() instead.

Warning: It is not advisable to use setPrototypeOf() instead of extends due to performance and readability reasons.

Subclassing without extends is mentioned in ES-6 subclassing .

Specifications

Browser compatibility.

BCD tables only load in the browser with JavaScript enabled. Enable JavaScript to view data.

  • Polyfill of Object.setPrototypeOf in core-js
  • Reflect.setPrototypeOf()
  • Object.prototype.isPrototypeOf()
  • Object.getPrototypeOf()
  • Object.prototype.__proto__
  • Inheritance chain
  • ES6 In Depth: Subclassing on hacks.mozilla.org (2015)

Home » JavaScript Object Methods » JavaScript Object.assign()

JavaScript Object.assign()

Summary : in this tutorial, you will learn how to use the JavaScript Object.assign() method in ES6.

The following shows the syntax of the Object.assign() method:

The Object.assign() copies all enumerable and own properties from the source objects to the target object. It returns the target object.

The Object.assign() invokes the getters on the source objects and setters on the target. It assigns properties only, not copying or defining new properties.

Using JavaScript Object.assign() to clone an object

The following example uses the Object.assign() method to clone an object .

Note that the Object.assign() only carries a shallow clone, not a deep clone.

Using JavaScript Object.assign() to merge objects

The Object.assign() can merge source objects into a target object which has properties consisting of all the properties of the source objects. For example:

If the source objects have the same property, the property of the later object overwrites the earlier one:

  • Object.assign() assigns enumerable and own properties from a source object to a target object.
  • Object.assign() can be used to clone an object or merge objects .

IMAGES

  1. (Solved) Cannot Convert Undefined or Null to Object in JS

    javascript assign null to object

  2. The Object.assign() Method in JavaScript

    javascript assign null to object

  3. How to check if an object is null or undefined in JavaScript

    javascript assign null to object

  4. How to Check for Null in JavaScript

    javascript assign null to object

  5. Understanding Object.assign() Method in JavaScript

    javascript assign null to object

  6. Convert an Array to an Object using JavaScript

    javascript assign null to object

VIDEO

  1. Remove Properties From JavaScript Object (Copy) #javascript #javascriptlearning #javascriptdeveloper

  2. Null Object Transition Tutorial Tiktok Edits ; After Effects

  3. 04 what is JavaScript Object assign in Telugu

  4. How to use Destructuring Assignment in JavaScript

  5. #6

  6. 16.3 JavaScript assign Value of one field to other in SAP Adobe forms

COMMENTS

  1. Object.setPrototypeOf()

    The Object.setPrototypeOf() static method sets the prototype (i.e., the internal [[Prototype]] property) of a specified object to another object or null. Warning: Changing the [[Prototype]] of an object is, by the nature of how modern JavaScript engines optimize property accesses, currently a very slow operation in every browser and JavaScript ...

  2. An Essential Guide to JavaScript null

    JavaScript null is a primitive type that contains a special value null. JavaScript uses the null value to represent the intentional absence of any object value. If you find a variable or a function that returns null, it means that the expected object couldn’t be created. The following example defines the Circle class whose constructor accepts ...

  3. Using JavaScript Object.assign() Method in ES6

    The following shows the syntax of the Object.assign() method: Object.assign ( target, .. .sources) Code language: CSS (css) The Object.assign() copies all enumerable and own properties from the source objects to the target object. It returns the target object. The Object.assign() invokes the getters on the source objects and setters on the target.