对象扩展内容
简洁表示法和属性名表达式
const function def () {
return {
name: name,
age: age,
say: function() {
console.log(this.name)
}
}
}
//ES6可以简洁如下表示,上下是一样的
const function def () {
return {
name,
age
say() {
console.log(this.name)
}
}
}
属性名表达式
我们知道访问属性的方式(点运算符和中括号运算符,区别在于点运算符后面不可以是变量或者数字,而中括号却可以!!!)
let obj = {
1:3,
name: "kangkang",
"adfasdfqwe0qre92323@#@3423": 6
}
obj.name //3
obj[1] //"kangkang"
obj[adfasdfqwe0qre92323@#@3423]//6
const key ="age"
const profile = {
name: "kangkang",
[key]: 21
}
// [key] 变量代表是age ,它可以是任何计算的量,在中括号内
profile.age
//21
profile.key
//undefined
扩展运算符用于快速复制对象
const obj1 = {
a:1,
b:2
}
const obj2 = {...obj1}//成功!
// 当属性存在对象的情况
const obj3= {
a:1,
b:2,
profile: {
name: "kangkang",
age: 25
}
}
const obj4 = {...obj3}
console.log(obj3.profile.name) //"kangkang"
obj4.profile.name = "xiaolan"
console.log(obj3.profile.name) //"xiaolan"
console.log(obj4.profile.name) //"xiaolan"
当进行复制时,扩展运算符遇到属性是对象时只是将对象的地址进行拷贝,所以会出现复制出来的对象可以更改原对象的属性值!!!(浅复制)
合并对象
const newObj = {
...obj1,
...obj2
}
遇到相同的属性是会保留后面一个对象的同名属性的值!!!
合并也是浅拷贝!!
Object.is() 判断两个值是否相等
console.log(Object.is(+0,-0)) //false
console.log(+0 === -0) //true
console.log(Object.is(NaN,NaN)) //true
console.log(NaN === NaN) //false
Object.assign() 复制或者合并对象
const obj = Object.assign({a:1},{b:2},{c:3})
第一个会作为合并最终返回的对象!
也是浅拷贝!
其他
Objectkeys()
Object.values()
Object.entries()
const obj = {
a:1,
b:2,
c:3,
d:4
}
console.log(Objcet.keys(obj)) //属性名组成的数组
console.log(Object.values(obj)) //值组成的数组
console.log(Object.entries(obj)) // 属性名和值组成的数组
for (let [k,v] of Object.entries(obj)) {
console.log(k,v)
} //好好看!
__proto__
Object.setPrototypeOf 修改对象的原型
let obj1 = {
a:1
}
let obj2 = {
b:2
}
let obj3 = Object.create(obj1)
console.log(obj3.__proro__)
// {a:1}
Object.setPrototypeOf(obj3,obj2)
console.log(obj3.__proto__)
//{b:2}
//性能不好!
super关键字访问对象的原型(不是原型链,直接访问原型上的)
const obj = {name: "kangkang"}
const obj2 = {
say(){
console.log(super.name)
} // 只有使用简写形式的方法才可以使用super,否则不行(箭头函数也不行)!
}
obj2.say()//undefined
Object.setPrototypeOf(obj2,obj)
obj2.say()//kangkang