面试遇到的坑JS深拷贝和浅拷贝

首先要搞明白深拷贝和钱拷贝的区别要先搞明白 栈和堆的区别

一、栈

  栈存储基础数据类型,如: String、Number、Boolean、Null、Underined,这些简单的基础数据类型能够直接存储在栈中。栈如果没有被使用就会被回收

二、堆

  堆存储引用数据类型的是 Function、Array、Object,在栈内存中存储着指向堆的地址和C语言的指针有点像,基本类型在当前执行环境结束时销毁,而引用类型不会随执行环境结束而销毁,只有当所有引用它的变量不存在时这个对象才被垃圾回收机制回收。

  

 

 

 

 

 

 三、深拷贝和浅拷贝

  

function copy(obj){
            let result = {}
            for(var key in obj){
                result[key]=obj[key];
            }
            return result
        }
        var oldObj = {name: 'Tom', age: 18, colors:['blue','pink']}
        var newObj = copy(oldObj)

上面这个代码 oldObj有两个基本属性 name、age  一个引用数据属性colors,但newObj拷贝后 name,age属性会被正常的拷贝,而colors属性,只会进行引用拷贝,这样会导致oldObj和newObj共用一个colors属性.这样就是所谓的浅拷贝。

 

const oldObj = {
                name: '张三',
                age: 20,
                colors: ['yellow','orange']
            }
            
            function deepClone(obj){
                 if (typeof obj !== 'object' || obj == null){
                     return obj;
                 }
                 let result;
                 if (obj instanceof Array){
                     result = []
                 } else {
                     result = {}
                 } 
                 for(var key in obj) {
                     if (obj.hasOwnProperty(key)){
                         result[key] = deepClone(obj[key]);
                     }
                     
                 }
                 return result;
            }
            
            const newObj = deepClone(oldObj);
            newObj.name = '李四';
            newObj.colors[0] = 'pink';
            console.log(oldObj)
            console.log(newObj)

上面这个代码  result[key] = deepClone(obj[key]);  deepClone()的回调函数,是为了拷贝colors里面的数据,

posted @ 2021-05-19 16:39  一杯咖啡钱  阅读(308)  评论(0编辑  收藏  举报