Effective JavaScript Item 30 understands the difference between prototype, getprototypeof and __proto__

Source: Internet
Author: User

this series as effective JavaScript 's reading notes.

prototype , getpropertyof and the __proto__ is three to access prototype the method. They are named in much the same way that it is easy to confuse.

They are used in the following ways:

Prototype

It is generally used to inherit objects from the prototype that establishes it for a type. For example , c.prototype = xxx, so that the object using new C () will be the prototype object of xxx. Of course, You can also get The prototype object of obj using Obj.prototype.

Getpropertyof:

object.getpropertyof (obj) is a ES5 used in getting obj The standard method for the object's prototype object.

__PROTO__:

obj.__proto__ is a non-standard used to get obj The method of the object's prototype object.

To fully understand the various ways to get a prototype, here is an example:


function User (name, passwordhash) {this.name = Name;this.passwordhash = PasswordHash;} User.prototype.toString = function () {return "[User" + THIS.name + "]";}; User.prototype.checkPassword = function (password) {return hash (password) = = = This.passwordhash;}; var u = new User ("Sfalken", "0ef33ae791068ec64b502d6cb0191387");

UserThe function has a defaultprototypeproperty, the value of this property is an empty object. In the above example, theprototypeThe object adds two methods, namelytoStringand theCheckpassword. When callingUserconstructor to get a new objectu, its prototype object is automatically assigned to theUser.prototypeobject. ThatU.prototype = = = User.prototypewill returntrue.

User function, User.prototype , the object u the relationship between them can be expressed as follows:




The arrows in the indicate an inheritance relationship. When you access Certain properties of a U object, you first try to read the properties on the u object, and if you do not have this attribute on the U object, you will find its prototype object.

For example, when calling U.checkpassword () when, because Checkpassword is defined on its prototype object, so the u The property is not found on the object, and the lookup order is u-> U.prototype .

as mentioned earlier, getprototypeof method is ES5 The standard method used to get the prototype object of an object. therefore:


object.getprototypeof (u) = = = User.prototype; True

in some environments, it also provides a non-standard __proto__ property is used to get the prototype object for an object. This property can be used temporarily as an alternative when the environment does not provide the ES5 standard method getprototypeof method. You can use the following code to test whether the __proto__ is supported in your environment :


u.__proto__ = = = User.prototype; True

so in JavaScript , the concept of a class is done together by a constructor and its prototype object. Constructors are responsible for constructing properties specific to each object, such as the name and password properties in the example above . The prototype object is responsible for storing properties common to all objects, such as the Checkpassword and toString Methods in the example above . As the following picture shows:




Summarize:

  1. Use C.prototype to decide new C () gets the prototype object of the object.
  2. object.getprototypeof (obj) method is ES5 The standard method for getting a prototype object for an object is provided in.
  3. obj.__proto__ is a non-standard way to get a prototype object for an object.
  4. in the JavaScript , the concept of a class is defined collectively by a constructor and its prototype object.

Effective JavaScript Item 30 understands the difference between prototype, getprototypeof and __proto__

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.