object

Concise expression of attributes

let name = "Lucy"
let age = 16
let s = "school"

let obj = {
  name,
  age,
  s:"PKU"
}
console.log(obj) // Output {name: "Lucy", age: 16, s: "PKU"}

Property name expression

let name = "Lucy"
let age = 16
let s = "school"

let obj = {
  name,
  age,
  [s]:"PKU"
}
console.log(obj) // Output {name: "Lucy", age: 16, school: "PKU"}

Methods in objects cannot use arrow functions

let name = "Lucy"
let age = 16
let s = "school"

let obj = {
  name,
  age,
  [s]:"PKU",
  study:function(){
    console.log(this.name+'I am learning')
  }
}
obj.study() // Output Lucy is learning

If the above study is changed to the arrow function: Study: () = > {console. Log (this. Name + 'learning')}, an error will be reported because this in the arrow function points to the window, and there is no name attribute on the window

Concise description of functions in objects provided by ES6:

let name = "Lucy"
let age = 16
let s = "school"

let obj = {
  name,
  age,
  [s]:"PKU",
  study(){
    console.log(this.name+'I am learning')
  }
}
obj.study() // Output Lucy is learning

Object.is()

• Judge whether the two values are strictly equal, similar===

  console.log(Object.is(2, '2')) // Output false
  

  console.log(Object.is(NaN, NaN)) // Output true
  

  console.log(Object.is(+0, -0)) // Output false
  

  let obj1 = {
    name:'Lucy',
    age:16
  }
  
  let obj2 = {
    name:'Lucy',
    age:16
  }
  
  console.log(obj1 == obj2) // Output false
  console.log(Object.is(obj1,obj2)) // false
  
  let obj2 = obj1 // Point to the same address
  console.log(Object.is(obj1,obj2)) //true
  

  Reason: objects and arrays store addresses rather than values, and the real contents exist in heap memory

...

let x = {
  a: 3,
  b: 4
}

let y = {
  ...x // Extension operator
}
console.log(y) // {a: 3, b: 4}

Object.assign

let x = {
  a: 3,
  b: 4
}
let y = {}
Object.assign(y,x)
console.log(y) // {a: 3, b: 4}

• Use... And Object.assign to copy or merge objects

  let x = {
    a: 3,
    b: 4
  }
  // let y = {
  //   ...x
  // }
  let y = {}
  Object.assign(y,x)
  console.log(y)
  

• When merging with Object.assign(), the following values will overwrite the previous values

• If the destination object is not an object, it is automatically converted to an object

  let t = Object.assign(2) // Number {2}
  
  let s = Object.assign(2,{a:2}) // Number {2, a: 2}
  

• Object.assign() is a shallow copy for the reference data type

Object traversal

• let obj = {
    name:'Lucy',
    age:16,
    school:'PKU'
  }
  

• for... in cannot be used to traverse Array. It is designed to traverse objects

  for(let key in obj){
    console.log(key,obj[key])
  }
  

• Object.keys() is used to return an array of all key s of the object

   Object.keys(obj).forEach(key => {
     console.log(key, obj[key])
   })
  

• Object.getOwnPropertyNames() is used to return an array of all key s of the object

  Object.getOwnPropertyNames(obj).forEach(key => {
    console.log(key, obj[key])
  })
  

• Reflect.ownKeys() is used to return an array of all keys of the object

  Reflect.ownKeys(obj).forEach(key => {
    console.log(key, obj[key])
  })
  

Deep and shallow copies

• Shallow copy of objects: shallow copy is a memory address shared by objects, and the changes of objects affect each other

• Deep copy of objects: simply understand that deep copy is to put objects into new memory, and the changes of two objects will not affect each other

• Shallow copy:

  let obj1 = {
    name:'Lucy',
    age:16
  }
  let obj2 = obj1
  obj1.age = 18
  console.log(obj1) // {name: "Lucy", age: 18}
  console.log(obj2) // {name: "Lucy", age: 18}
  

• Deep copy:

  Idea:

  • 1: Check the target type. If it is an array or object, enter the second step. Otherwise, return the value directly
  • 2: Traverse each item of the array or object to determine the type. If it is an array or object, perform steps 1 and 2 on this value, otherwise directly return the value

  // Method of checking data type
  let checkType = data => {
    return Object.prototype.toString.call(data).slice(8, -1)
  }
  
  // console.log(checkType(88)) // Number
  // Deep copy method
  let deepCopy = target => {
    let targetType = checkType(target)
    let result
    if (targetType == 'Object') {
      result = {}
    } else if (targetType == 'Array') {
      result = []
    } else {
      return target // If the first layer is a simple type, return it directly
    }
    // Process Object or Array
    for (let i in target) {
      let value = target[i]
      let valueType = checkType(value)
      if (valueType === 'Object' || valueType === 'Array') { // If the current value is still an object or array, you need to make a deep copy of the value
        result[i] = deepCopy(value)
      } else {
        result[i] = value
      }
    }
    return result
  }
  

  Big move JSON.parse(JSON.stringify())

  limitations:

  • undefined is ignored
  • Cannot serialize function
  • Circular referenced objects cannot be resolved