在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. 07Mendel's First Law

    Problem Figure 2. The probability of any outcome (leaf) in a probability tree diagram is given by th ...

  2. shell 脚本 查看班上同学的网络状态

    #!/bin/base # a=192.168.100. //定义变量 c=('王浩' '谢云生' '黄科杨' '何星宇' '张宸兵' '胡燕' '刘桃') //定义数组 for b in {101. ...

  3. Sourcetree拉取推送问题

    以下sourcetree使用时出现的问题:可以暂时用删除passwd文件解决 拉取时账号密码输入错误 已经有一个远程仓库了,但是需要拉取另一个远程仓库时,提示URL 进入 C:\Users\用户名\A ...

  4. 如何在Mirth Connect中创建和调用自定义Java代码

    0-前言 本文章将向您展示如何创建自定义Java类,将其编译/打包到JAR中,将其包含在Mirth Connect在,并在JavaScript中调用它,您可以从任何JavaScript上下文调用自定义 ...

  5. Mysql报Packet for query is too large (1040 > 1024)错误

    Linux下mysql 报Packet for query is too large (1040 > 1024)错误的解决方法 项目之前一直正常运行,这几天突然一直提示查询出错,看了下日志发现提 ...

  6. HighCharts使用总结

    1.常用属性 chart: type:areaspline(线面图).arearange(区间图) zoomType: 缩放类型(沿着'xy'轴缩放) alignTicks:设置坐标轴刻度对齐. 当有 ...

  7. [51单片机] nRF24L01 无线模块 串口法命令 通过无线控制另一个的灯

    >_<!概述: 这是在上一个的基础上通过按键发送4种不同命令来控制接收端的LED灯亮的改进版(上一个:http://www.cnblogs.com/zjutlitao/p/3840013. ...

  8. 如何为SharePoint文档库、文件夹、文件单独设置权限

    在这里使用截图的方式简单描述两个问题:设置SharePoint Server文档库权限和文档库中的文件夹权限 一.设置SharePoint Server文档库权限 Figure 1 - 打开文档库后, ...

  9. Pi 在Windows下面使用远程桌面登录

    1.删除系统自带的xrdp 输入命令sudo apt-get purge xrdp pi@raspberrypi:~ $ sudo apt-get purge xrdp 正在读取软件包列表... 完成 ...

  10. ClamAV学习【7】——病毒库文件格式学习

    搜查到一份详细的ClamAV病毒文件格式资料(http://download.csdn.net/detail/betabin/4215909),英文版,国内这资料不多的感觉. 重点看了下有关PE的病毒 ...