关于javascript内存分配

1.关于原始值和引用值 

在ECMAScript中，变量可以存放两种类型的值，即原始值和引用值。 
原始值指的就是代表原始数据类型（基本数据类型）的值，即Undefined,Null,Number,String,Boolean类型所表示的值。 

引用值指的就是复合数据类型的值，即Object,Function,Array,以及自定义对象,等等 

原始值是存储在栈中的简单数据段，也就是说，他们的值直接存储在变量访问的位置。 
堆是存放数据的基于散列算法的数据结构，在JavaScript中，引用值是存放在堆中的。 
引用值是存储在堆中的对象，也就是说，存储在变量处的值(即指向对象的变量，存储在栈中）是一个指针，指向存储在堆中的实际对象. 
例：var obj = new Object(); obj存储在栈中它指向于new Object()这个对象，而new Object()是存放在堆中的。 

2.内存分配

代码：

 

[javascript] view plain copy
 
 在CODE上查看代码片派生到我的代码片
  1. function Person(id,name,age){   
  2. this.id = id;   
  3. this.name = name;   
  4. this.age = age;   
  5. }   
  6. var num = 10;   
  7. var bol = true;   
  8. var str = "abc";   
  9. var obj = new Object();   
  10. var arr = ['a','b','c'];   
  11. var person = new Person(100,"jxl",22);   

内存分配：

 

由上图可知，我们无法直接操纵堆中的数据，也就是说我们无法直接操纵对象，但我们可以通过栈中对对象的引用来操作对象，就像我们通过遥控机操作电视机一样，区别在于这个电视机本身并没有控制按钮。

堆比栈大，栈比堆的运算速度快,对象是一个复杂的结构，并且可以自由扩展，如：数组可以无限扩充，对象可以自由添加属性。将他们放在堆中是为了不影响栈的效率。而是通过引用的方式查找到堆中的实际对象再进行操作。相对于简单数据类型而言，简单数据类型就比较稳定，并且它只占据很小的内存。不将简单数据类型放在堆是因为通过引用到堆中查找实际对象是要花费时间的，而这个综合成本远大于直接从栈中取得实际值的成本。所以简单数据类型的值直接存放在栈中。 

3.相关分析

栈的优势就是存取速度比堆要快，仅次于直接位于CPU中的寄存器，但缺点是，存在栈中的数据大小与生存期必须是确定的，缺乏灵活性。堆的优势是可以动态地分配内存大小，生存期也不必事先告诉编译器，垃圾收集器会自动地收走这些不再使用的数据，但是缺点是由于在运行时动态分配内存，所以存取速度较慢。

所以相对于简单数据类型而言，他们占用内存比较小，如果放在堆中，查找会浪费很多时间，而把堆中的数据放入栈中也会影响栈的效率。比如对象和数组是可以无限拓展的，正好放在可以动态分配大小的堆中。

 

4.代码验证

testObj.jsp

 

[html] view plain copy
 
 在CODE上查看代码片派生到我的代码片
  1. <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>  
  2. <%  
  3. String path = request.getContextPath();  
  4. String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";  
  5. %>  
  6.   
  7. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
  8. <html>  
  9.   <head>  
  10.     <base href="<%=basePath%>">  
  11.       
  12.     <title>My JSP 'inlineBinding.jsp' starting page</title>  
  13.       
  14.     <meta http-equiv="pragma" content="no-cache">  
  15.     <meta http-equiv="cache-control" content="no-cache">  
  16.     <meta http-equiv="expires" content="0">      
  17.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">  
  18.     <meta http-equiv="description" content="This is my page">  
  19.     <!-- 
  20.     <link rel="stylesheet" type="text/css" href="styles.css"> 
  21.     -->  
  22. <script type="text/javascript">  
  23. //对象在内存中的表现形式  
  24. //对象名存储在栈内存中，同时存在的还有一个指向堆内存的访问地址（如果对象有属性不为空）  
  25. //在堆内存中存储的是对象的各属性的取值  
  26. //需要说明的是值类型的数据直接存储在栈内存中  
  27. function Person(){  
  28.       
  29. }  
  30. //开辟栈内存  
  31. var p1 = new Person();  
  32. //开辟堆内存  
  33. p1.name = 'zhangsan';  
  34. p1.age = 20;  
  35. //开辟栈内存  
  36. var p2 = new Person();  
  37. //堆内存指向为空  
  38. alert(p2.name);//undefined  
  39. //p2堆内存  
  40. p2 = p1;  
  41. alert(p2.name);//zhangsan  
  42. //清除栈内存  
  43. //p2 = null;  
  44. //访问堆内存  
  45. //alert(p1.name);//zhangsan  
  46. //清除栈内存  
  47. p1 = null;  
  48. //访问堆内存  
  49. alert(p2.name);//zhangsan  
  50.   
  51. </script>  
  52.   </head>  
  53.     
  54.   <body>  
  55. </body>  
  56. </html>  

以上即为javascript内存分配的简单介绍，需要在实际使用中仔细体会。

posted @ 2017-01-10 14:45  天涯海角路  阅读(109)  评论(0)    收藏  举报