Home  >  Article  >  Web Front-end  >  There is such a relationship between property and prototype of javascript objects_javascript skills

There is such a relationship between property and prototype of javascript objects_javascript skills

WBOY
WBOYOriginal
2016-05-16 19:16:151002browse

ECMAScript can recognize two types of objects, one is called Native Object and belongs to the language category; the other is called Host Object, which is provided by the running environment such as document objects,
Dom Node, etc.
Native objects are a loose structure and Properties can be added dynamically. All properties have a name and a value. This value can be a reference to another object
or a built-in data type (String, Number, Boolean, Null or Undefined)
The following simple example describes how a JavaScript object sets the value of a property and how to read the value of the property.
Assignment operation
Creating the attributes of an object is very simple. The creation of attributes can be completed directly through the assignment operation.

var objectRef = new Object(); //create a generic javascript object.
A property named testNumber can be created like this.

objectRef.testNumber = 5;
/* - or:- */
objectRef["testNumber"] = 5;
If the copied attribute name already exists, it will not be created again For this attribute, the assignment operation only resets the value of the attribute

objectRef.testNumber = 8;
/* - or:- */
objectRef["testNumber"] = 8;
The prototype of a js object can itself be an object, or it can have properties. The assignment operation of a js object (prototype) is no different from the creation of ordinary object properties
.
Value operation
In the value operation, property and prototype are different. Let’s look at the simplest property value operation first.

/*Assign a value to the attribute of an object. If the object does not have this attribute, then after the assignment operation, the object will have this attribute */
objectRef.testNumber = 8;
/ * Read the value of this attribute */
var val = objectRef.testNumber;
/* Now val has the value 8 just assigned to objectRef*/
Prototype Revealed
But all Objects can have prototypes, and prototypes themselves are objects, so they can also have prototypes. This loop will form a prototype chain.
This chain will terminate when it encounters the prototype of the formation in the chain being null. (The default prototype of Object is null)

var objectRef = new Object(); //create a generic javascript object.
Create a new js object. At this time, the prototype of this object is Null. So the prototype chain of objectRef only contains one object Object.prototype
We are looking at the following

/* Constructor to build the type MyObject1
MyObject1 - type.
*/
function MyObject1(formalParameter){
/* Create a property named testNumber for the object.
MyObject2 - type:-
*/
function MyObject2(formalParameter){
/* Create a property name for the object called testString*/
this.testString = formalParameter;

/* The next operation will replace the default prototype attribute of MyObject2 with the MyObject1 object*/ 
MyObject2.prototype = new MyObject1(8); 
/* Finally we create an object of type MyObject2* /
var objectRef = new MyObject2( "String_Value" );
objectRef, the MyObject2 type object, has a prototype chain. The first object in the chain is the MyObject1 object, and the MyObject1 object also has prototype,
This Prototype is the default prototype of Object, and the prototype of Object.prototype is null. This prototype chain ends.
When a value operation occurs, the entire prototype chain of objectRef starts to work

var val = objectRef.testString;
The objectRef object has an attribute called testString, then this sentence will testString The value is assigned to val

var val = objectRef.testNumber;
There is no attribute testNumber in the objectRef object, but val reaches the value 8 instead of undefine. This is because the interpreter After the attribute you are looking for
is not found in the current object, it will check the prototype of this object. The prototype of objectRef is the MyObject1 object. This object has the testNumber attribute, so val gets the value 8.

var val = objectRef.toString;
Now val is a reference to a function, which is a property of Object.prototype. Since neither MyObject1 nor MyObject2 defines the toString property,
so Object.prototype returns .

var val = objectRef.madeUpProperty;
The last val is undefined, because MyObject1, MyObject2, and Object do not define the property madeUpProperty, so what is obtained is undefined.
The read operation will read The first attribute value with the same name found in obj itself and prototype chain
The write operation will create an attribute with the same name for the obj object itself (if this attribute name does not exist
This means objectRef.testNumber = 3 will be in Create a property on the objectRef object with the name testNumber. The next time you want to read testNumber, the
propertype chain will not work. You will only get the property 3 of objectRef, and the testNumber property of MyObject1 will not be modified. It can be verified

/* Construct the constructor of the type MyObject1
MyObject1 - type.
*/
function MyObject1(formalParameter){
/* Create a property name for the object Call testNumber
*/
this.testNumber = formalParameter;
}
/* Construct the constructor of the type MyObject2
MyObject2 - type:-
*/
function MyObject2 (formalParameter){
/* Create a property named testString*/ for the object prototype attribute*/
var obj1 = new MyObject1(8);
MyObject2.prototype = obj1;
/* Finally we create an object of type MyObject2*/
var objectRef = new MyObject2( "String_Value" );
alert(objectRef.testNumber);
objectRef.testNumber = 5;
alert(objectRef.testNumber);
alert(obj1.testNumber);

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn