理解前端浅拷贝和深拷贝

131 阅读1分钟

1、浅拷贝

是将原数据中所有的数据复制了一份,放到新的变量空间中,两个变量不共享同一个内存地址;

数组或对象中的值如果是基本类型数据,那拷贝后的数据和原数据是完全没有关联,且互不影响的两个数据;

如果数组或对象的值是引用类型数据的话,拷贝后的数组或对象中的引用类型的值跟原数据中的引用类型的值,还是存在共享同一地址的现象

 常见的浅拷贝方法:Object.assign({},obj)、扩展运算符[...args]

2、深拷贝:

就是不管原数据中值是什么类型的数据,拷贝后的新数据跟原数据是完全没有关联的

      // 使用JSON.parse(JSON.stringify(obj)),实现深拷贝
      
      // 利用递归遍历对象或数组
      ```
        function deepClone(source){
            var result
            // 判断是否是对象
        	if(Object.prototype.toString.call(source) === '[object Object]' ){
            	result = {}
            // 判断是否是数组
            }else if(Object.prototype.toString.call(source) === '[object Array]'){
            	result = []
            }else{
            	return
            }
            // 递归遍历第二层,是引用类型的再调用方法
            for(var attr in source){
            	if(Object.prototype.toString.call(source[attr]) === '[object Object]' || Object.prototype.toString.call(source[attr]) === '[object Array]'){
                	result[attr] = deepClone(source[attr]) 
                }else{
                	result[attr] = source[attr]
                }
            }
            return result
        }
      ```