Understanding Javascript_06 _ understanding the object creation process

Simple code
Let's take a look at a simple piece of code: Copy codeThe Code is as follows: function HumanCloning (){
}
HumanCloning. prototype = {
Name: 'dummies'
}
Var clone01 = new HumanCloning ();
Alert (clone01.name); // 'dummies'
Alert (clone01 instanceof HumanCloning); // true
HumanCloning. prototype = {};
Alert (clone01.name); // 'dummies'
Alert (clone01 instanceof HumanCloning); // false
Var clone02 = new HumanCloning ();
Alert (clone02.name); // undefined
Alert (clone02 instanceof HumanCloning); // true

Complex Theory
In JS, only function objects (functions) have the concept of classes. Therefore, to create an object, function objects must be used. The function object contains the [Construct] method and [Call] method. [[Construct] is used to Construct an object and [[Call] is used to Call a function, the [[Construct] logic is triggered only when the new operator is used. Note: In this example, the custom HumanCloning function is a function Object. Are local objects such as Object, String, and Number a function Object? The answer is yes, because local objects can all be considered as derived types of functions. In this sense, they can be treated like user-defined functions. (Echo the section "built-in data types" in "Understanding the Javascript_04 _ Data Model)
Var obj = new Object (); uses the built-in Object function Object to create the instantiated Object obj. Var obj = {}; and var obj = []; this code will be triggered by the JS engine to construct the Object and Array. Function fn () {}; var myObj = new fn (); creates an instantiated object using a user-defined type.
Note: The specific concepts of function objects will be explained in subsequent articles. Now, you can simply understand "function objects" as "functions.

Internal implementation
In this example, the function object is HumanCloning, and the object instances created by the function object are clone01 and clone02. now let's take a look at the implementation details of var clone01 = new HumanCloning (); (Note: [[Construct] method processing logic of function objects to create objects ):
1. Create a build-in object obj and initialize it.
2. if HumanCloning. if prototype is of the Object type, set [[Prototype] in clone01 to HumanCloning. prototype. Otherwise, [[Prototype] of clone01 will be its initialization value (that is, Object. prototype)
3. Use clone01 as this and use the args parameter to Call the internal [[Call] Method of HumanCloning.
3.1 create the current execution context using the [[Call] method internally (Note: The execution context will be described in the subsequent blog, in the article "Javascript speed-up _ 01 _ reference variable optimization", I have already explained this section.)
3.2 call the HumanCloning function body
3.3 destroy the current execution context.
3.4 return the value of the HumanCloning function body. If the HumanCloning function body does not return the value, undefined is returned.
4. If the return value of [[Call] is of the Object type, this value is returned; otherwise, obj is returned.
Note that the following Code explains steps 1, 2, and 3:Copy codeThe Code is as follows: var clone01 = {};
// [[Prototype] cannot be accessed outside the program, which is only used for understanding
// Clone01. [[prototype] = HumanCloning. prototype;
HumanCloning. call (clone01 );

Note that in step 2, prototype indicates the prototype attribute displayed by the object, while [[Prototype] indicates the Prototype attribute (implicit) inside the object ). The Prototype chain of the object is an implicit [[Prototype], rather than the prototype attribute displayed by the object. The displayed prototype makes sense only on the function object. From the creation process above, we can see that the prototype of the function is assigned to the implicit [[Prototype] attribute of the derived object. In this way, according to the Prototype rule, the property and method Inheritance/sharing relationship exists between the derived object and the prototype object of the function. (That is, the implementation principle of prototype inheritance, which is exactly the content of "Understanding the Javascript_05 _ prototype inheritance principle)
Pay attention to the description in Step 3.4. Let's look at a problem from Feifei:

I think it's easy to answer this question now.

Note: original address http://www.planabc.net/2008/02/20/javascript_new_function/

Memory Analysis

A simple memory graph and the concept of function objects introduced also explain the above Code (relatively less rigorous, but easy to understand ). This also raises a question. The implementation principle of instanceof depends on the prototype chain. For more information, see the subsequent blog.
Local attributes and inherited attributes
Objects can inherit attributes and methods through the implicit Prototype chain, but prototype is also a common object, that is, it is a common instantiated object, rather than a purely abstract data structure description. So there is a problem with the local attribute and the inherited attribute.
First, let's take a look at the processing process when setting object properties. JS defines a set of attributes to describe the property of an object to indicate whether the property can be set in JavaScript code or enumerated by for in.
The procedure for the assignment statement of obj. propName = value is as follows:
1. If the attribute of propName cannot be set, return
2. If obj. propName does not exist, create an attribute named propName for obj.
3. Set the obj. propName value to value.
We can see that the Prototype chain is not considered in the Value Setting Process. Obviously, [[Prototype] in obj is an instantiated object, which not only shares attributes to obj, you may also share attributes with other objects. modifying these attributes may affect other objects.
Let's look at an example:

Copy codeThe Code is as follows: function HumanCloning (){
}
HumanCloning. prototype = {
Name: 'dummies'
}
Var clone01 = new HumanCloning ();
Clone01.name = 'jxl ';
Alert (clone01.name); // jxl
Var clone02 = new HumanCloning ();
Alert (clone02.name); // dummies motto

The result is clear: the attributes of an object cannot modify the attributes of the same name in its prototype. Instead, an attribute of the same name is created and assigned a value to it.
For more information, see.
Http://www.jb51.net/article/25008.htm