A deep analysis of the relationship _javascript skills of prototype and Proto in JavaScript

Source: Internet
Author: User

Prototype, each function object has a display prototype attribute that represents the object's prototype (Function.prototype function object is an exception, no prototype attribute).

__PROTO__: Each object has an internal hidden attribute named __proto__, pointing to its corresponding prototype object (Chrome, Firefox name is __proto__, and can be accessed). Prototype chain is based on __proto__ to form

(Note: Is not based on the properties of a Function object prototype).

Simply put: __proto__ is an internal prototype, prototype is a constructor prototype (constructor is actually a function)

The stereotype of a constructor (prototype) is an object

So what is a builder?

To create an object, you first have an object constructor, just like in PHP, to create an object, you first have a class
The essence of a constructor is a function, and the following question is: How do you create an object from this constructor?

Answer: New

The constructor constructs an object.

__proto__ of all constructors/functions point to Function.prototype, which is an empty function (Empty function)

number.__proto__ = = Function.prototype
True
boolean.__proto__ = = Function.prototype
True
string.__proto__ = = Function.prototype
True
object.__proto__ = = Function.prototype
True
function.__proto__ = = Function.prototype
True
array.__proto__ = =
Function.prototype
True
regexp.__proto__ = = Function.prototype
True
error.__proto__ = =
Function.prototype
True
date.__proto__ = =
Function.prototype
True

shows that number and so are constructors, which are actually an object of function. In other words, the equivalent of var number = new Function ();

There are a total of 12 built-in (build-in) constructors/objects in JavaScript (new JSON in ES5), and 8 constructors are listed here. Left as global cannot be accessed directly, arguments is created by the JS engine only when the function is called, and Math,json exists in the form of objects, without new. Their __proto__ is object.prototype. As follows

math.__proto__ = = Object.prototype
True
json.__proto__ = = Object.prototype
True

The "all constructors/functions" mentioned above, of course, include customizations. As follows

function declaration
function person ()
{}
function expression
var Mans
=
function ()
{}
Console.log (person.__proto__ = = = Function.prototype)
True
Console.log (man.__proto__ = =
Function.prototype)
True

What does that mean?

All constructors come from Function.prototype, even the root constructor object and the function itself. All constructors inherit the properties and methods of the Function.prototype. such as length, call, apply, bind (ES5).

Function.prototype is also the only prototype that typeof Xxx.prototype as "function". The prototype of other constructors is an object. As follows

Console.log (typeof Function.prototype)
function
Console.log (typeof Object.prototype)
Object
Console.log (typeof Number.prototype)
Object
Console.log (typeof Boolean.prototype)
Object
Console.log (typeof String.prototype)
Object
Console.log (typeof Array.prototype)
Object
Console.log (typeof Regexp.prototype)
Object
Console.log (typeof Error.prototype)
Object
Console.log (typeof Date.prototype)
Object
Console.log (typeof Object.prototype)
Object

Oh, it's also mentioned that it's an empty function, alert (function.prototype) to look under.

Knowing that all constructors (including built-in and custom) __proto__ are Function.prototype, who is Function.prototype __proto__?

I believe I have heard of the JavaScript function is also a first-class citizen, how can it be embodied? As follows

Console.log (function.prototype.__proto__ = =
Object.prototype)
True

This shows that all constructors are also a normal JS object, you can add/remove attributes to the constructor, etc. At the same time it also inherited all the methods on the Object.prototype: toString, valueof, hasOwnProperty, etc.

Who was the last Object.prototype __proto__?

object.prototype.__proto__ = =
NULL//
True

Here to share a function, Object, Prototype, __proto__ memory diagram

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.