javascript克隆对象深度介绍


Posted in Javascript onNovember 20, 2012

js一般有两种不同数据类型的值:

基本类型(包括undefined,Null,boolean,String,Number),按值传递;

引用类型(包括数组,对象),按址传递,引用类型在值传递的时候是内存中的地址。
克隆或者拷贝分为2种:

浅度克隆:基本类型为值传递,对象仍为引用传递。

深度克隆:所有元素或属性均完全克隆,并于原引用类型完全独立,即,在后面修改对象的属性的时候,原对象不会被修改。

function cloneObject(obj){ 
var o = obj.constructor === Array ? [] : {}; 
for(var i in obj){ 
if(obj.hasOwnProperty(i)){ 
o[i] = typeof obj[i] === "object" ? cloneObject(obj[i]) : obj[i]; 
} 
} 
return o; 
}

另:如果是一个简单的数组,元素中没有引用类型的值,可以直接用array.concat();或者array.slice(0);来深度拷贝一个数组,这样简单又高效。数组的concat()和slice()本来就会生成一个新的数组,原来的数组不会受影响。但是要注意的是你要确保被拷贝的数组中元素中没有引用类型的值。
这是另一种深度克隆的方法,很简单,很实用:
var s = JSON.stringify( obj ); 
var o = JSON.parse( s );
Javascript 相关文章推荐
简单的前端js+ajax 购物车框架(入门篇)
Oct 29 Javascript
js获取class的所有元素
Mar 28 Javascript
在父页面得到zTree已选中的节点的方法
Feb 12 Javascript
图片旋转、鼠标滚轮缩放、镜像、切换图片js代码
Dec 13 Javascript
使用vue.js开发时一些注意事项
Apr 27 Javascript
javascript replace()第二个参数为函数时的参数用法
Dec 26 Javascript
vue+socket.io+express+mongodb 实现简易多房间在线群聊示例
Oct 21 Javascript
深入理解Vue 的钩子函数
Sep 05 Javascript
vue template中slot-scope/scope的使用方法
Sep 06 Javascript
Vue.use()在new Vue() 之前使用的原因浅析
Aug 26 Javascript
layui 解决form表单点击无反应的问题
Oct 25 Javascript
vue渲染方式render和template的区别
Jun 05 Javascript
Extjs显示从数据库取出时间转换JSON后的出现问题
Nov 20 #Javascript
JS中toFixed()方法引起的问题如何解决
Nov 20 #Javascript
JavaScript实现拼音排序的方法
Nov 20 #Javascript
Js+Flash实现访问剪切板操作
Nov 20 #Javascript
利用JQuery和JS实现奇偶行背景颜色自定义效果
Nov 19 #Javascript
jQuery 数据缓存模块进化史详细介绍
Nov 19 #Javascript
基于jquery库的tab新形式使用
Nov 16 #Javascript
You might like
php下目前为目最全的CURL中文说明
2010/08/01 PHP
php教程之魔术方法的使用示例(php魔术函数)
2014/02/12 PHP
PHP使用array_multisort对多个数组或多维数组进行排序
2014/12/16 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
TP5框架实现自定义分页样式的方法示例
2020/04/05 PHP
利用javascript查看html源文件
2006/11/08 Javascript
javascript学习笔记(十三) js闭包介绍(转)
2012/06/20 Javascript
jquery 元素控制(追加元素/追加内容)介绍及应用
2013/04/21 Javascript
Mac OS X 系统下安装和部署Egret引擎开发环境
2014/09/03 Javascript
jQuery实现高亮显示的方法
2015/03/10 Javascript
Bootstrap表格制作代码
2017/03/17 Javascript
20行js代码实现的贪吃蛇小游戏
2017/06/20 Javascript
基于vue 开发中出现警告问题去除方法
2018/01/25 Javascript
微信小程序实现图片压缩功能
2018/01/26 Javascript
electron demo项目npm install安装失败的解决方法
2018/02/06 Javascript
基于express中路由规则及获取请求参数的方法
2018/03/12 Javascript
JavaScript简单实现关键字文本搜索高亮显示功能示例
2018/07/25 Javascript
JS函数节流和防抖之间的区分和实现详解
2019/01/11 Javascript
es6数组的flat(),flatMap()函数用法实例分析
2020/04/18 Javascript
Vue 数据响应式相关总结
2021/01/28 Vue.js
[00:36]我的中国心——Serenity vs Fnatic
2018/08/21 DOTA
基于scrapy实现的简单蜘蛛采集程序
2015/04/17 Python
python计算对角线有理函数插值的方法
2015/05/07 Python
pytorch进行上采样的种类实例
2020/02/18 Python
Python web如何在IIS发布应用过程解析
2020/05/27 Python
简单了解Python字典copy与赋值的区别
2020/09/16 Python
Python fileinput模块如何逐行读取多个文件
2020/10/05 Python
python+requests实现接口测试的完整步骤
2020/10/27 Python
html5拖曳操作 HTML5实现网页元素的拖放操作
2013/01/02 HTML / CSS
法国和欧洲海边和滑雪度假:Pierre & Vacances
2017/01/04 全球购物
阿里健康大药房:阿里自营网上药店
2017/08/01 全球购物
宝拉珍选官方旗舰店:2%水杨酸精华液,收缩毛孔粗大和祛痘
2018/07/01 全球购物
Hammitt官网:设计师手袋
2020/05/23 全球购物
“九一八事变纪念日”国旗下讲话稿
2014/09/14 职场文书
党员公开承诺书2015
2015/01/21 职场文书
2015年九一八事变纪念活动实施方案
2015/05/06 职场文书