拷贝

在中我们将了js继承的几种方式。这一节我们来讲一下，js对象的拷贝。为什么会出现拷贝。我们来看一个列子，您大致就明白了。

var a = {
   b:1}var b = aa.b =2console.info(b.b) //2复制代码

我们可以看到，两个对象是同一个内存地址，我们改变了a.b然而我们的b.b被动的改变了。所以这时候出现了一个东西叫对象的拷贝。此时我们又要引出两个概念：浅拷贝，深拷贝

浅拷贝

顾名思义，浅拷贝是说只是拷贝表层，并不会深入的拷贝对象。换句话说一个对象，它只会拷贝一层，而不会拷贝对象中的子对象。让我们看下几种浅拷贝的实现方式。

对象

对象的拷贝

遍历实现浅拷贝

var obj1 ={	a:1}var obj2 = {	b:2};function extendCopy(p,s) {	var c = {};	for (var i in p) { 		c[i] = p[i];	}	for (var j in s) { 		c[j] = s[j];	}	return c;}var newObj = extendCopy(obj1,obj2);console.info(newObj); // {a: 1, b: 2}复制代码

es6中Object.assign实现浅拷贝

// 对象浅拷贝， 复制所有可枚举属性const obj1 = {
   a: 1};const obj2 = {
   b: 2};// copy obj1 and obj2 to a new obj;const newObj = Object.assign({}, obj1, obj2)console.log(newObj)  {a: 1, b: 2}复制代码

es6中结构赋值实现浅拷贝

const obj1 = {
   a: 1, b: 2};// obj2 equal obj1const obj2 = {...obj1};console.log(obj2) // {a: 1, b: 2}复制代码

数组

数组的拷贝。

遍历拷贝。

const arr = [1,2,3];let newarr = [];arr.map((data)=>{	newarr.push(data)});console.log(newarr); //[1,2,3]复制代码

Array.from(要复制的数组);

const arr=[1,2,3];const newarr =Array.from(arr);console.info(newarr); //[1,23]复制代码

...结构赋值

const arr=[1,2,3];const newarr=[...arr];console.info(newarr); //[1,2,3]复制代码

深拷贝

好了我们大概已经知道几种浅拷贝的方式和方法。下面我们来介绍下复杂的数据怎么办，很简单深拷贝。目前深拷贝有很多实现方式，比如lodash啊，jq啊，还有原生的js，我们这里大概枚举一些常用的。

Underscore库 _.clone()

var x = {    a: 1,    b: { z: 0 }};var y = _.clone(x);复制代码

jQuery —— $.extend()

var x = {    a: 1,    b: { f: { g: 1 } },    c: [ 1, 2, 3 ]};var y = $.extend({}, x),          //shallow copy    z = $.extend(true, {}, x);    //deep copy复制代码

lodash _.cloneDeep(value)

var objA = { "name": "colin" };var objB = _.cloneDeep(objA);复制代码

原生js字符串

var obj = {
   "a":1,"b":2}var newObj = JSON.parse((JSON.stringify(obj)))复制代码

自己来封装一个diy

var cloneObj = function(obj){    var str, newobj = obj.constructor === Array ? [] : {};    if(typeof obj !== 'object'){        return;    } else if(window.JSON){        newobj = JSON.parse(JSON.stringify(obj));    } else {        for(var i in obj){            newobj[i] = typeof obj[i] === 'object' ?             cloneObj(obj[i]) : obj[i];         }    }    return newobj;};复制代码

结语

好了，今天的拷贝内容终于完结了，记录代码记录知识，本博客就是快准狠，直接上代码片段，希望喜欢的朋友给点支持多多转发，不说了，抽烟去了。