js高级03-深拷贝和浅拷贝总结（涉及递归！JSON）（面试）

 // 浅拷贝只拷贝一层，更深层次对象级别的只拷贝引用

  // 深拷贝拷贝多层，每一级别的数据都会拷贝

 一.js的内存结构：（会模糊不定，那引入js的数据类型）

1.js的数据类型==》基本类型和引入类型

 

 

 

 二.vue.js的对象列表

先定义一个表单的结构 实现数据的双向绑定 然后点击添加按钮的时候会触发数组list的添加。

解析：当点击添加按钮的时候就会添加数据到数组里面 ，这些数组的元素，只有在文本框修改 ，其他都会改变，因为这是数组会存放在堆里（他们都是一个位置！！！）

 

 浅拷贝：

 浅拷贝的实现步骤：
1.先定义一个对象==》里面是键值对
let obj ={
name：'小明'，
age:'18'
}

2.进行浅拷贝：
//①先声明一个空对象
let newObj={}

//②遍历obj这个对象 让obj的属性值赋值于这个空对象：

for(let k in obj){   //这里的k表示的是属性名：obj[k]表示里面的属性值

newObj[k]=obj[k]
}
3.进行输出打印效果：

cons.log(obj)
cons.log(newobj)
注：为了想检验是否成功 可以在打印obj之前给修改值
obj.name="小红"
cons.log(obj)
cons.log(newobj)

4.封装函数：  
//这里就是把第二步的代码复制过来 然后return这个新的空对象即可
function copy(obj){
let newObj={}

for(let k in obj){   
newObj[k]=obj[k]
}
return newObj

}
调用该函数--先声明变量来接收
const newObejct=copy(obj)

5.打印这个新的newObiect和obj即可;
cons.log(objObject)
cons.log(obj)

三.深拷贝

1.递归==>什么是递归？？==》递归就是自己调用自己

由于递归很容易发生“栈溢出”错误（stack overflow），所以必须要加退出条件 return。

题目： 

解析：输出6==》为什么输出6？？？

分析：①参数n是3 执行else==》3+fun（3-1）为：3+fun（2）

②然后求fun（2）==》为else ：2+fun（2-1）=2+fun（1）==》此时的fun（1）返回1，所以fun2等于3

③所以result为3+fun（2）===》等于3+3==》输出：6

 

 深拷贝：

深拷贝的实现步骤：
1.先定义一个对象==》里面是键值对
let obj ={
name：'小明'，
age:'18',
//----------------------------在此基础上添加了对象
girlfriend：{
name:'小红'
}
}

2.进行浅拷贝：
function copy(obj){
let newObj={}

for(let k in obj){   

newObj[k]=obj[k]
}
return newObj
}
const newObejct=copy(obj)
-------------------------在原来的基础上进行输出
cons.log(obj)
cons.log(newObejct)
此时是可以的 但是在我修改小明的女朋友的时候 另外一个拷贝的也会变化？？什么原因呢？？
这就是基本类型和引用类型的区别==》也就是浅拷贝和深拷贝的区别
obj.girlfriend.name="小花"
cons.log(obj)
cons.log(newObejct)

怎么解决？？？？？采取递归进行深拷贝！！！
思路：在遍历对象后进行判断 判断类型是简单类型还是引用类型==》如果是引用类型，就再次进行函数的调用！！！参数为obj的属性值

修改部分--代码展示：-------------方法一：使用判断和递归
function copy(obj){

let newObj={}

for(let k in obj){   
if(obj[i] instanceof Object){
newObj[k]=copy(obj[k]})

}else{
newObj[k]=obj[k]}

}

}
return newObj
}
//---------------------------------------------方法二：使用JSON来进行深拷贝

function copy(obj){

let str =JSON.stringify(obj)
let newObj=JSON.parse(str)
return newObj
}


obj.girlfriend.name="茉莉"
cons.log(obj)
cons.log(newObejct)

 

JSON的知识点补充：