Javascript Learning Notes Object Chapter (II): Prototype Object _ Basic knowledge

Source: Internet
Author: User

Javascript is the only widely used, prototype-inherited language, so it takes time to understand the differences between the two ways of inheriting.

The first major difference is that Javascript uses a prototype chain to inherit:

function Foo () {
 this.value = n;
}
Foo.prototype = {
 method:function () {}
};
function Bar () {}

Set the object instance of Bar prototype to Foo:

Bar.prototype = new Foo ();
Bar.prototype.foo = ' Hello world ';

Make sure the bar constructor is itself, and create a new bar object instance:

Bar.prototype.constructor = Bar;
var test = new Bar ();

Now let's look at the composition of the entire prototype chain:

Test [instance of Bar]
 Bar.prototype [instance of Foo]
 {foo: ' Hello World '}
 foo.prototype
  {method: ... }
  Object.prototype
  {toString: ... */* etc. */}

In the example above, object test will inherit both Bar.prototype and Foo.prototype. So it can access the function method defined in Foo. Of course, it can also access property value. What you need to mention is that when new Bar () is not created, it does not create an instance of Foo, but instead reuses the instance of Foo that its prototype object brings. Similarly, all Bar instances share the same Value property. We illustrate the following examples:

Test1 = new Bar ();
 Test2 = new Bar ();
 Bar.prototype.value =;
 Test1.value//41
 TEST2.VALUE//41

Prototype chain lookup mechanism

When accessing the properties of an object, Javascript starts traversing the entire prototype chain from the object itself, until the corresponding attribute is found. If you reach the top of the prototype chain at this point, that is, the object.prototype in the example above, you still do not find the attribute you need to find, then Javascript returns the undefined value.

Properties of a prototype object

Although the properties of the prototype object are used by Javascript to construct the prototype chain, we can still assign the value to it. However, the original value copied to the prototype is invalid, such as:

function Foo () {}
foo.prototype = 1;//No effect

Here's a digression about what the original values are:
In Javascript, a variable can hold two types of values, which are original values and reference values.

1. Original value (primitive value):

The original value is a fixed and simple value, which is a simple data segment stored in stack stacks, that is, their values are stored directly in the location where the variable is accessed.
The original type has the following five types: Undefined, Null, Boolean, number, String.

2. Reference value (reference value):

The reference value is the larger object, the object stored in the heap heap, that is, the value stored at the variable is a pointer pointer that points to the memory where the object is stored. All reference types are integrated from Object.
Prototype chain performance problem

If the attribute you want to find is at the top of the prototype chain, the lookup process will undoubtedly have a negative impact on performance. This will be an important factor to consider in scenarios where performance requirements are strictly required. In addition, an attempt to find a nonexistent attribute will traverse the entire prototype chain.
Similarly, when traversing the properties of an object, all properties on the prototype chain are accessed.

Summarize

Understanding prototype inheritance is a prerequisite for writing more complex Javascript code, while paying attention to the height of the prototype chain in your code. Learn to split the prototype chain when faced with performance bottlenecks. In addition, to distinguish the prototype object prototype from the prototype __proto__, the main discussion of the prototype object prototype is not to explain the problem of prototype __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.