实现一个函数clone,使JavaScript中的5种主要的数据类型(包括NumberStringObjectArrayBoolean)进行值复制

Posted Orange

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了实现一个函数clone,使JavaScript中的5种主要的数据类型(包括NumberStringObjectArrayBoolean)进行值复制相关的知识,希望对你有一定的参考价值。

实现一个函数clone,可以对javascript中的5种主要的数据类型(包括Number、String、Object、Array、Boolean)进行值复制。

 1 /** 对象克隆 
 2 * 支持基本数据类型及对象 
 3 * 递归方法 */ 
 4 function clone(obj) { 
 5     var o; 
 6     switch (typeof obj) { 
 7         case "undefined": 
 8             break; 
 9         case "string": o = obj + ""; 
10             break; 
11         case "number": o = obj - 0; 
12             break; 
13         case "boolean": o = obj; 
14             break; 
15         case "object": // object 分为两种情况 对象(Object)或数组(Array) 
16             if (obj === null) { 
17                 o = null; 
18             }else{ 
19                 if(Object.prototype.toString.call(obj).slice(8,-1) === "Array") { 
20                     o = []; 
21                     for (var i = 0; i < obj.length; i++) { 
22                       o.push(clone(obj[i])); 
23                     } 
24                 }else{ 
25                     o = {}; 
26                     for (var k in obj) { 
27                         o[k] = clone(obj[k]); 
28                     } 
29                 } 
30             } 
31             break; 
32         default: o = obj; 
33             break; 
34     } 
35     return o; 
36 }
37 
38 var m1 = clone([1,2,3]);
39 var m2 = clone({1:\'1\', \'hello\': 32});
40 console.log(m1);  //[ 1, 2, 3 ]
41 console.log(m2);  //{ \'1\': \'1\', hello: 32 }

 

 拓展:为什么用Object.prototype.toString.call(obj)检测对象类型?不理解这个函数的可以参考这篇博文。

这里我主要解释  Object.prototype.toString.call(obj).slice(8,-1) === "Array" ?是什么意思。

Object.prototype.toString.call([]);  //"[object Array]"
"[object Array]".slice(8,-1);  //"Array"

如果是数组对象,Object.prototype.toString.call([])的检测结果是  "[object Array]", 通过slice方法截取子串。   字符串的slice()方法可以查看js高程P124

当然:也可以使用  obj.constructor == Array ? [] : {}    来判断!!!

 

以上是关于实现一个函数clone,使JavaScript中的5种主要的数据类型(包括NumberStringObjectArrayBoolean)进行值复制的主要内容,如果未能解决你的问题,请参考以下文章

JavaScript中的对象复制(Object Clone)

JavaScript-其他设计模式

值复制

深入探讨JavaScript如何实现深度复制(deep clone)

javascript javascript中的traceroute clone

浅谈关于java中的深浅拷贝