#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",则直接返回该参数
    如果是"object",就获取该参数的构造函数名,通过正则表达式判断该对象是否为函数、正则、日期、ES6新对象等,如果返回true,则直接返回该参数
    当以上条件判断之后函数依然没有结束时,此时通过数组的原型方法判断该参数为普通对象或数组并创建相应数据类型的新变量
    进入遍历体,将对象参数的每一项赋值给新变量
    最终返回该新变量
 -->
  <script type="text/javascript">
    const _shallowClone = target => {
      if (typeof target === 'object' && target !== null) {
        const constructor = target.constructor
        if (/^(Function|RegExp|Date|Map|Set)$/i.test(constructor.name)) return target
        const cloneTarget = Array.isArray(target) ? [] : {}
        for (prop in target) {
          if (target.hasOwnProperty(prop)) {
            cloneTarget[prop] = target[prop]
          }
        }
        return cloneTarget
      } else {
        return target
      }
    }
  </script>
</body>
</html>
相关文章
|
存储 JSON 前端开发
栈在前端中的应用,顺便再了解下深拷贝和浅拷贝!
该文章探讨了栈在前端开发中的应用,并深入讲解了JavaScript中深拷贝与浅拷贝的区别及其实现方法。
栈在前端中的应用,顺便再了解下深拷贝和浅拷贝!
|
前端开发 JavaScript
前端深拷贝、浅拷贝,一起手撕深拷贝
【7月更文挑战第2天】JavaScript中的深拷贝和浅拷贝关乎对象复制的独立性。浅拷贝(如`Object.assign()`、扩展运算符)创建新对象,但共享引用类型属性的内存地址,导致修改新对象会影响原始对象。深拷贝(如递归复制)创建完全独立的对象副本,不受原始对象变动影响。`JSON.parse(JSON.stringify(obj))`是简单的深拷贝方法,但无法处理函数、undefined、Symbol及循环引用。手动实现深拷贝需递归遍历并处理循环引用问题,以确保复制的完整性。理解这两者差异对编写健壮的代码至关重要。
156 0
|
存储 JSON 缓存
前端面试:浅拷贝和深拷贝的区别?
前端面试:浅拷贝和深拷贝的区别?
202 0
|
前端开发 API
歌谣学前端之react三个api之一续集
歌谣学前端之react三个api之一续集
189 0
|
前端开发
前端学习案例10-深拷贝和浅拷贝
前端学习案例10-深拷贝和浅拷贝
156 0
前端学习案例10-深拷贝和浅拷贝
|
前端开发
#yyds干货盘点 歌谣学前端之react笔记之学习日历样式的设置
#yyds干货盘点 歌谣学前端之react笔记之学习日历样式的设置
236 0
#yyds干货盘点 歌谣学前端之react笔记之学习日历样式的设置
|
前端开发
#yyds干货盘点 歌谣学前端之react笔记之第一个react项目
#yyds干货盘点 歌谣学前端之react笔记之第一个react项目
232 0
#yyds干货盘点 歌谣学前端之react笔记之第一个react项目
|
前端开发 JavaScript
#yyds干货盘点 歌谣学前端之React中虚拟dom
#yyds干货盘点 歌谣学前端之React中虚拟dom
197 1
|
前端开发
#yyds干货盘点 歌谣学前端之react笔记之学习之类组件
#yyds干货盘点 歌谣学前端之react笔记之学习之类组件
240 0
|
前端开发
#yyds干货盘点 歌谣学前端之react笔记之学习之函数组件
#yyds干货盘点 歌谣学前端之react笔记之学习之函数组件
140 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云网关配置