1 object

1.1 define

  • A collection of unordered data
  • A collection of key-value pairs

1.2 writing

let obj = {'name' : 'frank'.'age' : 18}
let obj2 = new Object({'name' : 'frank'.'age' : 18})
console.log({'name' : 'frank'.'age' : 18}) // Anonymous objects
Copy the code

Is not the object

{foo : 'a'}
// There is a code block with a label (lable) foo that has the content of 'a'
// foo is a label (lable) that says 'a'
Copy the code

1.3 details

  • The key name of an object is a string, not an identifier, and can contain any character
  • Quotes can be omitted, but they must be written as required by the identifier
  • If you want to use the value of a variable as the key name, enclose it in []

Comparison: Attribute names without [] are automatically changed to strings if [] is added and evaluated as a variable. If the value is not a string, it is attempted to change to a string

let a = 'age'Incorrect writing:let obj = {a : 18}
console.dir(obj) // Object { a : 18 }Correct termlet obj = {[a] : 18}
console.dir(obj) // Object { age : 18 }
Copy the code

1.4 Hidden properties of objects

Every object in JS has a hidden attribute. This hidden attribute stores the address of the object composed of the common attribute of the object. The object composed of the common attribute is the prototype of the object

2 Add, delete, modify, and search object attributes

2.1 delete

  • grammar
deleteObj. XXX ordelete obj['xxx']
Copy the code
  • Determines if the attribute is deleted (‘ Not less!
'xxx' in obj === false // true
Copy the code
  • Note that obj. XXX === undefined does not determine whether ‘XXX’ is a property of obj!! counter-examples
let obj = {}
let obj2 = {xxx : undefined}

obj.xxx === undefined // true
obj2.xxx === undefined // true
Copy the code

‘XXX’ in obj && obj. XXX === undefined

2.2 check

  • grammar
let obj = {'name' : 'frank'.'age' : 18} query all keys of your ownObject.keys(obj) check all values for itselfObject. Values (obj) check all keys and valuesObject.entries(obj) View its own properties as a directoryconsole.dir(obj)
Copy the code
  • Determine whether a property is a property of its own or a common property on the stereotype chain
let obj = {'name' : 'frank'.'age' : 18}
obj.hasOwnProperty('toString') // fasle
obj.hasOwnProperty('name') // true
Copy the code
  • There are two ways to view the value of an attribute of an object

Parenthesis syntax obj[‘key’] note that obj[key] is an error. Key without ” is a variable point syntax obj.key

2.3 Addition and modification

  • Direct assignment
let obj = {'name' : 'frank'.'age' : 18} change: obj. Name = obj'xxx'
obj['name'] = 'xxx'
obj['na' + 'me'] = 'xxx'orlet key = 'name'
obj[key] = 'xxx'
Copy the code
  • Batch assignment
Object.assign(obj,{'age' : 20.'gender' : 'man'})
Copy the code
  • Modifying common Attributes
    • The common property \ cannot be modified or added directly by itself
    • If you must modify or add attributes to the prototype
obj.__proto__.toString = 'xxx' / / do not recommend
Object.prototype.toString = 'xxx' / / recommend
Copy the code
  • Modify the prototype
let obj = {'name' : 'frank'.'age' : 18}
let common = {'citizenship' : 'China'}
obj.__proto__ = common / / do not recommend
let obj2 = Object.create(common) // Specify the prototype recommendation as soon as the object is created
Copy the code

The difference between

let obj = Object.create({'name' : 'frank'}) // The property is on the prototype
let obj2 = new Object({'name' : 'frank'}) // The property is on the object itself
Copy the code

3 Object creation

3.1 What does New X() do?

  1. A new empty object is automatically created
  2. Then empty the object’s__proto__ The prototype that points to the constructor, the prototype address specified asX.prototype
  3. The constructor automatically runs an empty object as this keyword
  4. automaticreturn this

3.2 Constructor X

  • The X function is responsible for adding attributes to the object itself
  • X. protoType is responsible for saving the common attributes of the object

3.3 Code Specifications

3.3.1 case

  • allThe constructorUppercase
  • allThe object that is constructed.Lowercase letter

3.3.2 rainfall distribution on 10-12 part of speech

  • newFor the following functions, use the noun form, e.gnew Object()
  • Other functions usually start with a verb, e.gcreateElement('div')
  • Declare a function f1. This function comes with a prototype property containing a constructor property whose value is equal to the function itselff1.prototype.constructor === f1 // true