Home > Web Front-end > JS Tutorial > body text

Introduction to reading and writing methods of object properties in JavaScript_javascript skills

WBOY
Release: 2016-05-16 16:23:09
Original
1508 people have browsed it

In JavaScript, you can use the dot operator "." or the bracket operator "[]" to read and write the property of an object:


Copy code The code is as follows:

var o = {x:1, y:2};
console.log(o.x);//1
console.log(o["y"]);//2
o.y = 7;
console.log(o["y"]);//7


It is worth noting that if the square bracket operator is used, the value type within the operator must be string, or an expression that can be converted to string:


Copy code The code is as follows:

console.log(o[y]);//ReferenceError: y is not defined
var v = "y";
console.log(o[v]);//7


Unlike the Java language, the properties of objects in JavaScript can be added or deleted dynamically. When assigning a value to a property, if the property does not exist, JavaScript will dynamically add the property to the object:


Copy code The code is as follows:

o.z = 99;
console.log(o);//Object {x=1, y=7, z=99}

Reading property in the prototypal inheritance chain

All objects in JavaScript have a prototype object and inherit properties from the prototype object; therefore, the properties of an object in JS are divided into two major categories:

1. The property owned by the object itself (“Own Property”).
2. Property inherited from the prototype object.

When reading the property of an object, the rules followed are as follows:

1. Search the property that needs to be read from the object's own property collection ("Own Property"); if it can be searched, read the property directly and return its value.
2. If the property cannot be searched from the object's own property collection ("Own Property"), then the search continues from the object's prototype chain until the property is searched and its value is returned.
3. If the property cannot be searched from the object's own property collection ("Own Property") or from all prototype objects of the object, undefined is returned.

Writing of properties in the prototypal inheritance chain

When writing to the property of a JavaScript object, the rules followed are as follows:

1. If the object itself has the property and the property is writable, write the new value to the property. If the property is read-only, an error will be reported.
2. If the object itself does not have the property, and the property does not exist in all its prototype objects, add the property to the object.
3. If the object itself does not have the property, but the property exists in its prototype object and is writable, then JS will create a new property in the object; that is, the object overwrites the property in its prototype object. The value of this property in the prototype object remains unchanged.
4. If the object itself does not have the property, but the property exists in its prototype object and is read-only, an error will be reported.
5. If the object itself does not have the property, but the setter method of the property exists in its prototype object, then JS will call the setter method in the prototype object. It is worth noting that when running the setter method, if variable assignment is involved, the assignment operation will act on the object itself, and the prototype object will not be changed in any way. This behavior can be understood as: the object inherits the setter function from the prototype and executes it.

It can be found from the above rules that if the assignment operation to the property is successful, the last thing to be modified will always be the object itself, and its prototype prototype object will not have any changes.

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template