Properties and operations of JavaScript Objeact

Posted by Silver_Eclipse on Wed, 09 Mar 2022 00:56:23 +0100

Basic operation of object

create object

The function called with the new keyword is the constructor. Constructors are functions designed to create objects.

For example:

var obj = new Object();

Remember, when you use typeof to check an object, it will return object.

For more information about common objects, see the previous article "object creation & constructor".

Add attributes to objects

Values saved in objects are called properties.

Syntax for adding attributes to objects:

object.Attribute name = Attribute value;

give an example:

var obj = new Object();

//Add a name attribute to obj
obj.name = 'Sun WuKong';

//Add a gender attribute to obj
obj.gender = 'male';

//Add an age attribute to obj
obj.age = 18;

console.log(JSON.stringify(obj)); // Print obj as a string

Print results:

	{
		"name":"Sun WuKong",
		"gender":"male",
		"age":18
	}

Get properties in object

Mode 1:

Syntax:

object.Attribute name;

If you get a property that does not exist in the object, you will not report an error, but return undefined.

give an example:

var obj = new Object();

//Add a name attribute to obj
obj.name = 'Sun WuKong';

//Add a gender attribute to obj
obj.gender = 'male';

//Add an age attribute to obj
obj.age = 18;

// Get the properties in the object and print them out
console.log(obj.gender); // Print result: Male
console.log(obj.color); // Print result: undefined

Method 2: you can use [] to manipulate attributes

The attribute name of the object is not required to comply with the specification of the identifier, but we try to do it according to the specification of the identifier.

But if you really want to use a special attribute name, you can't use it To manipulate the properties of an object. For example, if we write the attribute name 123 directly as obj 123 = 789 to operate the attribute will report an error. Then what shall I do? The method is as follows:

The syntax format is as follows: (this method is also adopted when reading)

// Note that attribute names in parentheses must be quoted
 object['Attribute name'] = Attribute value;

Examples of the above syntax format are as follows:

obj['123'] = 789;

Important: using [] to manipulate attributes is more flexible, because we can directly pass a variable in [].

Modify the attribute value of an object

Syntax:

object.Attribute name = New value;
obj.name = 'tom';

Delete an object's properties

Syntax:

delete obj.name;

in operator

This operator allows you to check whether an object contains a specified attribute. Returns true if there is one, and false if there is none.

Syntax:

'Attribute name' in object;

give an example:

//Check whether the object obj contains the name attribute
console.log('name' in obj);

The objects we usually use are not necessarily created by ourselves, but may be obtained from the interface. At this time, the in operator can be used.

Of course, there is another way to achieve the above purpose:

if (obj.name) {
    // If there is a name attribute in the object obj, I will continue to do so and so.
}

Traversal array: of

In ES6, if we want to traverse an array, we can do this:

let arr1 = [2, 6, 8, 5];

for (let value of arr1) {
    console.log(value);
}

Print results:

2
6
8
5

The for... of loop can prevent us from expanding memory space and increasing code efficiency, so we suggest that you use for... of to traverse the array in your future work.

Note that in the above array, for Of gets the value in the array; If you use for In traverses the array, the index value is obtained.

Traversal of Map objects

for ... of can traverse both arrays and Map objects.

for in: traverses the properties of an object

for ... in is mainly used to traverse objects. It is not recommended to traverse arrays.

Syntax:

for (const variable in object) {

}

Several times: the object will be interpreted several times. At each execution, the attribute name of each attribute in the object is assigned to the variable.

Syntax example:

for (var key in obj) {
    console.log(key); // The key here is the key of the object attribute (that is, the attribute name)
    console.log(obj[key]); // obj[key] here is the value of the object attribute (that is, the attribute value)
}

for in traversal array (not recommended)

In addition, of course, for in can also be used to traverse the array (just not recommended). At this time, the key is the index of the array. Examples are as follows:

const arr = ['hello1', 'hello2', 'hello3'];

for (const key in arr) {
    console.log('Attribute name:' + key);
    console.log('Attribute value:' + arr[key]);
}

Print results:

Property name: 0
 Attribute value: hello1

Attribute name: 1
 Attribute value: hello2

Attribute name: 2
 Attribute value: hello3

Topics: Javascript Front-end