在JS中对象一般都是传地址,后续修改也会影响原始数据。例如这样。

var a={
b:"b"
}; var c=a;
c.b="c"; console.log(a);
console.log(c);

会发现a.b也变成了"c"。

以下是网上一位高手写的JS实现值复制,独立复制一个对象,避免双向修改。

//值复制
function clone(obj) {
//判断是对象,就进行循环复制
if (typeof obj === 'object' && typeof obj !== 'null') {
// 区分是数组还是对象,创建空的数组或对象
var o = Object.prototype.toString.call(obj).slice(8, -1) === "Array" ? [] : {};
for (var k in obj) {
// 如果属性对应的值为对象,则递归复制
if(typeof obj[k] === 'object' && typeof obj[k] !== 'null'){
o[k] = clone(obj[k])
}else{
o[k] = obj[k];
}
}
}else{ //不为对象,直接把值返回
return obj;
}
return o;
}

上述代码有一个bug,就是针对null的处理,null在js中的类型是object,上述代码会将null复制成{}。根本的问题在于高手在条件“typeof obj === 'object' && typeof obj !== 'null'”的时候做了错误的判断,试想类型是object了肯定类型就不是null了吧。以下是修正后的方法:

//值复制
function clone(obj) {
//判断是对象,就进行循环复制
if (typeof obj === 'object' && obj!=null) {
// 区分是数组还是对象,创建空的数组或对象
var o = Object.prototype.toString.call(obj).slice(8, -1) === "Array" ? [] : {};
for (var k in obj) {
// 如果属性对应的值为对象,则递归复制
if(typeof obj[k] === 'object' && obj[k]!=null){
o[k] = clone(obj[k])
}else{
o[k] = obj[k];
}
}
}else{ //不为对象,直接把值返回
return obj;
}
return o;
}

更多个人技术文章请访问:http://88gis.cn/

JS实现值复制的更多相关文章

  1. js 对象深复制,创建对象和继承

    js 对象深复制,创建对象和继承.主要参考高级编程第三版,总结网上部分资料和自己的代码测试心得.每走一小步,就做一个小结. 1.对象/数组深复制 一般的=号传递的都是对象/数组的引用,如在控制台输入 ...

  2. [置顶] js中如何复制一个对象,如何获取所有属性和属性对应的值

    在js中如何复制一个对象,例如如下一个js对象. 如果知道这个对象的所有属性自然就可以重新new一个,然后对每个属性赋值,就可以做到,但如果不知道呢?如何创建一个内容相同 的对象呢? var obj= ...

  3. Cocos Creator JS web平台复制粘贴代码(亲测可用)

    Cocos Creator JS web平台复制粘贴代码(亲测可用) 1 webCopyString: function(str){ var input = str; const el = docum ...

  4. js 将内容复制到剪贴板

      js 将内容复制到剪贴板 CreationTime--2018年7月1日15点06分 Author:Marydon function copyToClipboard(txt) { if(windo ...

  5. Python脚本实现值更新事件赋值过程记录日志监控

    #LogWatch 实现值更新事件赋值过程记录日志监控 clr.AddReference('System') clr.AddReference('Kingdee.BOS') clr.AddRefere ...

  6. ZeroClipboard / jquery.zclip.min.js跨浏览器复制插件使用中遇到的问题解决

    之前写过一个淘宝优惠券连接PC端转手机端连接的小工具,当时写到将转换好的url复制到剪切板这块时解决了IE和火狐,就是没办法搞定Chrome,知道可以通过flash搞定,但是觉得太麻烦没有仔细研究. ...

  7. js 点击复制内容

    <textarea id="pushUrlsTxt" rows="5" cols="55"></textarea> ...

  8. JS 点击复制Copy (share)

    分享自:http://www.cnblogs.com/athens/archive/2013/01/16/2862981.html 1.实现点击按钮,复制文本框中的的内容 1 <script t ...

  9. js禁止页面复制 禁用页面右键菜单的代码

    js实现禁止页面复制功能.禁用页面右键菜单等功能.  <body oncontextmenu="return false">禁用网页右键菜单,但是仍然可以使用快捷键复制 ...

随机推荐

  1. docker+zookeeper+mesos+marathon集群

    实验环境: 主机名 ip地址 运行服务 安装组件 docker-master1 192.168.20.210 zookeepermesos-mastermarathon mesosmarathonme ...

  2. swift学习之-- UIAlertViewController -alert

    // //  ViewController.swift //  alertView // //  Created by su on 15/12/7. //  Copyright © 2015年 tia ...

  3. Ubuntu的TOOL工具收集

    Ubuntu工具 1. Ubuntu下嵌入式开发环境的搭建 http://www.linuxidc.com/Linux/2011-03/33824.htm

  4. Oracle电子商务套件版本12.1.3自述文件 (Doc ID 1534411.1)

    文档内容 用途 适用范围 详细信息   应用版本更新包   更新后的步骤   包含的修补程序列表   变更记录   文档可访问性 参考 适用于: Oracle Applications DBA - 版 ...

  5. [翻译]Component Registration in Script System 在脚本系统中注册组件

    Component Registration in Script System 在脚本系统中注册组件   To refer to our component from a script, the cl ...

  6. Python学习-5.Python的变量与数据类型及字符串的分割与连接

    在Python中,变量类型是固定的,一旦声明就不能修改其类型(在Python里感觉不应该用声明,而应该用使用) 正确: var = 1 print(var) var = 2 print(var) 依次 ...

  7. 安装TestNG在eclipse中的插件

    两种方法可以安装TestNG Eclipse插件: 第一种,离线安装 TestNG Eclipse插件下载地址http://testng.org/doc/download.html. 下载下来以后,放 ...

  8. wp调用百度服务api

    通过百度开放平台申请api成功后,百度会提供一个application key简称ak和一个security key简称sk. 看一下某个服务url的格式 1. url前缀 2. 服务类型 3. 参数 ...

  9. [Erlang25]Erlang in anger 翻译

    Erlang in anger     Erlang in anger 是写Learn some Erlang的帅小伙(照片真是帅死啦)写的,一共87页,可以随意下载(英文原版):http://www ...

  10. [C#学习笔记]C#中的decimal类型——《CLR via C#》

    System.Decimal是非常特殊的类型.在CLR中,Decimal类型不是基元类型.这就意味着CLR没有知道如何处理Decimal的IL指令. 在文档中查看Decimal类型,可以看到它提供了一 ...