一.堆和栈的概念
在了解深拷贝和浅拷贝之前我们先简单了解一下堆和栈的概念。
堆的概念:在javaScript中,堆是用来存储地址的。比如引用数据类型的地址就是存储在堆中。
栈的概念:栈在javascript中用于存储值的。比如基本数据类型都是直接存在栈内存中的。
二.深拷贝和浅拷贝的区别
简单的来说,深拷贝就是拷贝地址,比如一个数组被深拷贝,那么前者变化不会引起后者变化,因为地址变了。但是浅拷贝时就会引起后者跟着前者变。因为地址没变,只是拷贝了值。他们还是指向同一个地址。
三.深拷贝和浅拷贝常用的方法
深拷贝的方法:
1.将对象转化为Json字符串形式,再将其转化为原生js对象。(项目中用的最多的)
let obj1 = { name: "zj", age: "18", sex: "女" } let obj2 = JSON.parse(JSON.stringify(obj1)); // 改变obj1 obj1 = { name: "wc", age: "18", sex: "男" } console.log(obj1, obj2); // obj2未跟着obj1变
2.通过递归实现深拷贝。
let obj1 = { name: "zj", age: "18", sex: "女" } function copy (obj) { // 创建一个空对象用来拷贝之后的内容 let newObj = {} //判断数据是否为 复杂数据类型 if (typeof obj === 'object') { // 是 就将该数据进行 遍历 for (let k in obj) { // 当 obj[k] 的值依然为 复杂数据类型时 重新调用该函数 // 将obj[k] 当实参 进行调用 直至 obj[k] 的值不在为 复杂数据类型 newObj[k] = copy(obj[k]) } } else { newObj = obj } // 将 copy 的对象返回出去(不写 return 会得到 undefined) return newObj } const obj2 = copy(obj1); obj1.name = "wang"; console.log("obj1", obj1); console.log("obj2", obj2);
3.通过jquery的extend方法实现深拷贝
let obj1 = { name: "zj", age: "18", sex: "女" } let obj2 = $.extend(true, {}, obj1); // true为深拷贝,false为浅拷贝 console.log(obj2);
4.通过函数库lodash的cloneDeep方法实现。
浅拷贝的方法:
1.直接赋值
2.通过es6的扩展运算符
3.jquery的extend方法
4.Object.assign()方法
5.遍历循环等方法
6.还可以通过数组方法,比如:slice、concat等很多。
今天的分享就到这里,下期我们整理数组方法和对象方法,项目中常用的。大家有啥不同意见评论区相互交流学习。