JS Learning Prototype and prototype chain mode

Source: Internet
Author: User
Tags hasownproperty

Prototype chain mode
1. Each object (the instance is also an object) has a naturally inherent property: __proto__, which points to the prototype of the class that is currently owned (prototype)

2, each function (class is also a function) has a naturally inherent property: prototype (prototype), and this property stores the value is an object data type of data, the browser by default to this property to open a heap of memory
The associated properties and methods are stored in this heap of memory
1) where constructor is inherently a property, constructor equals the current function itself
2) __proto__:prototype corresponding value is also a value of the object data type, so it is also born with __proto__ this property
3) The properties and methods that we manually add: This part belongs to the public properties and methods of the current class
  function   Fn (num) { 2  this . A = num;  3   4  fn.prototype.b = function   () { Span style= "color: #008080;" >5  6  };  7  var  f1 = new  Fn (100 8  var  F2 = new  Fn (+);  

This is represented by drawing:

FN is the class that f1,f2 belongs to,

F1, F2 is an instance of Fn, so F1.__proto__===fn.prototype,f2.__proto__===fn.prototype

prototype chain lookup mechanism:
The private property of the current instance is searched first, if it exists in private, it is private, if it does not exist in private, the default is to find the public property of the owning class prototype according to __PROTO__, if there is public, it will continue according to __proto__ Look up at the top level .... Until the prototype of the base class of object is found, if there is no on the base class, then the current instance does not have this property, and the result returned is undefined
As follows:
    Console.log (f1.a);-->100
Console.log (f1.b);-->f1.__proto__.b
Console.log (F1.hasownproperty)-->f1.__proto__.__proto__.hasownproperty
Console.log (F1.ZZ);-->undefined

Modify the public properties and methods on the prototype:
1. Added an attribute to the prototype via __proto__

1      F1.__PROTO__.C = 300; // F1 adds a C attribute to the prototype via __proto__, with a value of 2      Console.log (F2.C); // -->300

2. Modify the public properties and methods on the prototype directly through the prototype of FN

1      fn.prototype.b=1000; 2      // -->1000

Note: In all IE browsers, the browser in order to protect the prototype of the class, shielded the use of __proto__,Console.log (f1.__proto__.b);// in IE, cannot get the value of the property ' B ': object is null or not defined.

If you want to add (modify) properties and methods to the prototype of a class, only Fn.prototype is compatible with all browsers.

JS Learning Prototype and prototype chain mode

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.