js基础:(1)js内存空间、深度拷贝

2017-02-13  本文已影响0人  西线风景

1 预备知识


1.1 对计算机内存机制有一定的理解,知道堆和栈的概念。

1.2 对js的数据类型有一定了解。

基本数据类型例如
var a1=0;
a1作为变量名,0作为变量具体值,在栈中以简单数据段存储。

Object类型

var b=[1,2,3]; var c={ m:12, n:‘w’ };

b、c作为变量名,在栈内存中以简单数据段存储,并存储其对应具体对象内容的地址即指针。

其存储关系如下图所示:

js中数据内存空间示意

2 js拷贝问题

在实际应用中常见的问题出在,需要多处使用对象引用值的时候。如下示例:

let a1,a2,a3; a1=[1,2,3]; a2=a1; a3=a1; a3[1]=0;

虽然只是a3作了修改,但实际上a1,a2,a3的值都将变为[1,0,3]。
此时应使用深拷贝

2.1 浅拷贝-即变量赋值

结合1.2节的例子,

var a1=0; var s=a1; var b=[1,2,3]; var p=b;

基本数据类型和对象引用浅拷贝示意

由上图可以看出,基本数据类型s会在占内存中分配一个空间,存入变量与对应的值。而对象则是在栈中开辟一个空间,复制的是对象的指针,实际对象的内容对应的是同一个。所以一旦改动p,b的数据值也会被改变。

2.2 深拷贝基本实现

思路:递归调用浅拷贝

typeof()函数-判断数据类型

`
typeof(true) //boolean
typeof(1) //number
typeof(1) //string
typeof({}) //object
typeof([]) //object

typeof(null) //object
typeof(function(){}) //function
“str23”.constructor === String
“str23”.constructor .name==="string"
[].constructor === Array
`

深拷贝实现js代码(主要针对数组和对象形式的

function deepCopy(p, c) {     var c = c || ((p.constructor === Array) ? [] : {});    for (var i in p) {       if (typeof p[i] === 'object') {         c[i] = (p[i].constructor === Array) ? [] : {};         deepCopy(p[i], c[i]);       } else {          c[i] = p[i];       }     }     return c;   } var a = [1, 2, 3]; var a2 = { xx: [1, 2, 3], yy: 2 }; var b = []; var c = deepCopy(a2); console.log(deepCopy(a), c); //运行结果[ 1, 2, 3 ] { xx: [ 1, 2, 3 ], yy: 2 }

上一篇 下一篇

猜你喜欢

热点阅读