首先,我们要知道,javascript中除了基本类型(number,string,boolean,null,undefined)之外就是引用类型了,也可以说就是js对象了。

引用类型的赋值其实是对象保存在栈区地址指针的赋值,因此两个变量指向同一个对象,任何的操作都会相互影响。

在探讨到深度克隆之前,我们先来看一下下面的例子:

example01:

     var a = [1,2,3];
var b = a; // a b共用一个引用
b.push(4);
alert(b); // [1,2,3,4]
alert(a); // [1,2,3,4]

example02:

     var a = [1,2,3];
var b = a;
b = [1,2,3,4]; // b新开了一个引用
alert(b); // [1,2,3,4]
alert(a); // [1,2,3]

example03:

     var obj = {
a: 10
};
var obj2 = obj;
obj2.a = 20;
alert(obj.a); //

example04:

     var obj = {
a: 10
};
function copy(obj){ // 浅拷贝, 只拷贝的一层
var newObj = {};
for(var attr in obj){
newObj[attr] = obj[attr];
}
return newObj;
}
var obj2 = copy(obj);
obj2.a = 20;
alert(obj.a); //

example05:

     var obj = {
a: {
b: 10
}
}
function copy(obj){ //浅拷贝, 只拷贝了一层
var newObj = {};
for(var attr in obj){
newObj[attr] = obj[attr];
}
return newObj;
}
var obj2 = copy(obj);
obj2.a.b = 20;
alert(obj.a.b); //

看完上面几个例子之后,想必对js对象引用有了一定的认识。接下来,我们来看js里面另外一个重要的应用---递归。

递归定义可以分为两点:(1).函数调用函数自身,执行递的动作;(2).最后一次判断一个终止条件,可以执行归的动作。

example06:

     //求nX(n-1)X(n-2)X...X2X1

      function test(n){
if(n == 1){
return 1;
}
return n*test(n-1);
}
alert(test(5)); //

所以,深拷贝也用到了递归。

对象的子对象也是引用,所以遍历赋值的时候要判断,子元素是否是对象,如果子元素是对象,则继续对子元素进行遍历赋值

example07:

     //深拷贝
function deepClone(obj){
var newObj = {};
if(typeof obj != 'object'){
return obj;
}
for(var attr in obj){
newObj[attr] = deepClone(obj[attr]);
}
return newObj;
}
var obj = {
a: {
b: 10
}
};
var obj2 = deepClone(obj);
obj2.a.b = 20;
alert(obj.a.b); //

深度克隆---js对象引用的更多相关文章

  1. js对象的深度克隆

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. JS的深度克隆,利用构造函数原型深度克隆

    我爱撸码,撸码使我感到快乐!大家好,我是Counter.今天来写写,JS中的深度克隆,这个在笔面试中,考的还是比较多的,主要是对象与数组的赋值,如果直接赋值的话,那么得到的是对象或者数组在堆里的地址, ...

  3. js深度克隆对象

    js深度克隆对象 js深度克隆对象简单的记录一下,如下代码: var obj = { typeOf: function(obj) { const toString = Object.prototype ...

  4. js实现数组、对象深度克隆的两种办法

    1.深度克隆的原理 JS中的深度克隆,指的是原对象改变了,克隆出来的新对象也不会改变,原对象与新对象是完全独立的关系. 实现深度克隆的原理得从对象是一种引用类型说起 众所周知,对象是一种引用类型,对象 ...

  5. js之深度克隆、简易克隆

    一.js中的对象 谈到对象的克隆,必定要说一下对象的概念. js中的数据类型分为两大类:原始类型和对象类型. (1)原始类型包括:数值.字符串.布尔值.null.undefined(后两个是特殊的原始 ...

  6. JS对象深度克隆

    首先看一个例子: var student = { name:"yxz", age:25 } var newStudent = student; newStudent.sex = & ...

  7. js对象简单、深度克隆(复制)

    javascript的一切实例都是对象,只是对象之间稍有不同,分为原始类型和合成类型.原始类型对象指的是字符串(String).数值(Number).布尔值(Boolean),合成类型对象指的是数组( ...

  8. js浅度克隆/深度克隆

    首先弄明白几个概念: 一. 具体数据类型分为两种:  1.原始数据类型  2.引用数据类型 原始数据类型存储的是对象的实际地址,包括: number.string.boolean.还有两个特殊的nul ...

  9. js里的深度克隆

    ES6 数组克隆 let arr = [1,2,3,4,5]; let arr1 = [...a]; arr1 = ["a","b","c" ...

随机推荐

  1. 在xcode6.1和ios10.10.1环境下实现app发布

    之前写过在xcode6.1和ios10.10.1环境下实现真机测试,以及最近提交的app一直在审核当中,所以木有发布如何实现app发布来分享给大家.刚好昨天app审核通过了,所以就分享一篇如何实现ap ...

  2. 【转】无废话WCF系列教程

    转自:http://www.cnblogs.com/iamlilinfeng/category/415833.html     看后感:这系列的作者李林峰写得真的不错,通过它的例子,让我对WCF有了一 ...

  3. 【POJ1823】【线段树】Hotel

    Description The "Informatics" hotel is one of the most luxurious hotels from Galaciuc. A l ...

  4. splice 操作符

    几乎所有的数组操作都可用 splice 实现. 除了第一个参数,数组,为必须,其余的参数都不是必须的. splice ARRAY, OFFSET, LENGTH, LIST OFFSET 和 LENG ...

  5. LAMP的编译日志,

    在CentOS5.2上,编译LAMP的,两年前测试通过的,现在留印 ### 在记事本中 ,不要打开 自动换行,否则一些命令 无法正常运行###把源文件考到/src/目录下,然后进入/src////// ...

  6. 搜索所有的路径-矩阵运算-暴力-ACM

    给定一个n*n整数矩阵,定义对I行的SHIFT操作( 0 <= i < n ),是将第I行所有元素都右移一位,最右边的移到最左边. 你可以对任意行进行任意次SHIFT操作,使得: max0 ...

  7. 干掉Google字体,WordPress速度暴涨

    2014年7月7日23:40:31 因为Google被墙,WordPress引用的Google字体总会加载很长时间,严重影响打开速度. 安装WordPress插件 Disable Google Fon ...

  8. BAE 环境下配置 struts2 + spring + hibernate(SSH)(二)struts2

    在myeclipse下开发的 应用但是 放到BAE下就出现了问题,虽然显示发布成功,但是访问的时候就会出现503 Service Unavailable 错误.通过调整 web.xml 发现纯Serv ...

  9. css 中 的 float :left 和 clear :both

    float:left;(左浮动)他使得指定元素脱离普通的文档流而产生的特别的布局特性.并且FLOAT必需应用在块级元素之上,也就是说浮动并不应用于内联标签.或者换句话来说当应用了FLOAT那么这个元素 ...

  10. javascript下用ActiveXObject控件替换word书签,将内容导出到word后打印第1/2页

    由于时间比较紧,没多的时候去学习研究上述工具包,现在用javascript操作ActiveXObject控件,用替换word模板中的书签方式解决. 最近有需求将数据导出到word里,然后编辑打印. 想 ...