首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

JS拷贝几种实现方法

1、使用递归(循环)的方式实现拷贝 //使用递归的方式实现数组、对象的拷贝 function deepClone1(obj) { //判断拷贝的要进行拷贝的是数组还是对象,是数组的话进行数组拷贝...,对象的话进行对象拷贝 //进行拷贝的不能为空,并且是对象或者是 if (obj && typeof obj === "object") { var objClone = Array.isArray...objClone[key] = obj[key]; } } } return objClone; } return obj; } 2、lodash函数库实现拷贝...lodash很热门的函数库,提供了 lodash.cloneDeep()实现拷贝 3、通过 JSON 对象实现拷贝 //通过js的内置对象JSON来进行数组对象的拷贝 function deepClone2...(并不深,一级拷贝) 当对象中只有一级属性,没有二级属性的时候,此方法为拷贝,但是对象中有对象的时候,此方法,在二级属性以后就是浅拷贝

1.5K20
您找到你想要的搜索结果了吗?
是的
没有找到

js拷贝拷贝

中,数据类型分为基本数据类型和引用数据类型两种,对于基本数据类型来说,它的值直接存储在栈内存中, // 而对于引用类型来说,它在栈内存中仅仅存储了一个引用,而真正的数据存储在堆内存中// 当基本类型实现拷贝...// 当复杂类型实现拷贝,新对象与旧对象仍然同时指向堆内存的同一属性,互不独立,相互影响。..., // 也就是说当我们创建新数组newArr时,赋予newArr的是arr在栈中的地址(指针), // 其实仍与旧数组arr共享同一个内存,所以修改新数组newArr后,旧数组arr也会被修改// 拷贝...// 它可以将复杂类型的数据相互独立出来,互不影响 // 拷贝不会拷贝引用类型的引用,而是将引用类型的值全部拷贝一份,形成一个新的引用类型, // 这样就不会发生引用错乱的问题,使得我们可以多次使用同样的数据...2、 function deepClone(target) { // 定义一个变量 let result; // 如果当前需要拷贝的是一个对象的话更多内容请见原文,原文转载自:http://www.mark-to-win.com

2.5K20

JS拷贝方法

记一下js拷贝的几种方法 使用递归 通过JSON对象 通过jQuery的extend方法 Object.assign() lodash函数 使用递归 //使用递归的方式实现数组、对象的拷贝 function...deepClone(obj) { //判断拷贝的要进行拷贝的是数组还是对象,是数组的话进行数组拷贝,对象的话进行对象拷贝 var objClone = Array.isArray(obj)...objClone[key] = obj[key]; } } } } return objClone; } 通过JSON对象 //通过js...(_obj); return objClone; } tip: * 无法实现对对象中方法的拷贝 通过jQuery的extend方法 var array = [1,2,3,4]; var newArray...= $.extend(true,[],array); Object.assign() 对象中只有一级属性,没有二级属性的时候,为拷贝 对象中有对象的时候,在二级属性以后就是浅拷贝 lodash函数

2.7K10

js库 - 浅拷贝 & 拷贝

然后面试中经常会问、业务中也经常会遇到的问题就是深浅拷贝的问题了。 栈内存中简单数据类型直接拷贝就能得到一个副本,但是复杂数据类型的拷贝如果也想得到一个副本,就需要拷贝了。...拷贝 具体拷贝就是要理解了复杂类型拷贝的缺点,然后再进行弥补。 既然想要复杂类型也像简单类型那样拷贝一个新数据的话,就不单单是拷贝地址了。...但其实在拷贝阶段,直接将其放到object形式处理了。...然后就是拷贝的代码: deepClone: function (origin) { /* * @Author: guojufeng@ * @Date: 2018-10-30 20...如果循环过程中,数组中嵌套复杂类型,再次递归调用拷贝方法。 对于对象,新建一个对象,然后for in遍历拷贝非原型值。如果循环过程中,对象中嵌套复杂类型,再次递归调用拷贝方法。

2K30

js拷贝与浅拷贝

1.区别: 拷贝和浅拷贝的使用场景是在复杂对象里,即对象的属性还是对象; 浅拷贝是指只复制一层对象,当对象的属性是引用类型时,实质复制的是其引用,当引用指向的值改变时也会跟着变化;拷贝是指复制对象的所有层级...2.拷贝实现 Json序列化与反序列化: function deepClone(obj){ let _obj = JSON.stringify(obj), objClone =...不可枚举的属性会被忽略 对于引用类型:object,array,date,regexp,function,err,只能拷贝对象和数组,对于其他种类的对象,会失真。...最佳实现:(类似lodash的cloneDeep) function isArray(val) { return Object.prototype.toString.call(val) ===...; } else { obj[property] = obj2[property]; } } return obj; } 3.浅拷贝实现

1.3K30

JS 拷贝与浅拷贝

其实在工作写代码和面试中,会经常碰到这两个概念:拷贝,浅拷贝。但今天的重点是拷贝。 下面我将简单介绍下什么是拷贝,浅拷贝?...拷贝是将一个Object对象的内容完全拷贝一份给新对象。修改原对象的属性或者属性值,都不会影响新对象。原对象和新对象是完全独立的,互不影响。...3.观察obj3和obj1,可以知道利用JSON.stringify、JSON.parse实现拷贝,是可以实现拷贝的。 我们再给对象加多点属性,比如加个函数。...所以通过JSON.parse和JSON.stringify实现拷贝不完美。 那么我分享下我自己写的一个对象拷贝的方法,这就是我个人比较常用的方案了。...obj88 Plus"; obj9.introduce(); obj9.brothers[0].introduce(); 运行结果: [deepCopy.png] 可以看到,我们的deepCopy函数是能够实现拷贝

2.1K10

js拷贝拷贝

如果有引用类型,那么存在被篡改的风险,更应该使用拷贝拷贝方法 1、手撸一个浅拷贝函数 1function shallowClone(obj) { 2 const newObj = {};...完全拷贝了基本类型和引用类型内部所有数据,叫拷贝 拷贝方法 1、JSON暴力转换 1const obj2=JSON.parse(JSON.stringify(obj1)); 但是这种方式存在弊端,...new Date(obj); 4 if (obj instanceof RegExp) return new RegExp(obj); 5 // 可能是对象或者普通的值 如果是函数的话是不需要拷贝...== "object") return obj; 7 // 是对象的话就要进行拷贝 8 if (hash.get(obj)) return hash.get(obj); 9 let cloneObj...hash.set(obj, cloneObj); 12 for (let key in obj) { 13 if (obj.hasOwnProperty(key)) { 14 // 实现一个递归拷贝

1.1K10

js拷贝和浅拷贝

说到拷贝与浅拷贝,为什么会有这两种概念呢,根本原因就在于js的两种数据类型:基本数据类型和引用数据类型,两种数据类型存储方式不同。...JavaScript 中变量的拷贝 js 中的拷贝区分为「浅拷贝」与「拷贝」。 浅拷贝拷贝只会将对象的各个属性进行依次复制,并不会进行递归复制,也就是说只会赋值目标对象的第一层属性。...拷贝 拷贝不同于浅拷贝,它不只拷贝目标对象的第一层属性,而是递归拷贝目标对象的所有属性。...通过循环来实现拷贝 function copy(arr){ var obj=arr.constructor==Array?...__proto__ = Object.create(null); for (let key in target) { // 相关操作 } 文章参考链接:js深浅拷贝知多少

1.4K20

拷贝、浅拷贝实现

拷贝是在引用方面不同,拷贝就是创建一个新的和原始字段的内容相同的字段,是两个一样大的数据段,所以两者的引用是不同的,之后的新对象中的引用型字段发生改变,不会引起原始对象中的字段发生改变。...所以在对“含有指针成员的对象”进行拷贝时,必须要自己定义拷贝构造函数,使拷贝构造后的对象指针成员有自己的内存空间,即进行拷贝,避免内存泄漏。...拷贝和浅拷贝是针对复杂数据类型来说的,浅拷贝拷贝一层,而拷贝是层层拷贝拷贝 拷贝复制变量值,对于非基本类型的变量,则递归至基本类型变量后,再复制。...拷贝后的对象与原来的对象是完全隔离的,互不影响, 对一个对象的修改并不会影响另一个对象。...使 用 for in 、 Object.assign 、 扩 展 运 算 符 … Array.prototype.slice()、 Array.prototype.concat() 、递归等递归函数实现拷贝

74430

实现拷贝拷贝

实现拷贝拷贝 Js包含基本数据类型与引用数据类型两种不同的数据类型的值,拷贝与浅拷贝的概念只存在于引用数据类型。...原生方法实现 原生方法实现拷贝,可以使用{...obj}与Object.assign({}, obj)等方式,{...obj}主要是使用了Spread操作符将对象表达式展开构造字面量对象的方式实现拷贝...关于Object.assign是浅拷贝还是对于第一层是拷贝之后是浅拷贝的说法,主要取决于如何理解浅拷贝拷贝的概念,假如同本文一样认为只有引用类型才有浅拷贝拷贝的概念的话,那么Object.assign...就是浅拷贝;假如认为对于基本数据类型也有浅拷贝拷贝的概念的话,那么如上文所述对于基本数据类型的拷贝可以理解为按值拷贝,那么关于Object.assign第一层是拷贝,第二层及以后是浅拷贝的说法也是没有问题的...原生方法实现拷贝,主要是使用JSON.parse()与JSON.stringify(),首先将对象序列化为JSON字符串,再将JSON字符串反序列化为对象,使用这种方式效率比较高,但是会有一些问题,对于循环引用的对象无法实现拷贝

61320

JS专栏】JS对象的浅拷贝拷贝

1. object.assign object.assign 是 ES6 中 Object 的一个方法,该方法可以用于JS 对象的合并等多个用途,其中一个用途就是可以进行浅拷贝。...如果存在对象的嵌套,那么浅拷贝将无能为力。因此拷贝就是为了解决这个问题而生的,它能解决多层对象嵌套问题,彻底实现拷贝。...拷贝则不同,对于复杂引用数据类型,其在堆内存中完全开辟了一块内存地址,并将原有的对象完全复制过来存放。 拷贝后的对象与原始对象是相互独立、不受影响的,彻底实现了内存上的分离。...总的来说,拷贝的原理可以总结如下: 将原对象从内存中完整地拷贝出来一份给新对象,并从堆内存中开辟一个全新的空间存放新对象,且新对象的修改并不会改变原对象,二者实现真正的分离。 1....实现拷贝方法 下面是一个实现 deepClone 函数封装的例子,有几点需要注意下。

2.3K40

js 数组对象拷贝

以上是背景,所以我就对浅拷贝拷贝进行了总结: 浅拷贝 什么是浅拷贝:两者是指向一个对象。 对象的浅拷贝 1、对象的直接遍历赋值。...数组的浅拷贝 (两者指向不同的对象,但是只能拷贝一层) array.concat(); array.slice(0); 如果该元素是个对象引用 (不是实际的对象),slice 会拷贝这个对象引用到新的数组里...拷贝 (下面说的拷贝是基本对象的拷贝,不考虑对象的复杂属性,比如set,get,Function等) 1、最简单的方式 JSON.parse(JSON.stringify(Obj)) 这种方法使用较为简单...,可以满足基本的拷贝需求,而且能够处理JSON格式能表示的所有数据类型,但是对于正则表达式类型、函数类型等无法进行拷贝(而且会直接丢失相应的值)。...2、jQuery拷贝 var copiedObject = $.extend(true, {}, originalObject) 3、手动写递归方式 var array = [ { number

4.6K30
领券