Javascript中的一种深复制实现
在javascript中,所有的object变量之间的赋值都是传地址的,可能有同学会问哪些是object对象。举例子来说明可能会比较好:
typeof(true) //"boolean"
typeof(1) //"number"
typeof("1") //"string"
typeof({}) //"object"
typeof([]) //"object"
typeof(null) //"object"
typeof(function(){}) //"function"
所以其实我们深复制主要需要处理的对象就是object对象,非object对象只要直接正常的赋值就好。我实现js深复制的思路就是:
- 遍历所有该对象的属性,
- 如果该属性是"object"则需要特殊处理,
- 如果这个object对象比较特殊,是一个数组,那就创建一个新的数组并深复制数组里的元素
- 如果这个object对象是个非数组对象,那直接再对它递归调用深复制方法即可。
- 如果不是"object",则直接正常复制就行。
下面就是我的实现了:
Object.prototype.DeepCopy = function () {
var obj, i;
obj = {};
for (attr in this) {
if (this.hasOwnProperty(attr)) {
if (typeof(this[attr]) === "object") {
if (this[attr] === null) {
obj[attr] = null;
}
else if (Object.prototype.toString.call(this[attr]) === '[object Array]') {
obj[attr] = [];
for (i=0; i<this[attr].length; i++) {
obj[attr].push(this[attr][i].DeepCopy());
}
} else {
obj[attr] = this[attr].DeepCopy();
}
} else {
obj[attr] = this[attr];
}
}
}
return obj;
};
如果浏览器支持ECMAScript 5的话,为了深复制对象属性的所有特性,可以使用
Object.defineProperty(obj, attr, Object.getOwnPropertyDescriptor(this, attr));
来替代
obj[attr] = this[attr];
直接在Object.prototype上实现该方法的好处是,所有对象都会继承该方法。坏处是某些库也会改写Object对象,所以有时会发生冲突。这是需要注意的。具体使用方法如下:
Object.prototype.DeepCopy = function () { ... }
var a = { x:1 };
var b = a;
var c = a.DeepCopy();
a.x = 2;
b.x = 3;
console.log(a.x); //3
console.log(b.x); //3
console.log(c.x); //1
转载请注明出处:jerryzou.com
Javascript中的一种深复制实现的更多相关文章
- 对 JavaScript 中的5种主要的数据类型进行值复制
定义一个函数 clone(),可以对 JavaScript 中的5种主要的数据类型(包括 Number.String.Object.Array.Boolean)进行值复制 使用 typeof 判断值得 ...
- 实现一个函数clone,使JavaScript中的5种主要的数据类型(包括Number、String、Object、Array、Boolean)进行值复制
实现一个函数clone,可以对JavaScript中的5种主要的数据类型(包括Number.String.Object.Array.Boolean)进行值复制. 1 /** 对象克隆 2 * 支持基本 ...
- 探究JavaScript中的五种事件处理程序
探究JavaScript中的五种事件处理程序 我们知道JavaScript与HTML之间的交互是通过事件实现的.事件最早是在IE3和Netscape Navigator 2中出现的,当时是作为分担服务 ...
- JavaScript中的三种弹出对话框
学习过js的小伙伴会发现,我们在一些实例中用到了alert()方法.prompt()方法.prompt()方法,他们都是在屏幕上弹出一个对话框,并且在上面显示括号内的内容,使用这种方法使得页面的交互性 ...
- JavaScript中的三种弹出框的区别与使用
JavaScript中有三种原生的弹出框,分别是alert.confirm.prompt.分别表示弹出框.确认框.信息框. 以下是示例代码: <!DOCTYPE html> <htm ...
- JavaScript 中的12种循环遍历方法
原文:JavaScript 中的12种循环遍历方法 题目:请介绍 JavaScript 中有哪些循环和遍历的方法,说说它们的应用场景和优缺点? 1.for 循环 let arr = [1,2,3];f ...
- 好文:javascript中的四种循环
https://juejin.im/entry/5a1654e951882554b8373622?utm_medium=hao.caibaojian.com&utm_source=hao.ca ...
- JavaScript中的两种全局对象
这里总结的东西特别适合先学习c/c++, Java这类标准语言再学JS的童鞋们看,因为JS在程序执行之前就会初始化一个全局对象,这个全局对象到底是什么是跟JS程序运行环境有关的. 根据JavaScri ...
- Javascript中的五种数据类型
Undefined 未定义.只有一个值undefined Null 只有一个值,null Boolean 在javascript中,只要逻辑表达式不返回undefined不返回null ...
随机推荐
- Airbnb面试的27个奇葩问题,你 hold 住吗?
Airbnb 目前估值 255 亿美金,排名世界科技公司第三.但如果你想去他家工作,可能首先需要回答一些很棘手的问题. 以下,是 BI 通过 Glassdoor 信息收集到的:曾经历 Airbnb 面 ...
- sublime3快捷 输入html
ID and CLASS attributes html > // 直接生成整个框架 > 表示 tab建 #header <div id="header"> ...
- mysql 用户权限设置【转】
在Linux下phpStudy集成开发环境中,要先进入mysql下bin目录,执行mysql ./mysql -u root -p 1.创建新用户 通过root用户登录之后创建 >> gr ...
- C++学习40 抛出自己的异常
throw 是C++中的关键字,用来抛出异常.如果不使用 throw 关键字,try 就什么也捕获不到:上节提到的 at() 函数在内部也使用了 throw 关键字来抛出异常. throw 既可以用在 ...
- [Flex] PopUpButton系列 —— 弹出菜单的行高设置
<?xml version="1.0" encoding="utf-8"?> <!--Flex中如何通过variableRowHeight样式 ...
- [Flex] PopUpButton系列 —— 添加按钮图标
<?xml version="1.0" encoding="utf-8"?><!--为主按钮添加默认图标 PopUpButtonIcon.mx ...
- 一些BOOTSTRAP的问题
老师好,有几个点不是很明白,劳烦老师帮忙解惑 <1>不是特别清楚nav和navbar的区别,视频中用的是nav标签,而class则标明navbar,是不是这里的nav其实没有什么作用,而c ...
- 用Java开发gRPC服务的例子分析
本文的代码例子来自:https://github.com/grpc/grpc-java 定义服务 这一步与其他语言完全一样,需要定义gRPC的服务.方法.request和response的类型. 完 ...
- Hibernate注解:一对一主键关联
情形:两个表,my_site和my_site_company,通过主键site_id唯一关联.my_site的主键是自动增加,my_site_company的主键依赖于my_site. # # Sou ...
- Android--创建进度框ProgressDialog
1.布局文件progress_dialog_activity.xml <?xml version="1.0" encoding="utf-8"?> ...