当前位置: 首页 > article >正文

vue深拷贝:1、使用JSON.parse()和JSON.stringify();2、使用Lodash库;3、使用深拷贝函数(采用递归的方式)

文章目录

  • 引言
    • 三种方法的优缺点
    • 在Vue中,实现数组的深拷贝
  • I JSON.stringify和 JSON.parse的小技巧
    • 深拷贝步骤
    • 缺点:
    • 案例1:向后端请求路由数据
    • 案例2: 表单数据处理时复制用户输入的数据
  • II 使用Lodash库
    • 步骤
    • 适用于复杂数据结构和需要处理循环引用的场景
  • III 自定义的深拷贝函数(采用递归的方式)
    • 示例代码
    • 适用于需要特殊处理的场景

引言

深拷贝是指创建一个完全独立的副本,而不仅仅是引用原始数组的副本。
在Vue中,有几种方法可以实现对象的深拷贝:

  • 使用JSON.parse()和JSON.stringify()
  • 使用Lodash库
  • 使用深拷贝函数

三种方法的优缺点

方法优点缺点
JSON.parse()和JSON.stringify()简单易用,适合大多数情况无法拷贝函数、undefinedSymbol,不支持循环引用
Lodash库功能强大,处理复杂结构需要额外引入库
自定义深拷贝函数灵活性高,可定制编写和维护成本高,代码复杂
  • 对于简单的场景,使用 JSON.parse() 和 JSON.stringify() 是一种快速便捷的方法;
  • 对于复杂的场景,Lodash 库提供了强大的 cloneDeep 方法;
  • 自定义深拷贝函数则适用于需要

相关文章:

vue深拷贝:1、使用JSON.parse()和JSON.stringify();2、使用Lodash库;3、使用深拷贝函数(采用递归的方式)

文章目录 引言三种方法的优缺点在Vue中,实现数组的深拷贝I JSON.stringify和 JSON.parse的小技巧深拷贝步骤缺点:案例1:向后端请求路由数据案例2: 表单数据处理时复制用户输入的数据II 使用Lodash库步骤适用于复杂数据结构和需要处理循环引用的场景III 自定义的深拷贝函数(…...

九、数据治理架构流程

一、总体结构 《数据治理架构流程图》(Data Governance Architecture Flowchart) 水平结构:流程图采用水平组织,显示从数据源到数据应用的进程。 垂直结构:每个水平部分进一步划分为垂直列,代表数据治理的…...

【数据结构】 最大最小堆实现优先队列 python

堆的定义 堆(Heap)是一种特殊的完全二叉树结构,通常分为最大堆和最小堆两种类型。 在最大堆中,父节点的值总是大于或等于其子节点的值; 而在最小堆中,父节点的值总是小于或等于其子节点的值。 堆常用于实…...

51c自动驾驶~合集52

我自己的原文哦~ https://blog.51cto.com/whaosoft/13383340 #世界模型如何推演未来的千万种可能 驾驶世界模型(DWM),专注于预测驾驶过程中的场景演变,已经成为追求自动驾驶的一种有前景的范式。这些方法使自动驾驶系统能够更…...

服务 ‘Sql Server VSS writer‘ (SQLWriter) 在安装 LocalDB 时无法启动

安装Microsoft Visual C 2015-2019 Redistributable (x64)...

【我的 PWN 学习手札】House of Husk

House of Husk House of Husk是利用格式化输出函数如printf、vprintf在打印输出时,会解析格式化字符如%x、%lld从而调用不同的格式化打印方法(函数)。同时C语言还提供了注册自定义格式化字符的方法。注册自定义格式化字符串输出方法&#xf…...

Nmap使用指南

Nmap使用指南 Nmap (网络映射器) 是一款强大的应用网络扫描和安全核查工具,适合于网络管理和安全专家。本文将介绍Nmap的基本使用方法,包括基本命令和常用功能。 1. 基本使用方式 Nmap的基本命令格式如下: nmap [选项] 目标地址目标地址 可…...

傅里叶分析

傅里叶分析之掐死教程(完整版)更新于2014.06.06 要让读者在不看任何数学公式的情况下理解傅里叶分析。 傅里叶分析不仅仅是一个数学工具,更是一种可以彻底颠覆一个人以前世界观的思维模式。但不幸的是,傅里叶分析的公式看起来太复…...

从零开始用react + tailwindcss + express + mongodb实现一个聊天程序(五) 实现登录功能

1.登录页面 完善登录页面 和注册差不多 直接copy signUpPage 内容 再稍微修改下 import { useState } from "react"; import { useAuthStore } from "../store/useAuthStore"; import { MessageSquare,Mail,Lock,Eye, EyeOff,Loader2} from "lucide…...

基于多层感知机(MLP)实现MNIST手写体识别

实现步骤 下载数据集处理好数据集确定好模型(初始化模型参数等等)确定优化函数(损失函数也称为目标函数)和优化方法(一般选用随机梯度下降 SDG )进行模型的训练进行模型的评估 import torch import torch…...

如何使用useContext进行全局状态管理?

在 React 中,使用 useContext 进行全局状态管理是一种有效的方法,尤其在需要在多个组件之间共享状态时。useContext 允许你在组件树中传递数据,而无需通过每个组件的 props 逐层传递。以下是关于如何使用 useContext 进行全局状态管理的详细指…...

【机器学习】Logistic回归#1基于Scikit-Learn的简单Logistic回归

主要参考学习资料: 《机器学习算法的数学解析与Python实现》莫凡 著 前置知识:线性代数-Python 目录 问题背景数学模型类别表示Logistic函数假设函数损失函数训练步骤 代码实现特点 问题背景 分类问题是一类预测非连续(离散)值的…...

8.Dashboard的导入导出

分享自己的Dashboard 1. 在Dashboard settings中选择 JSON Model 2. 导入 后续请参考第三篇导入光放Dashboard,相近...

next.js-学习2

next.js-学习2 1. https://nextjs.org/learn/dashboard-app/getting-started2. 模拟的数据3. 添加样式4. 字体,图片5. 创建布局和页面页面导航 1. https://nextjs.org/learn/dashboard-app/getting-started /app: Contains all the routes, components, and logic …...

视频推拉流EasyDSS直播点播平台授权激活码无效,报错400的原因是什么?

在当今数字化浪潮中,视频推拉流 EasyDSS 视频直播点播平台宛如一颗璀璨的明珠,汇聚了视频直播、点播、转码、精细管理、录像、高效检索以及时移回看等一系列强大功能于一身,全方位构建起音视频服务生态。它既能助力音视频采集,精准…...

【论文详解】Transformer 论文《Attention Is All You Need》能够并行计算的原因

文章目录 前言一、传统 RNN/CNN 存在的串行计算问题二、Transformer 如何实现并行计算?三、Transformer 的 Encoder 和 Decoder 如何并行四、结论 前言 亲爱的家人们,创作很不容易,若对您有帮助的话,请点赞收藏加关注哦&#xff…...

Fisher信息矩阵(Fisher Information Matrix,简称FIM)

Fisher信息矩阵简介 Fisher信息矩阵(Fisher Information Matrix,简称FIM)是统计学和信息理论中的一个重要概念,广泛应用于参数估计、统计推断和机器学习领域。它以统计学家罗纳德费希尔(Ronald Fisher)的名…...

基础设施安全(Infrastructure Security)是什么?

基础设施安全(Infrastructure Security)指的是保护IT基础设施(包括物理和云端的服务器、网络设备、存储、数据库等)免受网络攻击、数据泄露、未授权访问、系统故障等威胁的各种安全措施和技术。 1. 基础设施安全的主要组成部分 &…...

[杂学笔记]OSI七层模型作用、HTTP协议中的各种方法、HTTP的头部字段、TLS握手、指针与引用的使用场景、零拷贝技术

1.OSI七层模型作用 物理层:负责光电信号的传输,以及将光电信号转化为二进制数据数据链路层:主要负责将收到的二进制数据进一步的封装为数据帧报文。同时因为数据在网络中传递的时候,每一个主机都能够收到报文数据,该层…...

Framework层JNI侧Binder

目录 一,Binder JNI在整个系统的位置 1.1 小结 二,代码分析 2.1 BBinder创建 2.2 Bpinder是在查找服务时候创建的 2.3 JNI实现 2.4 JNI层android_os_BinderProxy_transact 2.5 BPProxy实现 2)调用IPCThreadState发送数据到Binder驱动…...

Windows 图形显示驱动开发-WDDM 3.2-自动显示切换(九)

面板驱动程序 显示器驱动程序是根据从 EDID 生成的即插即用 (PnP) 硬件 ID 加载的。 由于 EDID 保持不变,当任何一个 GPU 控制内部面板时,都会加载面板驱动程序。 这两个驱动程序将显示相同的亮度功能。 因此,加载应该不会造成任何问题&…...

Excel大文件拆分

import pandas as pddef split_excel_file(input_file, output_prefix, num_parts10):# 读取Excel文件df pd.read_excel(input_file)# 计算每部分的行数total_rows len(df)rows_per_part total_rows // num_partsremaining_rows total_rows % num_partsstart_row 0for i i…...

OpenCV计算摄影学(7)HDR成像之多帧图像对齐的类cv::AlignMTB

操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 该算法将图像转换为‌中值阈值位图‌(Median Threshold Bitmap,MTB): 1.位图生成‌:…...

JWT+redis实现三大令牌管理方案深度解析

三种令牌管理方案对比与评估 1. 仅续期Redis(不生成新令牌) 实现原理 通过延长Redis中的令牌有效期维持会话,JWT本身不包含动态过期时间。 优点 ✅ 低开销:无需生成新令牌,减少JWT签名计算成本。 ✅ 简单实现&#x…...

北京大学DeepSeek提示词工程与落地场景(PDF无套路免费下载)

近年来,大模型技术飞速发展,但许多用户发现:即使使用同一款 AI 工具,效果也可能天差地别——有人能用 AI 快速生成精准方案,有人却只能得到笼统回答。这背后的关键差异,在于提示词工程的应用能力。 北京大…...

Axure PR 9 中继器 03 翻页控制

大家好,我是大明同学。 接着上期的内容,这期内容,我们来了解一下Axure中继器图表翻页控制。 预览地址:https://pvie5g.axshare.com 翻页控制 1.打开上期RP 文件,在元件库中拖入一个矩形,宽值根据业务实际…...

IO流(师从韩顺平)

文章目录 文件什么是文件文件流 常用的文件操作创建文件对象相关构造器和方法应用案例 获取文件的相关信息应用案例 目录的操作和文件删除应用案例 IO 流原理及流的分类Java IO 流原理IO流的分类 IO 流体系图-常用的类IO 流体系图(重要!!&…...

基于Javase的停车场收费管理系统

基于Javase的停车场收费管理系统 停车场管理系统开发文档 项目概述 1.1 项目背景 随着现代化城市的不断发展,车辆数量不断增加,停车难问题也日益突出。为了更好地管理停车场资 源,提升停车效率,需要一个基于Java SE的停车场管理…...

Exoplayer(MediaX)实现音频变调和变速播放

在K歌或录音类应用中变调是个常见需求,比如需要播出萝莉音/大叔音等。变速播放在影视播放类应用中普遍存在,在传统播放器Mediaplayer中这两个功能都比较难以实现,特别在低版本SDK中,而Exoplayer作为google官方推出的Mediaplayer替…...

Spring Boot集成Jetty、Tomcat或Undertow及支持HTTP/2协议

目录 一、常用Web服务器 1、Tomcat 2、Jetty 3、Undertow 二、什么是HTTP/2协议 1、定义 2、特性 3、优点 4、与HTTP/1.1的区别 三、集成Web服务器并开启HTTP/2协议 1、生成证书 2、新建springboot项目 3、集成Web服务器 3.1 集成Tomcat 3.2 集成Jetty 3.3 集成…...