Today xiaxiaian and we talk about ES6 for the object extension syntax, there are some commonly used syntax, I believe in the near future, will definitely see the shadow of the object in Vue. You can also follow my wechat public account, snail full stack. 1, attribute concise representation: mainly for the value of the variable, and the key and value of the variable consistent 1, ordinary object declaration

let obj = {
    name:"lilei".age:34
}
console.log(obj)
Copy the code

2. Concise notation

let name = "lilei"
let age = 34
let obj = {
    name,
    age
}
Copy the code

3, attribute name expression: mainly for the key is a variable, the variable needs to add square brackets

let s = "school"
let obj = {
    name:"lilei".age:34.s:"school"
}
console.log(obj) // {name:"lilei",age:34,s:"school"}
let s = "school"
let obj = {
    name:"lilei".age:34,
    [s]:"school"
}
console.log(obj) // {name:"lilei",age:34,school:"school"}
Copy the code

4. Functions within objects

let s = "school"
let obj = {
    name:"lilei".age:34,
    [s]:"school".study:function(){
        console.log(this.name+"Learning")
    }
}
obj.study() // Lilei is learning
let s = "school"
let obj = {
    name:"lilei".age:34,
    [s]:"school".study:() = > {
        console.log(this.name+"Learning")
    }
}
obj.study() // Error: can't read property 'name' of undefind
let s = "school"
let obj = {
    name:"lilei".age:34,
    [s]:"school".study(){
        console.log(this.name+"Learning")
    }
}
obj.study() // Lilei is learning
Copy the code

2, object.is () : three equal signs equivalent to strict judgment

console.log(Object.is(2.'2')) // false
console.log(Object.is(NaN.NaN)) // true
console.log(Object.is(+0, -0)) // false
let obj1 = {
    name:"lilei".age:34
}
let obj2 = {
    name:"lilei".age:34
}
console.log(obj1 == obj2) // false 
console.log(Object.is(obj1,obj2)) False The heap memory address of the reference type is inconsistent
let obj1 = {
    name:"lilei".age:34
}
let obj2 = obj1
console.log(Object.is(obj1,obj2)) // True The reference type has the same heap memory address
Copy the code

3. Extension operator and object.assign ()

let x = {
    a:3.b:4
}
lety = {... x}console.log(y) // {a:3,b:4}
let x = {
    a:3.b:4
}
let y = {}
Object.assign(y,x)
console.log(y) // {a:3,b:4}
let x = {
    a:3.b:4
}
let y = {
    c:5.a:6
}
Object.assign(y,x)
console.log(y) // {a:6,b:4,c:5}
Copy the code

4. In: Determine whether there is a value in the specified index of the array; Determines whether the object has the specified key

let x = {
    a:3.b:4
}
console.log("a" in x) // true
let arr = [1.2.3]
console.log(3 in arr) // false Determines whether there is a value in the position 3 in the table below, not the value 3
Copy the code

Object traversal method 1

let obj = {
    name:"lilei".age:34.school:"School"
}
for(let key in obj){
    console.log(key,obj[key])
}
Copy the code

Method 2

let obj = {
    name:"lilei".age:34.school:"School"
}
Object.keys(obj).forEach(key= > {
    console.log(key,obj[key])
})
Copy the code

Methods 3

let obj = {
    name:"lilei".age:34,}Object.getOwnPropertyNames(obj).forEach(key= > {
    console.log(key,obj[key])
})
Copy the code

Methods 4

let obj = {
    name:"lilei".age:34.school:"School"
}
Reflect.ownKeys(obj).forEach(key= > {
    console.log(key,obj[key])
})
Copy the code