#yyds干货盘点# 前端歌谣的刷题之路-第一百五十六题-简易深拷贝

简介: #yyds干货盘点# 前端歌谣的刷题之路-第一百五十六题-简易深拷贝

题目

请补全JavaScript代码,要求实现对象参数的深拷贝并返回拷贝之后的新对象。

注意:

1. 参数对象和参数对象的每个数据项的数据类型范围仅在数组、普通对象({})、基本数据类型中]

2. 无需考虑循环引用问题

image.png

编辑

核心代码

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>简易深拷贝</title>
</head>
<body>
  <!-- 根据题目要求,实现对象参数的深拷贝并返回拷贝之后的新对象,因为参数对象和参数对象的每个数据项的数据类型范围仅在数组、
    普通对象({})、基本数据类型中且无需考虑循环引用问题,所以不需要做过多的数据类型判断,核心步骤有:
    如果对象参数的数据类型不为“object”或为“null”,则直接返回该参数
    根据该参数的数据类型是否为数组创建新对象
    遍历该对象参数,将每一项递归调用该函数本身的返回值赋给新对象
 -->
  <script type="text/javascript">
    const _sampleDeepClone = target => {
      if (typeof target === 'object' && target !== null) {
        const cloneTarget = Array.isArray(target) ? [] : {}
        for (prop in target) {
          if (target.hasOwnProperty(prop)) {
            cloneTarget[prop] = _sampleDeepClone(target[prop])
          }
        }
        return cloneTarget
      } else {
        return target
      }
    }
  </script>
</body>
</html>
相关文章
|
存储 JSON 前端开发
栈在前端中的应用,顺便再了解下深拷贝和浅拷贝!
该文章探讨了栈在前端开发中的应用,并深入讲解了JavaScript中深拷贝与浅拷贝的区别及其实现方法。
栈在前端中的应用,顺便再了解下深拷贝和浅拷贝!
|
前端开发 JavaScript
前端 js 经典:深拷贝
前端 js 经典:深拷贝
91 1
|
前端开发 JavaScript
前端深拷贝、浅拷贝,一起手撕深拷贝
【7月更文挑战第2天】JavaScript中的深拷贝和浅拷贝关乎对象复制的独立性。浅拷贝(如`Object.assign()`、扩展运算符)创建新对象,但共享引用类型属性的内存地址,导致修改新对象会影响原始对象。深拷贝(如递归复制)创建完全独立的对象副本,不受原始对象变动影响。`JSON.parse(JSON.stringify(obj))`是简单的深拷贝方法,但无法处理函数、undefined、Symbol及循环引用。手动实现深拷贝需递归遍历并处理循环引用问题,以确保复制的完整性。理解这两者差异对编写健壮的代码至关重要。
156 0
|
前端开发 Java C++
【前端面试题】深拷贝的终极实现
【前端面试题】深拷贝的终极实现
160 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝2
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝2
100 0
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝2
|
存储 JSON 缓存
前端面试:浅拷贝和深拷贝的区别?
前端面试:浅拷贝和深拷贝的区别?
202 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝3
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝3
88 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝4
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝4
83 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝1
前端学习笔记202306学习笔记第四十二天-Es6-实现深拷贝1
190 0
|
前端开发
前端学习笔记202306学习笔记第四十二天-深拷贝解决循环引用问题3
前端学习笔记202306学习笔记第四十二天-深拷贝解决循环引用问题3
83 0

热门文章

最新文章

  • 1
    前端如何存储数据:Cookie、LocalStorage 与 SessionStorage 全面解析
  • 2
    前端工程化演进之路:从手工作坊到AI驱动的智能化开发
  • 3
    Vue 3 + TypeScript 现代前端开发最佳实践(2025版指南)
  • 4
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(五):背景属性;float浮动和position定位;详细分析相对、绝对、固定三种定位方式;使用浮动并清除浮动副作用
  • 5
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(六):全方面分析css的Flex布局,从纵、横两个坐标开始进行居中、两端等元素分布模式;刨析元素间隔、排序模式等
  • 6
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(一):CSS发展史;CSS样式表的引入;CSS选择器使用,附带案例介绍
  • 7
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(八):学习transition过渡属性;本文学习property模拟、duration过渡时间指定、delay时间延迟 等多个参数
  • 8
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(九):强势分析Animation动画各类参数;从播放时间、播放方式、播放次数、播放方向、播放状态等多个方面,完全了解CSS3 Animation
  • 9
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(四):元素盒子模型;详细分析边框属性、盒子外边距
  • 10
    【CSS】前端三大件之一,如何学好?从基本用法开始吧!(二):CSS伪类:UI伪类、结构化伪类;通过伪类获得子元素的第n个元素;创建一个伪元素展示在页面中;获得最后一个元素;处理聚焦元素的样式
  • 下一篇
    oss云网关配置