js 数组克隆方法 小结


Posted in Javascript onMarch 20, 2010

因此如果要创建一个与已经存在的对象内容相同的对象,不能通过简单的赋值操作。这样说的可能还是不太明白。

看下面的例子:

var a=[1,2,3,4]; var b=a;c=b; a.pop(); //移除最后一个元素 alert(b); //弹出1,2,3 alert(c); //弹出1,2,3 
var a=[1,2,3,4]; var b=a;c=b; a.pop(); //移除最后一个元素 alert(b); //弹出1,2,3 alert(c); //弹出1,2,3

我们执行上面的代码发现,在a的内容做改变后,变量b和c的结果也改变了。

上面的情况也许不是我们所需要的,我们希望的是创建一个与原对象内容一样的“新”对象。这样我们就需要通过一些克隆的办法来实现。

JS里Array也是一种Object。这里我们主要总结一下Array的克隆方式,我们这里为Array原生对象扩展一个clone方法。

1、最简单的办法,就是创建一个新数组,并遍历数组逐项添加到新数组中。

Array.prototype.clone=function(){ var a=[]; for(var i=0,l=this.length;i<l;i++) a.push(this[i]); return a; } 
Array.prototype.clone=function(){ var a=[]; for(var i=0,l=this.length;i<l;i++) a.push(this[i]); return a; }

这种实现方式是最容易想到也是最容易理解的,但是代码有点复杂了,我们仔细研究Array的一些方法,其实还有一个很简单的办法。下面说一下其它的两种办法。

2、通过Array对象的slice方法。

slice方法是通过参数start和end的传入值来返回数组中的一段,该方法不对原数组进行操作。我们通过slice(0)可以使其返回所有项。

Array.prototype.clone=function(){ return this.slice(0); } 
Array.prototype.clone=function(){ return this.slice(0); }

3、通过Array对象的concat方法。
concat方法是用来实现数组的合并的。通过和一个空函数的合并,即可实现我们的克隆功能。
Array.prototype.clone=function(){ return [].concat(this); } //或者 Array.prototype.clone=function(){ return this.concat(); } 
Array.prototype.clone=function(){ return [].concat(this); } //或者 Array.prototype.clone=function(){ return this.concat(); }

如果发挥想象应该还有其它的办法,以上只是本人想到的两种方法。

JavaScript 克隆数组最简单的方法

JavaScript数组的快速克隆(slice()函数)和数组的排序、乱序和搜索(sort()函数)

Javascript 相关文章推荐
Lazy Load 延迟加载图片的 jQuery 插件
Feb 06 Javascript
jquery URL参数判断,确定菜单样式
May 31 Javascript
仅IE不支持setTimeout/setInterval函数的第三个以上参数
May 25 Javascript
Js 代码中,ajax请求地址后加随机数防止浏览器缓存的原因
May 07 Javascript
jQuery获得内容和属性示例代码
Jan 16 Javascript
使用javascript获取页面名称
Dec 23 Javascript
微信小程序实现页面跳转传值的方法
Oct 12 Javascript
JS/jQuery实现DIV延时几秒后消失或显示的方法
Feb 12 jQuery
Vue项目分环境打包的实现步骤
Apr 02 Javascript
实用的Vue开发技巧
May 30 Javascript
vue3实现v-model原理详解
Oct 09 Javascript
详解关闭令人抓狂的ESlint 语法检测配置方法
Oct 28 Javascript
vs2003 js文件编码问题的解决方法
Mar 20 #Javascript
Jquery AutoComplete自动完成 的使用方法实例
Mar 19 #Javascript
JavaScript 对象的属性和方法4种不同的类型
Mar 19 #Javascript
jQuery 前的按键判断代码
Mar 19 #Javascript
Javascript 匿名函数及其代码模式原理
Mar 19 #Javascript
JS 有名函数表达式全面解析
Mar 19 #Javascript
Jquery Ajax学习实例6 向WebService发出请求,返回DataSet(XML) 异步调用
Mar 18 #Javascript
You might like
php 论坛采集程序 模拟登陆,抓取页面 实现代码
2009/07/09 PHP
浅析PHP开发规范
2018/02/05 PHP
JS类的封装及实现代码
2009/12/02 Javascript
JavaScript 类似flash效果的立体图片浏览器
2010/02/08 Javascript
javascript Array对象基础知识小结
2010/11/16 Javascript
jQuery控制输入框只能输入数值的小例子
2013/03/20 Javascript
Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用法总结
2013/11/14 Javascript
jquery 字符串切割函数substring的用法说明
2014/02/11 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
2015/08/11 Javascript
js实现消息滚动效果
2017/01/18 Javascript
Vue过滤器的用法和自定义过滤器使用
2017/02/08 Javascript
JavaScript字符串_动力节点Java学院整理
2017/06/27 Javascript
JavaScript中EventLoop介绍
2018/01/22 Javascript
JavaScript实现新年倒计时效果
2018/11/17 Javascript
详解Nodejs get获取远程服务器接口数据
2019/03/26 NodeJs
使用PreloadJS加载图片资源的基础方法详解
2020/02/03 Javascript
vue大型项目之分模块运行/打包的实现
2020/09/21 Javascript
[01:44]剑指西雅图 展望TI之CIS战队专访
2014/06/25 DOTA
[42:35]2018DOTA2亚洲邀请赛3月30日 小组赛A组 VG VS OpTic
2018/03/31 DOTA
python3 pandas 读取MySQL数据和插入的实例
2018/04/20 Python
Python操作mongodb数据库进行模糊查询操作示例
2018/06/09 Python
解决Python安装后pip不能用的问题
2018/06/12 Python
用Python将mysql数据导出成json的方法
2018/08/21 Python
Python多线程应用于自动化测试操作示例
2018/12/06 Python
Pyorch之numpy与torch之间相互转换方式
2019/12/31 Python
Django serializer优化类视图的实现示例
2020/07/16 Python
Python3读写ini配置文件的示例
2020/11/06 Python
基层干部2014全国两会学习心得体会
2014/03/10 职场文书
清正廉洁演讲稿
2014/05/22 职场文书
跳蚤市场口号
2014/06/13 职场文书
中国梦演讲稿范文
2014/08/28 职场文书
干部竞争上岗演讲稿
2014/09/11 职场文书
2015年迎新晚会策划书
2015/07/16 职场文书
三八妇女节致辞
2015/07/31 职场文书
python中requests库+xpath+lxml简单使用
2021/04/29 Python
Docker与K8s关系介绍不会Docker也可以使用K8s
2022/06/25 Servers