es6数组去重的方法 es6对象转数组

面试时有面试官问ES6的解构作业是深抄还是浅抄。以下是总结。ES6的解构赋值,大家应该都清楚,就是可以快速取出数组或者对象中的值;我们先来看一个使用案例:ES6的解构赋值大家应

本文最后更新时间:  2023-02-25 16:10:20

面试时有面试官问ES6的解构作业是深抄还是浅抄。以下是总结。

ES6的解构赋值,大家应该都清楚,就是可以快速取出数组或者对象中的值;我们先来看一个使用案例:

ES6的解构赋值大家应该都很清楚,就是数组或者对象中的值可以快速取出;让我们先来看一个用例:

解构

参见:

https://es6.ruanyifeng.com/#文件/解构。

那么,ES6的解构作业是深抄还是浅抄呢?

我们先来看看深度复制和轻度复制的定义。

深层复制:修改新变量的值不会影响原变量的值。默认情况下,基本数据类型(数字、字符串、空、未定义、布尔)都是深度副本。

浅拷贝:修改新变量的值会影响原变量的值。默认情况下,所有引用类型(对象)都是浅表副本。

让我们从一个基本类型的例子开始,它直接用等号赋值。

let user = 'siri'let stu = userstu = 'jack'console.log('输出:',stu)// 输出:jackconsole.log('输出:',user)// 输出:siri

从上面的例子可以看出:
STU的值的变化不会影响到用户,所以基本的数据类型,直接用等号赋值的,也是深拷贝;

让我们看另一个引用类型的例子,它直接用等号赋值。

let obj1 = { name:'siri', age:18}let obj2 = obj1obj2.name = 'jack'console.log('obj1',obj1)console.log('obj2',obj2)// obj1 {name: "jack", age: 18}// obj2 {name: "jack", age: 18}

在上面的例子中,我们可以看到obj1被赋值给obj2,然后obj2中的name值被改变。发现obj2里的名字也改了,所以是浅抄。(因为它们引用的是同一个地址的数据!复制的时候并没有为obj2创建独立的内存,只是把obj1的数据指针复制到obj2)

理解了上面的例子,我们再回到解构作业。

修改顶部的解构分配代码,为姓名和年龄分配值。

const userInfo = { name:'siri', age:18}let {name,age} = userInfoname = 'jack'age = 16console.log('打印userInfo',userInfo)// 打印userInfo {name: "siri", age: 18}

我们发现userInfo 的数据并没有被改变,有同学会说,解构赋值好像是深拷贝啊?????

我们发现userInfo的数据没有被更改。有的同学会说,解构作业好像是深度临摹。????

image.png

让我们再次修改代码。

const userInfo = { name:'siri', age:18, detail:{ qq:'1', email:'1366666@163.com' }}let {name,age,detail} = userInfoname = 'jack'age = 16detail.qq = "2"console.log('打印userInfo',userInfo)

打印信息:

发现解构后的赋值对象修改了原对象细节中的qq数据,所以还是浅拷贝;

总结:

解构赋值,如果所解构的原对象是一维数组或对象,其本质就是对基本数据类型进行等号赋值,那它就是深拷贝;如果是多维数组或对象,其本质就是对引用类型数据进项等号赋值,那它就是浅拷贝;

结论:解构赋值是浅层拷贝(因为真的做不了多维数组或对象的深层拷贝);

深度复制的实现方法

本质上,对象被分解成基本的数据类型进行赋值。

function deepClone(source){ const targetObj = source.constructor === Array ? [] : {}; // 判断复制的目标是数组还是对象 for(let keys in source){ // 遍历目标 if(source.hasOwnProperty(keys)){ if(source[keys] && typeof source[keys] === 'object'){ // 如果值是对象,就递归一下 targetObj[keys] = source[keys].constructor === Array ? [] : {}; targetObj[keys] = deepClone(source[keys]); }else{ // 如果不是,就直接赋值 targetObj[keys] = source[keys]; } } } return targetObj;}

温馨提示:内容均由网友自行发布提供,仅用于学习交流,如有版权问题,请联系我们。