前端刷题-深浅拷贝

深拷贝

function deepClone(obj) {
  if (obj === null || typeof obj !== "object") {
    return obj;
  }

  if (obj instanceof Date) {
    return new Date(obj);
  }

  if (obj instanceof Array) {
    const cloneArray = [];
    for (let i = 0; i < obj.length; i++) {
      cloneArray[i] = deepClone(obj[i]);
    }
    return cloneArray;
  }

  if (obj instanceof Object) {
    const cloneObj = {};
    for (let key in obj) {
      if (obj.hasOwnProperty(key)) {
        cloneObj[key] = deepClone(obj[key]);
      }
    }
    return cloneObj;
  }
}

在实际开发中通常不会这么使用深拷贝,ES6 中的 JSON.parse(JSON.stringify(obj))也可以用于深拷贝,但有一定的限制比如不能用于复制函数和循环引用

function deepClone2(obj) {
  const cloneObj = JSON.parse(JSON.stringify(obj));
  return cloneObj;
}

验证

const originalObject = {
  name: "John",
  age: 30,
  address: {
    city: "New York",
    country: "USA",
  },
  hobbies: ["reading", "traveling"],
};

const copiedObject = deepClone(originalObject);
console.log(copiedObject);

在这里插入图片描述

浅拷贝

function shallowClone(obj) {
  if (obj === null || typeof obj !== "object") {
    return obj;
  }

  if (obj instanceof Array) {
    const cloneArray = [];
    for (let i = 0; i < obj.length; i++) {
      cloneArray[i] = obj[i];
    }
    return cloneArray;
  }

  if (obj instanceof Object) {
    const cloneObject = {};
    for (let key in obj) {
      if (obj.hasOwnProperty(key)) {
        cloneObject[key] = obj[key];
      }
    }
    return cloneObject;
  }
}

浅拷贝与深拷贝的区别在于,深拷贝是层级式的将原数据完全拷贝成为一份新的数据,浅拷贝仅仅是对数据的第一层进行拷贝。当改变拷贝数据的深层数据时,浅拷贝会影响原数据而深拷贝不会影响原数据。
验证

const originalObject = {
  name: "John",
  age: 30,
  hobbies: ["reading", "traveling"],
};

const copiedObject = shallowClone(originalObject);
console.log(copiedObject);

copiedObject.name = "Alice";
copiedObject.hobbies.push("swimming");

console.log(originalObject);

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/96482.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

六、事务-3.事务四大特性

1、原子性 事务是一组操作&#xff0c;这组操作是不可分割的最小操作单元&#xff0c;这组操作要么全部执行成功&#xff0c;要么全部执行失败。 如&#xff1a;三步转账操作&#xff0c;当中只要有一步操作失败了&#xff0c;整个就失败了。 2、一致性 事务完成时&#xff…

redis--集群

redis集群 Redis 集群是一种用于分布式存储和管理数据的解决方案&#xff0c;它允许将多个 Redis 实例组合成一个单一的逻辑数据库&#xff0c;提供更高的性能、容量和可用性。 redis集群的优点 高可用性&#xff1a; Redis集群使用主从复制和分片技术&#xff0c;使得数据可…

残差网络、Dropout正则化、Batch Normalization浅了解

残差网络&#xff1a; 为什么需要残差网络&#xff1a; 残差网络的目的是为了解决深度神经网络在训练过程中遇到的退化问题&#xff0c;即随着网络层数的增加&#xff0c;训练集的误差反而增大&#xff0c;而不是过拟合。残差网络的优点有以下几点&#xff1a; 残差网络可以…

Rabbitmq消息积压问题如何解决以及如何进行限流

一、增加处理能力 优化系统架构、增加服务器资源、采用负载均衡等手段&#xff0c;以提高系统的处理能力和并发处理能力。通过增加服务器数量或者优化代码&#xff0c;确保系统能够及时处理所有的消息。 二、异步处理 将消息的处理过程设计为异步执行&#xff0c;即接收到消息…

【小吉测评】哔哩哔哩接入AI?!效果如何?

文章目录 &#x1f384;前言⭐申请方式&#x1f3f3;️‍&#x1f308;注意 &#x1f6f8;简介&#x1f354;上手体验&#x1f6f8;进行数学计算&#x1f970;可以写代码吗 &#x1f384;前言 最近人工智能特别火&#xff0c;chatgpt&#xff0c;Claude2&#xff0c;文心一言等…

螺旋矩阵Java

54. 螺旋矩阵 给你一个 m 行 n 列的矩阵 matrix &#xff0c;请按照 顺时针螺旋顺序 &#xff0c;返回矩阵中的所有元素。 示例 1&#xff1a; 输入&#xff1a;matrix [[1,2,3],[4,5,6],[7,8,9]] 输出&#xff1a;[1,2,3,6,9,8,7,4,5 示例 2&#xff1a; 输入&#xff1a;ma…

踏进字节的那一瞬间,我泪目了,这457天的外包经历值了....

一年半吗&#xff1f;我只记得437个日日夜夜 没有绝对的天才&#xff0c;只有持续不断的付出。对于我们每一个平凡人来说&#xff0c;改变命运只能依靠努力幸运&#xff0c;但如果你不够幸运&#xff0c;那就只能拉高努力的占比。 2021年8月&#xff0c;我有幸成为了字节跳动…

FBX SDK 开发环境配置 visual studio 2022

FBX | Adaptable File Formats for 3D Animation Software | Autodesk. 下载windows的sdk并安装. 创建一个c console 工程 设置include目录 添加预处理宏 FBX_SHARED1 添加fbx sdk lib 目录 添加依赖lib : libfbxsdk-md.lib libxml2-md.lib zlib-md.lib 配置完毕.

【LeetCode】剑指 Offer <二刷>(1)

目录 前言&#xff1a; 题目&#xff1a;剑指 Offer 03. 数组中重复的数字 - 力扣&#xff08;LeetCode&#xff09; 题目的接口&#xff1a; 解题思路&#xff1a; 代码&#xff1a; 过啦&#xff01;&#xff01;&#xff01; 写在最后&#xff1a; 前言&#xff1a; …

【Python】利用python-docx生成word版本学生花名册

如图&#xff0c;可以用python创建word文档&#xff0c;生成一个学生的花名册。生成的过程&#xff1a;先下载第三方依赖包&#xff0c;安装依赖包&#xff0c;然后引入依赖文件&#xff0c;创建docx文件&#xff0c;添加标题&#xff0c;创建表头&#xff0c;创建表格正文&…

人员着装识别算法 yolo

人员着装识别系统通过yolo网络模型识别算法&#xff0c;人员着装识别系统算法通过现场安装的摄像头识别工厂人员及工地人员是否按要求穿戴着装&#xff0c;实时监测人员的着装情况&#xff0c;并进行相关预警。目标检测架构分为两种&#xff0c;一种是two-stage&#xff0c;一种…

无涯教程-Android - 环境设置

您可以从Oracle的Java网站下载最新版本的Java JDK-Java SE下载&#xff0c;您将在下载的文件中找到有关安装JDK的说明,按照给定的说明安装和配置安装程序。最后,将PATH和JAVA_HOME环境变量设置为引用包含 java 和 javac 的目录,通常分别是java_install_dir/bin和java_install_d…

vue2 支持图片放大

添加 :preview-src-list属性 <el-imagev-for"item in specialData.urls":src"item":key"item.index":preview-src-list[item]class"pictrue"/>

【Python】从入门到上头—Python基础(2)

文章目录 一.基础语法1.编码2.标识符3.保留字4.注释5.行与缩进6.多行语句7.数字(Number)类型8.字符串(String)9.空行10.等待用户输入11.同一行显示多条语句12.多个语句构成代码组13.print 输出14.import 与 from...import 二.基本数据类型1.变量和赋值2.多个变量赋值3.标准数据…

对 K8s Pod 安全有多少认识?

写在前面 简单整理&#xff0c;博文内容涉及&#xff1a; PSP 的由来PSA 的发展PSA 使用认知 不涉及使用&#xff0c;用于了解 Pod 安全 API 资源理解不足小伙伴帮忙指正 对每个人而言&#xff0c;真正的职责只有一个&#xff1a;找到自我。然后在心中坚守其一生&#xff0c;全…

机器学习概述

文章目录 机器学习应用背景数据挖掘个性化定制替代人力的软件应用 什么是机器学习示例 机器学习系统举例IBM Watson DeepQAIBM Watson技术需求相关技术 -- DeepQA 通用机器学习系统设计设计一个学习系统 1系统设计1 —— 用于训练的经验 设计学习系统 2系统设计2 —— 到底应该…

胜券汇:底部显现 三大因素有望助推股市短期内探底回升

胜券汇以为&#xff0c;权益商场的底部特征现已开始闪现&#xff0c;估值触底、危险偏好反弹、盈余逐渐修正三大要素有望助推股市短期内探底上升。不过&#xff0c;中长期而言&#xff0c;A股的核心矛盾在于经济复苏的斜率&#xff0c;从当时经济形势看&#xff0c;方针仍有必要…

vue数组对象中按某一字段排序

给下列数组字段中的month排序 第一步&#xff1a;methods中写一个方法如下&#xff1a; sortBy(attr, rev) {//第二个参数没有传递 默认升序排列if(rev undefined) {rev 1;} else {rev (rev) ? 1 : -1;}return function(a, b) {a a[attr];b b[attr];if(a < b) {retu…

四信重磅推出5G RedCap AIoT摄像机 RedCap轻量级5G终端新品首发!

6月6日&#xff0c;四信受邀出席移动物联网高质量发展论坛&#xff0c;并在移动物联网新产品发布环节隆重推出5G RedCap AIoT摄像机&#xff0c;再次抓紧需求先机&#xff0c;为行业用户创造无限可能&#xff01; 两大应用场景 助推RedCap走深向实 火遍全网络的RedCap应用场景可…

F5负载均衡器参与的Kubernetes架构选项介绍

F5负载均衡器在业内有着很高的知名度&#xff0c;因为它不仅是F5的代表作&#xff0c;负载均衡&#xff08;Load Balance&#xff09;这一词汇正是由F5发明并引入国内的。当前&#xff0c;F5的能力不断拓展&#xff0c;从早期聚焦F5负载均衡器到现在的分布式云应用架构&#xf…