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 相关文章推荐
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 Javascript
使用Post提交时须将空格转换成加号的解释
Jan 14 Javascript
浅析Js(Jquery)中,字符串与JSON格式互相转换的示例(直接运行实例)
Jul 09 Javascript
js获取控件位置以及不同浏览器中的差别介绍
Aug 08 Javascript
基于jQuery实现网页进度显示插件
Mar 04 Javascript
JS实现网页表格自动变大缩小的方法
Mar 09 Javascript
jquery图片倾斜层叠切换特效代码分享
Aug 27 Javascript
关于使用js算总价的问题
Jun 23 Javascript
使用JS和canvas实现gif动图的停止和播放代码
Sep 01 Javascript
为输入框加入数字js校验代码分享
Nov 02 Javascript
微信小程序系列之自定义顶部导航功能
May 21 Javascript
vue 插槽简介及使用示例
Nov 19 Vue.js
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
Oracle 常见问题解答
2006/10/09 PHP
IIS下配置Php+Mysql+zend的图文教程
2006/12/08 PHP
选择PHP作为网站开发语言的原因分享
2012/01/03 PHP
PHP导航下拉菜单的实现如此简单
2013/09/22 PHP
php检查字符串中是否包含7位GSM字符的方法
2015/03/17 PHP
PHP中把数据库查询结果输出为json格式简单实例
2015/04/09 PHP
thinkphp框架page类与bootstrap分页(美化)
2017/06/25 PHP
php设计模式之模板模式实例分析【星际争霸游戏案例】
2020/03/24 PHP
JavaScript 继承详解(四)
2009/07/13 Javascript
jQuery 使用手册(七)
2009/09/23 Javascript
JS 用6N±1法求素数 实例教程
2009/10/20 Javascript
js 全兼容可高亮二级缓冲折叠菜单
2010/06/04 Javascript
Node.js中使用Log.io在浏览器中实时监控日志(等同tail -f命令)
2014/09/17 Javascript
jQuery EasyUI封装简化操作
2016/09/18 Javascript
Nodejs 获取时间加手机标识的32位标识实现代码
2017/03/07 NodeJs
angular.JS实现网页禁用调试、复制和剪切
2017/03/31 Javascript
Angular.JS中指令ng-if的注意事项小结
2017/06/21 Javascript
浅谈关于angularJs中使用$.ajax的注意点
2017/08/12 Javascript
微信小程序表单验证form提交错误提示效果
2020/06/19 Javascript
[01:04:32]DOTA2-DPC中国联赛 正赛 Aster vs LBZS BO3 第二场 2月23日
2021/03/11 DOTA
Python引用(import)文件夹下的py文件的方法
2014/08/26 Python
Python装饰器的函数式编程详解
2015/02/27 Python
Python爬取国外天气预报网站的方法
2015/07/10 Python
Python2/3中urllib库的一些常见用法
2017/12/19 Python
对python GUI实现完美进度条的示例详解
2018/12/13 Python
python经典趣味24点游戏程序设计
2019/07/26 Python
详解Python中的分支和循环结构
2020/02/11 Python
Python实现我的世界小游戏源代码
2021/03/02 Python
HTML5中drawImage用法分析
2014/12/01 HTML / CSS
Sneaker Studio罗马尼亚网站:购买运动鞋
2018/11/04 全球购物
大学生创业计划书的用途
2014/01/08 职场文书
升职演讲稿范文
2014/05/23 职场文书
中国梦演讲稿3分钟
2014/08/19 职场文书
公司优秀员工推荐信
2015/03/24 职场文书
2015年暑期社会实践活动总结
2015/03/27 职场文书
“5.12”护士节主持词
2015/07/04 职场文书