一.浅拷贝

浅拷贝
被复制对象的所有变量都含有与原来的对象相同的值，而所有的对其他对象的引用仍然指向原来的对象。即对象的浅拷贝会对“主”对象进行拷贝，但不会复制主对象里面的对象。”里面的对象“会在原来的对象和它的副本之间共享。

1.JavaScript中变量包含两种不同的数据类型基本数据类型引用数据类型

基本类型值指的是简单的数据段，包括es6里面新增的一共是有6种，具体如下：number、string、boolean、null、undefined、symbol。
引用类型值指那些可能由多个值构成的对象，只有一种如下：object。
在将一个值赋给变量时，解析器必须确定这个值是基本类型值还是引用类型值。

2.基本类型与引用类型最大的区别实际就是传值与传址的区别

值传递：基本类型采用的是值传递。
地址传递：引用类型则是地址传递，将存放在栈内存中的地址赋值给接收的变量。

接下来看几个例子就会理解两者区别

数组

var arra=[1,2,3,4,5]
var arra1=arra
arra1.push(9)
console.log(arra);
console.log(arra1);

向操作一个数组另一个数组也受到影响，因为他们指向同一地址，如图所示

对象之间的赋值基本数据类型之间的赋值同理都会导致这样的问题

二.深拷贝

深拷贝不仅将原对象的各个属性逐个复制出去，而且将原对象各个属性所包含的对象也依次采用深复制的方法递归复制到新对象上,所以对一个对象的修改并不会影响另一个对象。

数组的深拷贝

方法一：for循环

  let arr1 = [1,2,3];let arr2 = copyArr(arr1);function copyArr(arr){let res=[];for(let i=0,length=arr.length;i<length;i++){res.push(arr[i]);}return res;}

方法二 slice()方法

利用数组自身的方法，slice、

 let arr1 = [1,2,3];let arr2 = arr1.slice(0);

方法三 concat()方法

 let arr1 = [1,2,3];let arr2 = arr1.concat();

方法四扩展运算符

 let arr1 = [1,2,3];let [...arr2] = arr1;

方法五 Array.from

如果参数是一个真正的数组，Array.from会返回一个一模一样的新数组

 let arr1 = [1,2,3];let arr2 = Array.from(arr1);

对象的深拷贝

方法一 for循环

   let obj1={count:1,name:'grace',age:1};let obj2 = copyObj(obj){let res = {};for(let key in obj){res[key]=obj[key];}return res;}

方法二 Json

万能转换器 JSON.parse(JSON.stringify(obj))深拷贝已有对象，它可以深拷贝多层级的，不用担心嵌套问题。

JSON.stringfy() 将对象序列化成json对象

JSON.parse() 反序列化——将json对象反序列化成js对象

 let obj = {name: '静茹秋叶'}console.log('obj: ', obj)console.log('json string: ', JSON.stringify(obj))let str = JSON.stringify(obj)console.log('--------------')console.log(str)console.log('str to obj: ', JSON.parse(str))

方法三扩展运算符

let obj1={count:1,name:'grace',age:1};
let {...obj2} = obj1;

方法四 Object.assign()方法 ES6新增加

ES6的Object.assign() Object.assign(target, …sources)用于对象的合并，将源对象中的所有可枚举属性，复制到目标对象中，并返回合并后的目标对象。后来的源对象的属性值，将会覆盖它
 let person = {name: 'xia',age: 25,height: 160}let otherPerson = Object.assign({}, person)person.age = 30console.log(person)console.log(otherPerson)
之前的对象的属性。

JavaScript面试精讲（七）——谈谈深拷贝和浅拷贝相关推荐

JavaScript面试精讲（六）——说说你经常使用到的array方法
目录一.数组转换相关的方法 1.instanceof() 2.toString() 3.valueOf() 4.join() 二.数组的增删 1.数组的增加 2.数组的删除三.数组的排序和反转 1 ...
JavaScript异步精讲，让你更加明白Js的执行流程！
JavaScript异步精讲,让你更加明白Js的执行流程! 问题点什么是单线程,和异步有什么关系什么是 event-loop jQuery的Deferred Promise 的基本使用和原理 as ...
java基础：Java七大外企经典面试精讲视频
java基础:Java七大外企经典面试精讲视频对于很多应聘java程序员的求职者来说,全面掌握java面试技巧,确实是自己找到一个好工作的敲门砖.今天小编在这里给大家分享一个关于java基础的Jav ...
面试精讲之面试考点及大厂真题 - 分布式专栏 04 谈谈你对分布式的理解，为什么引入分布式？
04谈谈你对分布式的理解,为什么引入分布式? 引言刚刚毕业第一份工作,没接触过分布式微服务相关的知识,后来换工作才了解到这些,面试官看了我简历里写了分布式相关,就开始揪住这个问题问,虽然一知半解地说 ...
面试精讲(guigu)
文章目录精讲 1. 基础部分 2. 对象 3. 原型 4. 预解析 5.执行上下文 6. 作用域 7. 闭包 9. 同步/异步 11. Promise 精讲 1. 基础部分变量:用来存放数据,保存 ...
【C++面试问答】搞清楚深拷贝与浅拷贝的区别
问题深拷贝和浅拷贝的区别是面试中的常见问题之一,对于不同的编程语言,这个问题的回答可能稍有差别,下面我们就来探索一下它们之间的异同吧. 先来看看在JavaScript对象的深拷贝与浅拷贝的区别: 浅 ...
面试篇---1 如何区分深拷贝与浅拷贝
如何区分深拷贝与浅拷贝? 简单来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力. 浅拷贝例子: var a=[0 ...
面试常问啥是深拷贝和浅拷贝，这篇看完你就懂了
学习目标学习深拷贝和浅拷贝的区别与使用,这非常有必要! 学习内容深拷贝和浅拷贝 1.浅拷贝:就是简单赋值的拷贝过去 2.深拷贝:重新在堆里建一个空间,在拷贝过去上面我们简单的阐述了一下深拷贝和浅 ...
面试官：什么是深拷贝和浅拷贝？
Time will tell. 1.先来道题热热身 a = ('a', 'b','c') c = copy.copy(a) d = copy.deepcopy(a)if c == d:print(&q ...

JavaScript面试精讲（七）——谈谈深拷贝和浅拷贝

一.浅拷贝

接下来看几个例子就会理解两者区别

对象之间的赋值基本数据类型之间的赋值同理都会导致这样的问题

二.深拷贝

JavaScript面试精讲（七）——谈谈深拷贝和浅拷贝相关推荐

最新文章

热门文章

JavaScript面试精讲（七）——谈谈深拷贝和浅拷贝

一.浅拷贝

接下来看几个例子就会理解两者区别

对象之间的赋值 基本数据类型之间的赋值同理都会导致这样的问题

二.深拷贝

JavaScript面试精讲（七）——谈谈深拷贝和浅拷贝相关推荐

最新文章

热门文章

对象之间的赋值基本数据类型之间的赋值同理都会导致这样的问题