五、对象的扩展

---

属性简写，方法简写，属性名支持变量
Object.is(a,b) //精准判读单两个值是否相等
Object.assign(a,bs)
Object.keys()
Object.values()
Object.entries()
Object.getOwnPropertyNames() //自身属性，不包含Symbol
Object.getOwnPropertyDescriptors(a,b,...)
Object.getOwnPropertySymbols(obj)
Reflect.ownKeys() //自身属性，包含Symbol
...扩展运算符 ，剩余运算符
in 关键字 //判断对象是否包含某个属性
Object.freeze(a) 浅层冻结
Object.defineProperty(obj,name,fn) //精准操作属性

---

1. 属性简写、声明时属性名可以用变量、对象上方法简写

var name = 'xiaoyue'
let age = 18
let s = 'school'
let obj = {
    name:'sunny',
    age,// 1、属性简介表示法，
    [s]:'imooc', //2、属性名可以用变量，中括号内加变量名
    study:function(){
        console.log(this.name)
    },
    eat(){ //3、对象上的方法简写，
        console.log(this.name)
    },
    hit:()=>{//4、不要使用箭头函数！会改变指向
        console.log(this.name)
    }
}
obj.study()//sunny
obj.eat()//sunny
obj.hit()//xiaoyue

2. Object.is 严格判断，类似于 ===

console.log(Object.is(2,'2')) //false
console.log(Object.is(NaN,NaN)) //true
console.log(NaN == NaN) //false 
console.log(Object.is(+0,-0)) //false
console.log(Object.is(undefined,null)) //false
console.log(undefined == null) //true
const obj1 = { a:1 };
const obj2 = { a:1 };
const obj3 = obj2;
console.log(Object.is(obj1,obj2)) //false 引用类型，判断的是引用地址
console.log(Object.is(obj2,obj3)) //true 引用类型，判断的是引用地址

3. 冻结对象,但是只能浅层冻结，深层冻结的用递归一层一层

var obj = {a:1,b:2}
Object.freeze(obj);
obj.a = 1111111;
console.log(obj) //{a: 1, b: 2}

4. defineProperty，getOwnPropertyDescriptors
   设置属性是否可读，是否可删除，是否可被遍历

Object.defineProperty(obj,'name',{
    value:'della',
    writable:false, //是否可修改,默认为true，设置为false不可修改
    configurable:false, //是否可删除,默认为true，设置为false不可删除
    enumerable:false //是否可遍历,默认为true，设置为false不可被遍历
})
obj.name = 'aaa'
console.log(obj) //{name: 'della'}
for(let key in obj){
    console.log(key) //无输出
}
delete obj.name
console.log(obj) //{name: 'della'}
// 打印出属性的描述情况：value，writable，configurable，enumerable
console.log(Object.getOwnPropertyDescriptors(obj)) 
console.log(Object.getOwnPropertyDescriptor(obj,'name')) 

image.png

5. in关键字， 判断对象中是否有某个属性名

//判断对象中是否有某个属性名
console.log('a' in obj) //true  obj中是否有name属性
console.log('aa' in obj) //false
const arr = [1,2,3]
console.log(2 in arr) //数组中是否存在第三个元素
Reflect.has(obj,'name') // true.  obj中是否有name属性

6. 遍历对象

for(let key in obj){
    console.log(key)
}
Object.keys(obj).forEach(key=>{
    console.log(key)
})
Object.getOwnPropertyNames(obj).forEach(key=>{
    console.log(key)
})
Reflect.ownKeys(obj).forEach(key=>{
    console.log(key)
})

7. 扩展运算符，剩余运算符

const obj1 = { a:2 , b:3}
const obj2 = {...obj1}  //用于拷贝属性
console.log(obj2) // { a:2 , b:3}
const obj3 = { a:3 , c:5 }. 
console.log({...obj1,...obj3}) // { a:3 , b:3 , c:5 }  //用于合并对象属性

剩余运算符

let obj = {
    name: 'della',
    age: 18,
    address: 'xxx',
    hobby: 'sing'
}
const { name, age, ...rest } = obj ;//剩余运算符
console.log(rest) //{address: 'xxx', hobby: 'sing'}

8. 对象的拷贝与合并

// 合并对象
const obj1 = { a:2 , b:3}
const obj2 = { a:5 , c:3}
console.log(Object.assign(obj1,obj2)) // { a:5 , b:3 ,c:3}  浅拷贝，把obj2的属性合并到obj1上 
// 深拷贝
const obj3 = JSON.stringify(obj1);
console.log(JSON.parse(obj3)); // { a:2 , b:3}s

9. Object.fromEntries （2019/es10），和Object.entries相反

const course = {
    math:85,
    chinese:90,
    english:78
}
// 找出高于80分的科目
// 思路：先转数组,在比较
const entries = Object.entries(course).filter(([key,val])=>val>80);
console.log(entries) //是个二维数组 
const obj = Object.fromEntries(entries);
console.log(obj) //{math: 85, chinese: 90}```