一、扩展运算符
1、复制对象—浅拷贝
深拷贝和浅拷贝的区别:
(1)浅拷贝:浅拷贝的时候,创建一个新的对象,这个对象中存放着原对象精准的值,如果对象是基本数据类型,拷贝的就是基本类型的值,如果对象是引用数据类型,拷贝的则是这个对象所指向的一个指针,如果其中一个对象的引用数据类型改变了值,那么会影响另外一个的值,简单来说就是,只拷贝第一层中的值,但是对象中的子对象不会,两者就会有相同的引用。
数组中:可以实现浅拷贝的方法:扩展运算符,concat,slice
对象中:可以实现浅拷贝的方法:Object.assign()
(2)深拷贝:深拷贝的时候,创建一个新的对象和数组,将原对象的各项属性的“值”(数组的所有元素)拷贝过来,是“值”而不是“引用”,两者之间改变互不影响,简单来说深拷贝就是不仅拷贝了值,也将值对应的地址也复制过来,形成一个全新的内容,即使改变原对象的内容,也不会影响另一个。
const obj1 = {
a: 1,
b: 2,
d: {
aa: 1,
bb: 2
}
};
const cObj1 = { ...obj1 };//复制
cObj1.d.aa = 999;//改变值
console.log(cObj1.d.aa);//999
console.log(obj1.d.aa);//999
2、合并对象,也是浅拷贝(若有相同属性名,则以后一个为准(替换掉前面一个),跟顺序有关;
const obj1 = {
a: 1,
b: 2,
d: {
aa: 1,
bb: 2
}
};
const obj2 = {
c: 3,
a: 9
};
const newObj = {
...obj2,
...obj1
};
console.log(obj1); //a:9,b:2,d:{...},c:3
newObj.d.aa = 22; // 改变值
二、Object新方法:
1、Objec.is 主要区别在+0与-0,NAN与NAN
console.log(Object.is(+0, -0)); //false
console.log(+0 === -0); //true
console.log(Object.is(NaN, NaN));//true
console.log(NaN === NaN); //false
2、Object.assign({},{},{})-----合并对象-- 浅拷贝
const obj = Object.assign({a: 1}, {b: 2}, {c: 3}, {d: 4, e: 5});
//也是一种浅拷贝
const obj = {
a: 1,
b: {
c: 2
}
};
let newObj = Object.assign({a: 3}, obj);
console.log(newObj.b.c);//2
newObj.b.c = 100;
console.log(obj.b.c);//100
Object.keys(obj) 获取参数对象自身的(不含继承的)所有可遍历属性的key(键名),返回一个数组
Object.values(obj) 获取参数对象自身的(不含继承的)所有可遍历属性的value(键值),返回一个数组
Object.entries(obj) 获取参数对象自身的(不含继承的)所有可遍历属性的key:value(键值对),返回一个数组
const obj = {
a: 1,
b: 2,
c: 3,
d: 4
};
// Object.keys
console.log(Object.keys(obj)); //["a","b","c","d"]
// Object.values
console.log(Object.values(obj));//[1,2,3,4]
// Object.entries
console.log(Object.entries(obj));//["a",1]["b",2]["c",3]["d",4]
//以上三个方法可结合for...of直接遍历对象而不需要再使用hasOwnProperty来判断是否是自身的属性
for (let [k, v] of Object.entries(obj)) {
console.log(k, v);//a 1 b 2 c 3 d 4
}