【前端面试指南】JS-1-手写深拷贝和浅拷贝

最新推荐文章于 2025-02-27 13:39:31 发布
原创 最新推荐文章于 2025-02-27 13:39:31 发布 · 437 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文探讨JavaScript中的浅拷贝和深拷贝概念，详细讲解了如何使用展开运算符进行浅拷贝，以及通过JSON转换实现深拷贝的简单方法。同时，指出了JSON转换方法的缺点，如忽略函数、不能处理循环引用等问题，并介绍了手写深拷贝的递归实现，强调了在拷贝过程中检查类型和循环引用的重要性。

  1. 浅拷贝

    1. 定义：浅拷贝是拷贝第一层的拷贝

    2. 方法：

      1. 使用Object.assign解决这个问题。
      let a = {
       
       
  age: 1
}
let b = Object.assign({
       
       }, a)
a.age = 2
console.
最低0.47元/天 解锁文章
JS中的浅拷贝与深拷贝方法（秒懂拷贝原理与手写深拷贝）
百赢出品，必属精品
04-04 2015
换句话说，新对象和原对象的所有属性，包括引用类型属性，在内存中都是完全独立的。需要注意的是，浅拷贝和深拷贝只针对引用类型的属性，对于原始类型的属性，复制的都是值。浅拷贝是指创建一个新对象，然后将原对象的引用类型的属性复制给新对象。当对象中包含嵌套的子对象，且需要确保复制后的对象完全独立于原始对象时，应使用深拷贝。如果只需要复制对象的部分属性，可以使用浅拷贝来复制所需的属性，而不必复制整个对象。如果需要复制对象的所有子对象，而不仅仅是第一层的属性，应使用深拷贝。操作七：深拷贝中的循环引用。
金九银十：20道前端手写面试题
java_beautiful的博客
08-10 1646
最后希望大家能理解这些题并知晓why，有些题，并不是单单只是用来考你。而是变相的让你理解这其中深藏的意义。以上的题目，我的答案并非就是最优答案。若你有更好的解决方法，请不要吝啬，大胆的敲到评论区！我会把你的解决方法补充到文章里面。...
ES6 深拷贝_手写系列——JS深拷贝和浅拷贝
weixin_39733812的博客
11-20 221
不要问我心里有没有你，我余光中都是你。——余光中概念补漏1. 堆栈的概念在计算机中，堆栈是两种数据结构。栈(stack)：先进后出；动态分配的空间 一般由程序员分配释放， 若程序员不释放，程序结束时可能由OS回收，分配方式倒是类似于链表。堆(heap)：队列优先,先进先出；由操作系统自动分配释放 ，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中的栈。2.基本，引用数据类型7...
JavaScript 深拷贝 递归 手写
01-08
今天的学习笔记写在了自己的网页笔记本上，没有记录到博客，但是学到一个有关深拷贝的实现方法，为加深印象，这里给大家分享一下： 深拷贝：就是拷贝到最底层的属性。 function deepCopy(object){ //这里传入一个拷贝的对象 /*这里定义一个返回的新对象，也就是拷贝完成后的对象*/ let newObject = Array.isArray(object) ? []: {}; // 首先定义对象类型，如果传入的是数组，则定义一个空数组，如果是对象，则定义一个空对象 if(object && typeof(object) === 'object'){ //这里再次判断他
如何写出一个惊艳面试官的深拷贝?
weixin_45189747的博客
09-08 332
导读 最近经常看到很多JavaScript手写代码的文章总结，里面提供了很多JavaScript Api的手写实现。 里面的题目实现大多类似，而且说实话很多代码在我看来是非常简陋的，如果我作为面试官，看到这样的代码，在我心里是不会合格的，本篇文章我拿最简单的深拷贝来讲一讲。 看本文之前先问自己三个问题： 你真的理解什么是深拷贝吗？ 在面试官眼里，什么样的深拷贝才算合格？ 什么样的深拷贝...
js:手写实现深浅拷贝
bzaZJU的博客
05-07 266
js:深浅拷贝 浅拷贝 首先来看js的浅拷贝： 首先来直观的感受一下什么是拷贝。 let arr = [1, 2, 3]; let newArr = arr; newArr[0] = 100; console.log(arr);//[100, 2, 3] 这是直接赋值的情况，不涉及任何拷贝。当改变newArr的时候，由于是同一个引用，arr指向的值也跟着改变。 现在进行浅拷贝： let arr = [1, 2, 3]; let newArr = arr.slice(); newArr[0] = 10
HOW - 当你作为一名前端面试官（准备篇）
最新发布
weixin_58540586的博客
02-27 1308
想要一些实用的策略来缓解压力，比如如何控制面试时间，如何处理候选人的沉默，或者如何记录评价。这些都是初次面试官常遇到的挑战，需要在回答中补充这些内容。此外，反馈机制和后续跟进也是面试官需要注意的环节，这些可能在之前的回答中没有详细展开。最后，保持语气友好，鼓励候选人如果有具体问题可以进一步讨论，这样可以增强互动性，提升候选人发挥水平。forEach: 用于对数组中的每个元素执行某些操作，没有返回值，无法链式调用，无法中断循环。map: 用于生成一个新数组，返回值是新数组，可以链式调用，无法中断循环。
前端面试必备知识手册：涵盖HTML、CSS与JavaScript核心考点
例如：变量提升（Hoisting）、作用域链、执行上下文、垃圾回收机制、深拷贝与浅拷贝的实现、防抖与节流函数编写、柯里化函数设计、Promise原理手写实现、Virtual DOM Diff算法逻辑等，都是高频考点。 此外，“公司...
前端面试题
IT_Jiangxiaobai的博客
05-19 5672
01-HTML~02-CSS 1.每个HTML文件里面都有一个很重要的东西，Doctype，知道这是干什么的么？ 要点一 : 该标签告知浏览器浏览文档要使用的HTML规范 , 告知浏览器以何种规范解析页面 要点二 : 声明对大小写不敏感 2.常用浏览器有哪些，内核都是什么？ 答： 常用浏览器有chrome、safari、 IE、火狐(firefox) 、 Opera 、360、搜狗等 浏览器 内核 备注 IE Trident IE、猎豹安全、360极速浏览器、百度浏览器 firefo
JavaScript基础：手写浅拷贝与深拷贝
imagine_tion的博客
03-30 1904
一、概念 1.浅拷贝（浅克隆） 创建一个新对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值，如果属性是引用类型，拷贝的就是内存地址 ，所以如果其中一个对象改变了这个地址中的值，就会影响到另一个对象。 2.深拷贝（深克隆） 将一个对象从内存中完整的拷贝一份出来,从堆内存中开辟一个新的区域存放新对象,且修改新对象不会影响原对象。 二、实现 1.浅拷贝 创建一个新的对象，遍历需要克隆的对象，将需要克隆对象的属性依次添加到新对象上，然后返回。 function clo.
JavaScript手写浅拷贝和深拷贝
weixin_57677300的博客
08-19 442
JavaScript手写浅拷贝和深拷贝
面试之：js的深拷贝和浅拷贝
weixin_43342105的博客
06-04 946
文章目录什么是深拷贝，浅拷贝深拷贝有哪些方式用JSON下的方法用递归实现 什么是深拷贝，浅拷贝 拷贝就是复制的意思深拷贝就是完全在另一个地址空间复制当前的值，而浅拷贝就是只复制指向复杂数据类型的指针，并没有创建一个新的地址空间 看下面的例子就更加清晰知道了 let book = { name:"局外人", types:{ t1:"中文版", t2:"英文版" }
浅拷贝和深拷贝---JS实现深拷贝的方式
weixin_41957432的博客
11-25 334
说道数据拷贝就离不开数据类型，在JS中数据类型分为基本类型和引用类型 基本类型： number， boolean，string，symbol，bigint，undefined，null 引用类型： object 以及一些标准内置对象 Array、RegExp、String、Map、Set… 一. 基本类型数据拷贝 基本类型数据都是值类型，存储在栈内存中，每次赋值都是一次复制的过程 var a = 12; var b = a; 二. 引用类型数据拷贝 1、浅拷贝 只拷贝对象的一层数据，再深处
手写深拷贝和浅拷贝
qq_45438471的博客
04-24 720
本文主要说明如何实现深拷贝和浅拷贝。
前端面试手写题 -- (二)深拷贝
Celine921的博客
03-22 1252
手写深拷贝
前端面试 - 手写浅拷贝深拷贝
硕的博客
03-30 166
// 浅拷贝 // 只是把对象的属性和属性值拷贝到另一个对象中 var obj1 = { a: { a1: { a2: 1 }, a10: { a11: 123, a111: { a1111: 123123 } } }, b: 123, c: "123" } // 方式1 function clone1(o) { let obj = {} for (let i in o) { obj[i] = o[i] } retu
js手写题——深拷贝和浅拷贝
csdn_46884182的博客
08-26 478
深拷贝浅拷贝
手写 js 深浅拷贝
曾经沧海难为水
11-26 404
js 深浅拷贝 浅拷贝 拷贝 目标对象的属性 引用类型地址 实现浅拷贝的方式 Object.assign({}, .obj) Array.slice() // 浅拷贝简单实现 function clone(target) { if(target === null ) { return target } // 克隆 数组 和 对象 let cloneTarget = Array.isArray(target) ? [] : {} for (const
手写源码之--深拷贝与浅拷贝
前端劝退工程师
01-03 869
区分赋值与拷贝 这叫对象赋值 改变内存中的值,所有的引用一起改 这叫浅拷贝 可以复制一层基本类型 浅拷贝实现 // 方法一： const newObj = {...obj} //方法二： const newObj = Object.assgin({},obj) //方法三： const newObj = Object.creact({},obj) 浅拷贝:复制一个对象,如果属性是基本类型...
js 手写深拷贝和浅拷贝
09-06
深拷贝和浅拷贝是 JavaScript 中用于复制对象的两种不同方式。 浅拷贝只是复制对象的第一层属性，而不会复制对象中的引用类型属性。也就是说，浅拷贝只会复制对象的引用，而不会创建一个新的对象。这意味着，如果...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值