一、数组的深浅拷贝

<body>
<script type="text/javascript">
var arr = ["One","Two","Three"];
var arrto = arr;
arrto[1] = "test";
console.log(arr);//["One","test","Three"]
</script>
</body>

像上面的这种直接赋值的方式就是浅拷贝，很多时候，这样并不是我们想要得到的结果，其实我们想要的是arr的值不变，

<body>
<script type="text/javascript">
var arr = ["One","Two","Three"];
var arrtooo = arr.concat();
arrtooo[1] = "set Map To";
console.log(arr);//["One","Two","Three"]
console.log(arrtooo);//["One","set Map To","Three"]
</script>
</body>

实现深拷贝 js的concat方法

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。

语法

arrayObject.concat(arrayX,arrayX,......,arrayX)

说明

返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。

<body>
<script type="text/javascript">
var arr = ["One","Two","Three"];
var arrtoo = arr.slice(0);
console.log(arrtoo);//["One","Two","Three"]
arrtoo[1] = "set Map";
console.log(arr);//["One","Two","Three"]
console.log(arrtoo);//["One","set Map","Three"]
</script>
</body>

js的slice函数

对于array对象的slice函数，

返回一个数组的一段。（仍为数组）

arrayObj.slice(start, [end])

参数

arrayObj

必选项。一个 Array 对象。

start

必选项。arrayObj 中所指定的部分的开始元素是从零开始计算的下标。

end

可选项。arrayObj 中所指定的部分的结束元素是从零开始计算的下标。

说明

slice 方法返回一个 Array 对象，其中包含了 arrayObj 的指定部分。

slice 方法一直复制到 end 所指定的元素，但是不包括该元素。如果 start 为负，将它作为 length + start处理，此处 length 为数组的长度。如果 end 为负，就将它作为 length + end 处理，此处 length 为数组的长度。如果省略 end ，那么 slice 方法将一直复制到 arrayObj 的结尾。如果 end 出现在 start 之前，不复制任何元素到新数组中。

二、对象的深浅拷贝

<body>
<script type="text/javascript">
var a={name:'yy',age:26};
var b=new Object(); `
b.name=a.name;
b.age=a.age;
a.name='xx';
console.log(b);//Object { name="yy", age=26}
console.log(a);//Object { name="xx", age=26}
</script>
</body>

<body>
<script type="text/javascript">
var a={name:'yy',age:26}
var deepCopy= function(source) {
var result={};
for (var key in source) {
console.log(key);// name age
result[key] = typeof source[key]==='object'? deepCoyp(source[key]): source[key];
}
return result;
}
console.log(deepCopy(a));//{name:'yy',age:26}
</script>
</body>

就是把对象的属性遍历一遍，赋给一个新的对象。

js深浅复制的更多相关文章

  1. JavaScript的深浅复制

    JavaScript的深浅复制 为什么有深复制.浅复制? JavaScript中有两种数据类型,基本数据类型如undefined.null.boolean.number.string,另一类是Obje ...

  2. 【转】js实现复制到剪贴板功能，兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  3. 纯js实现复制到剪贴板功能

    在网页上复制文本到剪切板,一般是使用JS+Flash结合的方法,网上有很多相关文章介绍.随着 HTML5 技术的发展,Flash 已经在很多场合不适用了,甚至被屏蔽.本文介绍的一款JS插件,实现了纯J ...

  4. 【原】js实现复制到剪贴板功能，兼容所有浏览器

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  5. 详谈OC(object-c)深浅复制/拷贝-什么情况下用retain和copy

    读前小提示:对于深浅复制有一个清楚的了解,对于学习oc的朋友来说,至关重要.那么首先,我们要明白深浅复制是如何定义的呢.这里为了便于朋友们理解,定义如下. 浅 复 制:在复制操作时,对于被复制的对象的 ...

  6. JS实现复制网页内容自动加入版权内容代码和原文链接

    JS实现复制网页内容自动加入版权内容代码和原文链接 实现代码:在body内放入如下代码即可: <script type="text/javascript"> var S ...

  7. 黄聪：JS实现复制到剪贴板功能，兼容所有浏览器（转）

    两天前听了一个H5的分享,会议上有一句话,非常有感触:不是你不能,而是你对自己的要求太低.很简单的一句话,相信很多事情不是大家做不到,真的是对自己的要求太低,如果对自己要求多一点,那么你取得的进步可能 ...

  8. OC－深浅复制

    [OC学习-26]对象的浅拷贝和深拷贝——关键在于属性是否可被拷贝 对象的拷贝分为浅拷贝和深拷贝, 浅拷贝就是只拷贝对象,但是属性不拷贝,拷贝出来的对象和原来的对象共用属性,即指向同一个属性地址. 深 ...

  9. Objective-c 深浅复制

    深浅复制的定义: 浅复制:在复制时,对于被复制对象的每一层都是指针复制. 深复制:在复制时,对于被复制的对象至少有一层是对象复制. 完全复制:在复制时,对于被复制对象的每一层都是完全复制. retai ...

随机推荐

  1. 窗体Showmedol 遇到的奇怪异常： cannot make a visible window model

    //窗体Showmedol 遇到的奇怪异常: cannot make a visible window model //背景:ShowModal A窗体,A窗体再ShowModal B窗体:A是透明背 ...

  2. 分享一个discuz touch端的jQuery下拉刷新组件

    在线Demo 最近装了个discuz论坛, 趣股VIP吧,发现里面内置的jQuery上拉刷新组件写得还行,STATICURL可以用'http://o9gzet7tk.bkt.clouddn.com/i ...

  3. Angular 单元格合并

    在Angular实现表格输出的话,使用ng-repeat输出信息, 使用了: ng-repeat-start ng-repeat-end ng-hide="$first" < ...

  4. 关于使用iframe嵌套页面的跳转方式

    一.背景A,B,C,D都是jsp,D是C的iframe,C是B的iframe,B是A的iframe,在D中跳转页面的写法区别如下. 二.JS跳转window.location.href.locatio ...

  5. 关于CSS3的小知识点之2D变换

        transition过渡 transition-duration:; 运动时间 transition-delay:; 延迟时间 transition-timing-function:; 运动形 ...

  6. iOS特性一 关闭系统日志打印

    解决办法 (1)Product -->Scheme -->Edit Scheme -->Run -->Arguments (2)添加一个属性值OS_ACTIVITY_MODE: ...

  7. asp.net 项目Net4.0 在IE10、 IE 11 下出现 “__doPostBack”未定义 的解决办法

    我的项目中,服务器端是Windows Server2008 64位,.net版本是4.0,也遇到了树形结构控件.DropDownList控件等不能调用服务器端代码.最后发现js报错. 错误信息:“__ ...

  8. （转）Eclipse和MyEclipse安装和使用git(egit)图解笔记

    Eclipse.MyEclipse使用git插件(egit)图解 (转)原文来自:http://www.xuebuyuan.com/446322.html 在开发Java.JavaEE等相关程序时,我 ...

  9. php获取网卡MAC地址源码

    <?php /** 获取网卡的MAC地址原码:目前支持WIN/LINUX系统 获取机器网卡的物理(MAC)地址 **/ class GetMacAddr{ var $return_array = ...

  10. 异常处理_Maven多模块web项目整合ssm+dubbo

    异常如下: [ERROR][org.springframework.web.context.ContextLoader.initWebApplicationContext(ContextLoader. ...