Understanding JavaScript Prototypes and Scope series (6)--Inheritance

Source: Internet
Author: User
Tags hasownproperty

Why use "Inheritance" as the title instead of "Prototype chain"?

The prototype chain is easy to understand if it is explained clearly and will not be confused with the usual java/c#. Inheritance is the most basic concept in object-oriented languages, but inheritance in Java is completely different from JavaScript. Therefore, the "inheritance" is highlighted here in order to reflect this difference.

The inheritance in JavaScript is manifested through the prototype chain. Look at some code first.

The above code, F1 is the Foo function new out of the object, f1.a is the F1 object's basic properties, f1.b is how to come? --from Foo.prototype, because f1.__proto__ is pointing to Foo.prototype.

To access the properties of an object, look in the basic properties first, if not, and then look up along the __proto__ chain, which is the prototype chain .

Look at the words:

, when accessing f1.b, there was no B in the basic properties of F1, so foo.prototype.b was found along __proto__.

So how do we differentiate whether a property is basic or is found in a prototype in practical applications? Everyone probably knows the answer--hasownproperty, especially in for...in ... Cycle, be sure to pay attention.

Wait, no! Where does this hasownproperty method of F1 come from? F1 itself, not in the Foo.prototype, where did it come from?

Good question.

It is from the Object.prototype, please look at the picture:

The prototype chain of an object is walking along the __proto__ line, so when looking for the F1.hasownproperty attribute, it is always looking for object.prototype along the prototype chain.

Because all of the object's prototype chains will find Object.prototype, all objects will have a Object.prototype method. This is known as "inheritance".

This is, of course, an example where you can customize functions and objects to implement your own inheritance.

Let's say an example of a function.

We all know that each function has a call,apply method, and there are properties such as Length,arguments,caller. Why does each function have? This must be "inherited". Functions are created by function functions, thus inheriting the methods in the Function.prototype. I don't believe you can ask Microsoft Visual Studio teacher to verify to us:

See, there are these properties such as call, length, and so on.

Then why are there hasOwnProperty? -That's the way Function.prototype inherits from Object.prototype. In doubt, see if the previous section will instanceof the big picture and see if function.prototype.__proto__ is pointing to Object.prototype.

Prototype, prototype chain, does everybody understand?

---------------------------------------------------------------------------

This article has been updated to the directory of Understanding JavaScript prototypes and scope series, and more on understanding JavaScript prototypes and Scope series.

Also, please pay attention to my Weibo.

Also welcome to follow my other tutorials-don't be afraid, are free!

"Microsoft petshop4.0 Source Interpretation Video" "Json2.js Source Interpretation video"

--------------------------------------------------------------------------

Understanding JavaScript Prototypes and Scope series (6)--Inheritance

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.