js 数组克隆方法 小结

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

看下面的例子：


代码如下:

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()函数)

赞 (0)

相关推荐

  • javascript克隆对象深度介绍

    js一般有两种不同数据类型的值: 基本类型(包括undefined,Null,boolean,String,Number),按值传递: 引用类型(包括数组,对象),按址传递,引用类型在值传递的时候是内存中的地址. 克隆或者拷贝分为2种: 浅度克隆:基本类型为值传递,对象仍为引用传递. 深度克隆:所有元素或属性均完全克隆,并于原引用类型完全独立,即,在后面修改对象的属性的时候,原对象不会被修改. 复制代码 代码如下: function cloneObject(obj){ var o = obj.c

  • JS 创建对象(常见的几种方法)

    贴个代码先: function O(user,pwd){ //use constructor this.user=user; this.pwd=pwd; this.get=get; return this; } function O2(user,pwd){ //use factory var obj=new Object(); obj.user=user; obj.pwd=pwd; obj.get=get; return obj; } function O3(){ //use prototype

  • JS面向对象编程浅析

    在AJAX兴起以前,很多人写JS可以说都是毫无章法可言的,基本上是想到什么就写什么,就是一个接一个的函数function,遇到重复的还得copy,如果一不小心函数重名了,还真不知道从何开始查找错误,因为大家总是用面向过程的编程思想来写JS代码,而且也由于网络上充斥了太多小"巧"的JS代码段,很多都是随意而为,很不规范,这也就造成了大家对JS的"误解",一味的认为它就是一个辅助的小东东,而不适合做大的东西开发.但是自从AJAX兴起后,大量的JS代码编写要求人们具备像写

  • 显示js对象所有属性和方法的函数

    要想看到实际效果,可以先声明一些属性跟方法,否则是看不到,仔细往下看有例子的. 复制代码 代码如下: function ShowObjProperty(Obj) { var PropertyList=''; var PropertyCount=0; for(i in Obj){ if(Obj.i !=null) PropertyList=PropertyList+i+'属性:'+Obj.i+'\r\n'; else PropertyList=PropertyList+i+'方法\r\n'; }

  • js数组循环遍历数组内所有元素的方法

    例,for(){}遍历数组 复制代码 代码如下: <script type="text/javascript"> <!--var arr = new Array(13.5,3,4,5,6);for(var i=0;i<arr.length;i++){ arr[i] = arr[i]/2.0;}alert(arr); //--> </script> 例,for in循环遍历数组 复制代码 代码如下: <html><body>

  • JS 面向对象之神奇的prototype

    JavaScript中对象的prototype属性,可以返回对象类型原型的引用.这是一个相当拗口的解释,要理解它,先要正确理解对象类型(Type)以及原型(prototype)的概念. 1 什么是prototype JavaScript中对象的prototype属性,可以返回对象类型原型的引用.这是一个相当拗口的解释,要理解它,先要正确理解对象类型(Type)以及原型(prototype)的概念. 前面我们说,对象的类(Class)和对象实例(Instance)之间是一种"创建"关系,

  • JS匿名函数实例分析

    本文实例讲述了JS匿名函数.分享给大家供大家参考,具体如下: /* 匿名函数*/ (function() { var foo = 10; var bar = 2; alert(foo * bar); })(); /* 匿名函数,带参数 */ (function(foo, bar) { alert(foo * bar); })(10, 2); /* 匿名函数返回值 */ var baz = (function(foo, bar) { return foo * bar; })(10, 2); //

  • js数组与字符串的相互转换方法

    熟悉js的朋友很多都遇到过js的数组与字符串相互转换的情况,本文就此作一简单介绍,示例如下: 一.数组转字符串 需要将数组元素用某个字符连接成字符串,示例代码如下: var a, b; a = new Array(0,1,2,3,4); b = a.join("-"); 二.字符串转数组 实现方法为将字符串按某个字符切割成若干个字符串,并以数组形式返回,示例代码如下: var s = "abc,abcd,aaa"; ss = s.split(","

  • js获取和设置属性的方法

    复制代码 代码如下: function square(num){    var total = num*num;//局部变量    return total;}var total = 50;//全局变量var number = square(20);alert(total);//结果为50 function square(num){    total = num*num;//全局变量    return total;}var total = 50;//全局变量var number = squar

  • JS匿名函数类生成方式实例分析

    本文实例讲述了JS匿名函数类生成方式.分享给大家供大家参考,具体如下: <script type="text/javascript"> var Book = (function() { // 私有静态属性 var numOfBooks = 0; // 私有静态方法 function checkIsbn(isbn) { if(isbn == undefined || typeof isbn != 'string') { return false; } return true;

  • JS克隆，属性，数组，对象，函数实例分析

    JS克隆，属性，数组，对象，函数实例分析

    本文实例讲述了JS克隆,属性,数组,对象,函数.分享给大家供大家参考,具体如下: <script type="text/javascript"> /* 克隆原型得到对象 */ function clone(object) { function F() {} F.prototype = object; return new F; } var Person = { name: 'default name', getName: function() { return this.n

  • JS面向对象编程之对象使用分析

    因为大家总是用面向过程的编程思想来写JS代码,而且也由于网络上充斥了太多小"巧"的JS代码段,很多都是随意而为,很不规范,这也就造成了大家对JS的"误解",一味的认为它就是一个辅助的小东东,而不适合做大的东西开发.但是自从AJAX兴起后,大量的JS代码编写要求人们具备像写JAVA类似的代码一样,能够面向对象进行开发. 所以下面就结合我自己的体会和所学习的东东和大家一起来学习在JS中如何使用面向对象的编程.其实使用JS进行面向对象开发也不是很难的事情,因为在JS中每一

随机推荐