object

Object is the core concept of JavaScript language and also the most important data type.

What is an object? Simply put, an object is a set of key-value pairs, a kind of unordered composite data set.

Object literal generation method

var obj = {
  foo: 'Hello'.bar: 'World'
};
Copy the code

Object key name

All keys of an object are strings (ES6 introduces the Symbol value as a key), so you can use quotes or not.

If the key is a numeric value, it is automatically converted to a string.

var obj = {
  1: 'a'.3.2: 'c'
};

obj
// Object {
// 1: "a",
/ / 3.2: "c"
// }

obj['3.2'] // c
Copy the code

The attributes of the object are separated by commas, and the trailing comma may or may not be followed by the last attribute.

If the key name does not meet the criteria for identifying a name (for example, the first character is a number, or contains a space or operator) and is not a number, it must be quoted; otherwise, an error will be reported.

/ / an error
var obj = {
  1a: 'Hello World'
};

/ / is not an error
var obj = {
  '1a': 'Hello World'.'h w': 'Hello World'.'c+e': 'Hello World'
};
Copy the code

Properties can be created dynamically and do not have to be specified at object declaration time.

var obj = {};
obj.foo = 123;
obj.foo / / 123
Copy the code

Object reference

If different variable names refer to the same object, they are all references to that object, that is, to the same memory address. If you change one variable, it affects all the others.

var o1 = {};
var o2 = o1;

o1.a = 1;
o2.a / / 1

o2.b = 2;
o1.b / / 2
Copy the code

In this case, if one variable is removed from the reference to the original object, the other variable is not affected.

var o1 = {};
var o2 = o1;

o1 = 1;
o2 / / {}
Copy the code

Operations on properties

Property reading

There are two ways to read the properties of an object, one using the dot operator and the other using the square bracket operator.

var obj = {
  p: 'Hello World'
};

obj.p // "Hello World"
obj['p'] // "Hello World"
Copy the code

Note that if you use the square bracket operator, the key name must be enclosed in quotes or it will be treated as a variable.

var foo = 'bar';

var obj = {
  foo: 1.bar: 2
};

obj.foo  / / 1
obj[foo]  / / 2
Copy the code

Expressions can also be used inside the square bracket operators.

obj['hello' + ' world']
obj[3 + 3]
Copy the code

Numeric keys can be unquoted because they are automatically converted to strings.

var obj = {
  0.7: 'Hello World'
};

obj['0.7'] // "Hello World"
obj[0.7] // "Hello World"
Copy the code

Numeric keys cannot use dot operators (because they are treated as decimal points), only square brackets operators.

var obj = {
  123: 'hello world'
};

obj123. / / an error
obj[123] // "hello world"
Copy the code

Attribute assignment

The dot and square bracket operators can be used not only to read values, but also to assign values.

var obj = {};

obj.foo = 'Hello';
obj['bar'] = 'World';
Copy the code

Attribute deletion

The delete command is used to delete an attribute of an object.

var obj = { p: 1 };

delete obj.p // true
obj.p // undefined
Copy the code

Delete a nonexistent property, delete does not report an error, and returns true

var obj = {};
delete obj.p // true
Copy the code

practice

  • Object Reference Exercise
  • Object manipulation exercises

We’ll talk about that later

  • Property to view the Object.keys method
  • Attribute exists: in operator
  • Attribute traversal: for… In circulation