Home > Web Front-end > JS Tutorial > Detailed explanation of how JavaScript adds, modifies or deletes attributes and method instances for objects

Detailed explanation of how JavaScript adds, modifies or deletes attributes and method instances for objects

伊谢尔伦
Release: 2017-07-21 09:45:58
Original
1860 people have browsed it

Introduces how to add, modify or delete properties and methods for an object. In other languages, once an object is generated, it cannot be changed. To add modified members to an object, it must be modified in the corresponding class and re-instantiated, and the program must be recompiled. This is not the case in JavaScript, which provides a flexible mechanism to modify the behavior of objects and can dynamically add, modify, and delete properties and methods. For example, first use the class Object to create an empty object user:

var user=new Object();
Copy after login

1. Add attributes
At this time, the user object does not have any attributes and methods, which is obviously of no use. But you can add attributes and methods to it dynamically, for example:

user.name=”jack”;
user.age=21;
user.sex=”male”;
Copy after login

Through the above statement, the user object has three attributes: name, age and sex. Output these three statements below:

alert(user.name);
alert(user.age);
alert(user.sex);
Copy after login

It can be seen from the code running effect that the three attributes completely belong to the user object.

2. Adding methods
The process of adding methods is similar to attributes:

user.alert=function(){
alert(“my name is:”+this.name);
}
Copy after login

This adds a method "alert" to the user object. By executing it, a dialog box can pop up to display itself. Name introduction:

user.alert();
Copy after login

3. Modify attributes
The process of modifying an attribute is to replace the old attribute with a new attribute, for example:

user.name=”tom”;
user.alert=function(){
alert(“hello,”+this.name);
}
Copy after login

This modifies the value of the name attribute of the user object and the alert method, which Changed from displaying "my name is" to displaying "hello".

4. Deleting an attribute
The process of deleting an attribute is also very simple, which is to set it to undefined:

user.name=undefined;
user.alert=undefined;
Copy after login

This deletes the name attribute and alert method. Later in the code, these properties become unavailable.
When adding, modifying or deleting attributes, the same as referencing attributes, you can also use square brackets ([]) syntax:

user[“name”]=”tom”;
Copy after login

There is an additional feature of using this method, that is You can use non-identifier strings as attribute names. For example,
identifiers do not allow numbers starting with numbers or spaces, but they can be used in square brackets ([]) syntax:

user[“my name”]=”tom”;
Copy after login

It should be noted that when using this non-identifier as a name attribute, you still need to use square bracket syntax to quote:

alert(user[“my name”]);
Copy after login

but cannot be written as:

alert(user.my name);
Copy after login

Using this property of objects, it is even easy to implement a simple hash table, and you will see its application later in this book. It can be seen that every object in JavaScript is dynamically variable, which brings great flexibility to programming and is also very different from other languages. Readers can appreciate this property.

The above is the detailed content of Detailed explanation of how JavaScript adds, modifies or deletes attributes and method instances for objects. For more information, please follow other related articles on the PHP Chinese website!

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