前端开发那些事儿

ES6对象扩展

2021-03-05  本文已影响0人  大吉的罐头
简写形式

对象内键值对名称一样时可以简写成一个

let name = 'daji'
let age = 18
let obj = {
      name,     //name:name
      age       //age:age
}

对象内方法简写方式

let name = 'daji'
let age = 18
let obj = {
      name,
      age,
      study(){      //(){}
           console.log(this.name+'学习')
      }
}
属性名表达式

使用 [ ] 中括号

let name = 'daji'
let age =18
let s = 'school'
let obj = {
      name,
      age,
      [s]:'school'
}

打印出obj内school:'chool'

Object.is

判断两个值是否相等

console.log(Object.is(2,'2'))  //false
console.log(NaN == NaN)  //false
console.log(Object.is(NaN,NaN))  //true

如果判断两个一样值得对象obj返回false,因为对象是引用类型,栈内存内的引用地址不一样

let obj1={a:123}  //new Object()
let obj2={a:123}  //new Object()
console.log(obj1 == obj2) //false
console.log(Object.is(obj1,obj2)) //false

如果想要返回值为true,应该使用

let obj2 = obj1
console.log(Object.is(obj1,obj2)) //true
扩展运算符与Object.assgin
let x= {
      a:3,
      b:4
}
let y = {...x}
console.log(y)  //{ a:3,b:4}   和x对象一样

扩展运算符 ... 对x对象进行扩展,可以取出x对象中的可编辑的属性拷贝到y对象中

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

Object.assign第一个参数指的是目标对象,第二个参数是要复制合并的对象,x往y覆盖a属性的值为3
ps:拷贝对象时对复杂引用数据类型不能完全拷贝,是浅拷贝

in

判断对象中是否包含属性,返回布尔值

let x= {
      a:3,
      b:4
}
console.log('aa' in x)   //false

还可以用于数组中, 判断数组下标3是否有值

let arr = [1,2,3]
console.log(3 in arr)   //false
console.log(2 in arr)   //true
对象的遍历方式

先写一个obj对象为栗子

let obj = {
      name:'daji',
      age:'18',
      school:'school'
}

for...in

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

要过滤掉对象继承的属性,用hasOwnProperty()来实现:

var o = {
    name: 'Jack',
    age: 20,
    city: 'Beijing'
};
for (var key in o) {
    if (o.hasOwnProperty(key)) {
        console.log(key); // 'name', 'age', 'city'
    }
}

Object.keys

Object.keys(obj).forEach(key=>{      //箭头函数
     console.log(key,obj[key])
})

Object.getOwnPropertyNames

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

Reflect.ownKeys

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

ES6数组扩展

上一篇 下一篇

猜你喜欢

热点阅读