Home > Web Front-end > JS Tutorial > Detailed explanation of JavaScript objects

Detailed explanation of JavaScript objects

小云云
Release: 2018-03-17 15:38:11
Original
970 people have browsed it

1. Introduction to JavaScript objects

1. What is an object? Objects are objects in programs, and programs are used to describe the real-life world. For example, if you want to write a program to manage everyone's information, here is everyone's information (height, weight, etc.). This information is independent of each other. If you want to manage this information efficiently, you need to put it in a container (object) managed in.

Summary:

*Represents something in reality and is the abstraction of that thing in programming (data is a reference data type)

*Multiple data Collection (encapsulation)

*Container used to save multiple data

2. Why use objects?

Facilitates unified management of multiple data

3. Object composition (properties + methods)

*Attributes:

*Represents real things Status data

*Composed of attribute names and attribute values

*Attribute names are all string types, and attribute values ​​are of any type

*Methods

* Behavioral data representing real things

*Methods are special attributes (when the attribute value is a function)

const p={
            name:'tom',//属性:属性值不是函数
            setName:function (name){//方法:属性值为函数------这个也是属性
                this.name=name;
            },
            'age':23,//属性名是字符串'age'或是‘setAge’
            'setAge':function(age){
                this.age=age;
            }
        }
        console.log(p.setName('jack'),p.name);//undefined "jack"
        p['setAge'](34);//这是函数
        console.log(p['age']);//34
Copy after login

4. How to access the data inside the object?

* .Attribute name: Simple coding. But sometimes it cannot be used

*['Attribute name']: Encoding is troublesome, but it is universal (note that when using this setting parameter, access must also be in this way)

eg:b={ 'a':3}/b=['a']-----a> is a string instead of a variable

b[a]=3------>This a is Variable

5. When must the ['property name'] method be used?
a. The attribute name has special characters (such as content-type)
b. The attribute name is uncertain (the attribute name is a variable)

            var obj={};
            //给对象添加一个属性:'content-type':'text/json'
            //obj.content-type='text/json';//报错了,有横杆不是合法标识名
            obj['content-type']='text/json';
            console.log(obj['content-type']);

            //要对象添加一个属性,但是属性名不确定(不确定的东西要定义成变量)
            var propName='my name';
            var value='jack';
            //obj.propName=value;
            //console.log(obj)//obj={propName:'jack'}
//obj.propName不能用这个,因为想要的属性名是my name而不是propName,所以要用obj['propName']=value;
            obj[propName]=value;
            console.log(obj['propName'])
            console.log(obj)//obj={'my name':'jack'}
Copy after login

6. The relationship between classes and objects
Object It is generated from a class. The object of the class is an instance (such as a moon cake and a moon cake mold)

7. Verify whether the object belongs to a certain class
Object instanceof type

8 .Operation

(1).Create Object type object
Creation method: new class name(); //The method of creating objects of any type is common.
For example: var obj = new Object();
The abbreviation of Object type to create an object: var obj = {};

(2). Add or modify attributes:
Method 1 :
Object.Attribute name = data;
Method 2:
Object["Attribute name"] = data; //The brackets must be strings or variables that store strings
(3 ). Search
Method one:
Object.Attribute name;
Method two:
Object ["Attribute name"];

(4). Delete attribute:
Method 1:
delete object.Attribute name;//return boolean value, true means deletion is successful
Method 2:
delete object["attribute name"];//return boolean value, true means deletion is successful

(5). Detect whether a certain attribute exists in an object
Object.hasOwnProperty("property name"); //If it exists, return true, otherwise return false

(6) The second way to add key-value pairs to objects of type .Object:
var obj = {Attribute name: data, attribute name: data, attribute name: data...};

2. Liezi

1.How much does console.log(a[obj1]) output?

var a={};
  var obj1={n:2};
   var obj2={n:3}
    a[obj1]=4;
a[obj2]=5;
console.log(a[obj1])//输出5 
// console.log(a)知道属性名是[object Object] ,通过这个想到对象的属性名都是字符串,对象如果转换字符串:是obj.toString(),这个是固定的方法,返回的[object Object] ,所以obj1,obj2返回是一样属性名[object
 Object] 。所以a[obj2]是对a[obj1]的覆盖
Copy after login

Related recommendations:

What are the three attributes of a JavaScript object?

How to change the rest and spread attributes of a JavaScript object

JavaScript Object

The above is the detailed content of Detailed explanation of JavaScript 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