面试官:“请你说说深拷贝和浅拷贝”,如何脱颖而出

前言

请你说说深拷贝与浅拷贝

面试被这样突然问一个大方向的知识点,相信很多同学都会一下子懵逼,不知该如何下手如何阐述。今天就教大家面对这样的问题该如何回答。

面对这样一个问题不知道该从哪里入手。不妨就先试试先说一说是什么。比如先说一说什么是深拷贝与浅拷贝?

1. 什么是深拷贝和浅拷贝

复制代码
深浅拷贝通常只针对引用类型。

浅拷贝是直接复制引用地址,修改拷贝对象内部的值,会改变原本对象的值。就是只拷贝了一层对象中的原始值。如果内部有引用类型,就会直接复制他的指针。

2. 如何实现浅拷贝?

js 复制代码
const newObj = Object.assign(obj)
const newArr = [].concat(arr)
const newArr = [].slice
[...xxx]// 数组解构

浅拷贝主要就是上面这几种方法。

3. 手写一个浅拷贝

js 复制代码
function shallowCopy(obj){
    let newObj = {}
    for(const key in obj){
        if(obj.hasOwnProperty(key)){// 判断是否是对象的自有属性
            newObj[key] = obj[key]
            }
      }
    return newObj
}

4. 深拷贝

递归拷贝,是复制对象内部的所有值,如果有引用类型会递归拷贝下来,也就是层层拷贝,所有类型的属性值都会被复制。原对象的修改不会影响拷贝后的对象。

5. 如何实现深拷贝

js 复制代码
function foo() { }
obj = {
    a: 1,
    b: { n: c },
    c: b,
    d: undefined,
    e: Symbol(1),
    f: foo
}
const newObj = JSON.parse(JSON.stringify(obj))//对象转为字符串再转回对象

该方法无法处理对象内部的undefined,symbol,function,无法处理循环引用。使用该方法,面对undefined,symbol,function无法将值拷贝进新对象,面对循环调用会直接报错。

6.手写一个深拷贝

这里就是今天的重点了,一般也是面试官的重点。首先先介绍一种你一定要会的方法。

递归

递归 复制代码
function deepCopy(obj) {
    let newObj = {}
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            if (typeof obj[key] !== 'object' || obj[key] !== null) {//判断当前遍历元素是不是对象
                newObj[key] = obj[key];
            } else {// 不是就递归
                newObj[key] = deepCopy(obj[key]);
            }
        }
    }
    return newObj;
}

这种方法是大家一定要会的,因为深浅拷贝在面试中是个很简单的问题。但是虽然是送分题,只要我们回答的好,一样能变成一个加分项。人家只能回答出一种,你能回答出两种,三种,自然就是加分项了。接下来我就说说另外两种深拷贝的方法。

structuredClone(obj)

js 复制代码
const newObj = structuredClone(obj)

这个方法是一种很新的方法,估计有许多10年程序员也不知道这样一种方法。能回答出来一定能够让面试官惊奇,但是想要变成加分项还是不够的。需要注意的是他无法拷贝Symbol,function和循环调用,对象内部有其一时都会直接报错。

信息管道

js 复制代码
function deepCopy(obj) {
    return new Promise((resolve) => {
        const { port1, port2 } = new MessageChannel()// 信息管道
        port1.postMessage(obj)
        port2.onmessage = (msg) => {
            resolve(msg.data)
        }
    })
}

这个方法利用了通常用于聊天功能的信息管道,实现了一个十分完善的深拷贝,undefined,symbol,function,甚至循环引用他都能够实现深拷贝。

尾声

深浅拷贝这种问题,回答出来是不会加分的,但是回答不出来就会变成一个扣分项。但是像这样回答出这三种手写深拷贝的方法,那他就会变成一个加分项。让面试官对你印象深刻。希望我的文章能够帮到各位,为各位的面试助一点力。

如有问题欢迎各位大佬指正,也希望各位大佬动动发财的小手帮我点个赞,谢谢各位。

相关推荐
anOnion35 分钟前
构建无障碍组件之Slider Pattern
前端·html·交互设计
云水一下41 分钟前
JavaScript 从零基础到精通系列:前世今生与编程启蒙
前端·javascript
月亮邮递员61641 分钟前
Markdown语法总结
开发语言·前端·javascript
Kurisu5751 小时前
雾锁王国修改器下载2026最新
前端·修改器代码
Rain5091 小时前
mini-cc 的 MCP 协议:给 AI 装个 USB-C 接口
c语言·开发语言·前端·人工智能·架构·node.js·ai编程
向量引擎2 小时前
从零起步,如何打造专属向量引擎 API 中转工作流?
java·服务器·前端
AI人工智能+电脑小能手2 小时前
【大白话说Java面试题 第84题】【Mysql篇】第14题:为什么用 InnoDB 存储引擎的表建议用整型的自增主键?
java·开发语言·数据库·mysql·面试
小江的记录本2 小时前
【JVM虚拟机】JVM调优:常用JVM参数、调优核心指标、OOM排查、GC日志分析、Arthas工具使用(附《思维导图》+《面试高频考点清单》)
java·jvm·spring boot·后端·python·spring·面试
丷丩2 小时前
MapLibre GL JS第27课:添加COG栅格源
javascript·map·mapbox·maplibre gl js
IT_陈寒2 小时前
Vue这个动态响应坑把我整不会了
前端·人工智能·后端