前端数据拷贝(浅拷贝、深拷贝)

浅拷贝

1 直接赋值

2 扩展运算符(...)

3 abject.assign()

Object.assign({}, obj);

4 slice和concat

slice 截取数组

concat 拼接数组

深拷贝

1 JSON.parse(JSON.stringify(待拷贝对象))

2 使用第三方库 Lodash

javascript 复制代码
const _ = require('lodash');

let obj = {
    name: 'demo',
    age: 26
}

let obj2 = _.cloneDeep(obj);
obj2.name = "demo_new";

console.log(obj); // {name: "demo", age: 26}
console.log(obj2); // {name: "demo_new", age: 26}

3 手写一个深拷贝

javascript 复制代码
function deepClone (obj) {
    if (typeof obj !== 'object' || obj == null) {
        return obj;
    }
    
    let deepCloneObj = Array.isArray(obj) ? [] : {}
    
    for (let key in obj) {
        if (obj.hasOwnProperty(key)) {
            deepCloneObj[key] = deepClone(obj[key]);
        }
    }
    
    return deepCloneObj;
}
相关推荐
天疆说12 分钟前
Zotero Connector 在 Edge 里找不到桌面 Zotero(Linux / Zotero 9.0.6 / Edge 150)
linux·前端·edge
李伟_Li慢慢2 小时前
02-从硬件说起WebGL
前端·three.js
kyriewen3 小时前
看了微软几万人用AI编程的数据——效率涨24%的代价没人提
前端·ai编程·claude
2601_963771373 小时前
How to Scale Your WordPress Store Traffic in 2026
前端·php·plugin
亿元程序员3 小时前
老板说我的3D箭头游戏用来做试玩太普通了,没人想玩,让我变点花样...
前端
李伟_Li慢慢3 小时前
01-threejs架构原理-课程简介
前端·three.js
_瑞5 小时前
深入理解 iOS 渲染原理
前端·ios
IT_陈寒5 小时前
SpringBoot自动配置失灵?你可能忘了这个关键注解
前端·人工智能·后端
iCOD3R5 小时前
Skill - kill-ai-slop 解决“AI 味”样式
前端·css·ai编程
皮音6 小时前
Skill 在项目中的实践 —— 从 Agent 困境到 Skill 工程化
前端