JS通过原型实现数据深度拷贝，兼容所有类型值

pixle0

已于 2022-10-03 21:39:24 修改

阅读量460

点赞数 1

CC 4.0 BY-SA版权

分类专栏： js 文章标签： javascript 前端

于 2022-10-03 21:34:18 首次发布

本文链接：https://blog.youkuaiyun.com/sd1sd2/article/details/127156349

js 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了一种在JavaScript中实现深拷贝的有效方法。该方法通过在对象原型上增加clone方法来完成，能妥善处理各种数据类型，包括对象、数组、函数等，并能正确复制null和undefined值。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前言

网上有很多深度克隆的例子方法，很多都不是很完美，要嘛遇到null或者undefined会报错，要嘛数组类型有问题，或者函数丢失，更多的是直接定义一个方法去调用，没有直接通过原型实现调用起来来得方便，随手写个记录下

实现代码

       //原型上增加深度克隆方法
		Object.prototype.clone = function() {
			 function isNullOrUndefined(val){
				 return val === null || val === undefined
			 }
			if (Array.isArray(this)) { //数组类型
				return this.map(item => {
					return isNullOrUndefined(item) ? item : item.clone()//null和undefined无原型直接返回
				})

			} else if (Object.prototype.toString.call(this) === '[object Object]') {//对象类型
				let obj = {}
				for (let key in this) {
					if (this.hasOwnProperty(key)) {
						obj[key] =isNullOrUndefined(this[key])  ? this[key] : this[key].clone()
					}
				}
				return obj

			}
			return this.valueOf()//其他类型（基本类型或函数）
		}

调用 object.clone()

	   let obj={
			a:[1,2,null],
			b:undefined,
			c:{
				m:1
			},
			d:function(){}
		}
		let deepCloneObj= obj.clone()
		deepCloneObj.a[1]='test'
		deepCloneObj.c.m='test'
		console.log(deepCloneObj,'deepCloneObj')
		console.log(obj.clone(), 'deepClone')