理解Javascript_01_理解内存分配原理分析

原始值和引用值
在ECMAScript中，变量可以存放两种类型的值，即原始值和引用值。
原始值指的就是代表原始数据类型（基本数据类型）的值，即Undefined,Null,Number,String,Boolean类型所表示的值。
引用值指的就是复合数据类型的值，即Object,Function,Array,以及自定义对象,等等

栈和堆
与原始值与引用值对应存在两种结构的内存即栈和堆
栈是一种后进先出的数据结构，在javascript中可以通过Array来模拟栈的行为


代码如下:

var arr = []; //创建一个栈
arr.push("apple");//压入元素"apple" ["apple"]
arr.push("orange");//压入元素"orange" ["apple","orange"]
arr.pop();//弹出"orange" ["apple"]
arr.push("banana");//压入元素"banana" ["apple","banana"]

我们来看一下，与之对应的内存图：

原始值是存储在栈中的简单数据段，也就是说，他们的值直接存储在变量访问的位置。
堆是存放数据的基于散列算法的数据结构，在javascript中，引用值是存放在堆中的。
引用值是存储在堆中的对象，也就是说，存储在变量处的值(即指向对象的变量，存储在栈中）是一个指针，指向存储在堆中的实际对象.
例：var obj = new Object(); obj存储在栈中它指向于new Object()这个对象，而new Object()是存放在堆中的。
那为什么引用值要放在堆中，而原始值要放在栈中，不都是在内存中吗，为什么不放在一起呢?那接下来，让我们来探索问题的答案！
首先，我们来看一下代码：


代码如下:

function Person(id,name,age){
this.id = id;
this.name = name;
this.age = age;
}
var num = 10;
var bol = true;
var str = "abc";
var obj = new Object();
var arr = ['a','b','c'];
var person = new Person(100,"jxl",22);

然后我们来看一下内存分析图：

变量num,bol,str为基本数据类型，它们的值，直接存放在栈中，obj,person,arr为复合数据类型，他们的引用变量存储在栈中，指向于存储在堆中的实际对象。

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

现在让我们来回答为什么引用值要放在堆中，而原始值要放在栈中的问题：

记住一句话：能量是守衡的，无非是时间换空间，空间换时间的问题

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

总结：

程序很简单，但它是一切的根本，基础是最重要的，因为摩天大厦也是一块砖一块瓦的搭建起来的。
内存是程序执行的根本，搞懂了内存，就等于搞懂了一切。
心血之作，鼓励一下自已，加油！

参考：
JavaScript高级程序设计

赞 (0)

相关推荐

  • javascript内存分配原理实例分析

    javascript内存分配原理实例分析

    本文实例讲述了javascript内存分配原理.分享给大家供大家参考,具体如下: JavaScript中的变量分为两种,原始值和引用值.原始值指的是原始数据类型的值,比如undefined,null,number,string,boolean类型所表示的值.引用值指的是复合数据类型的值,即Object,Function,Array等. 原始值和引用值存储在内存中的位置分别为栈和堆.原始值是存储在栈中的简单数据段,他们的值直接存储在变量访问的位置.引用值是存储在堆中的对象. 存储在栈中的值是一个指

  • JavaScript也谈内存优化

    JavaScript也谈内存优化

    相对C/C++ 而言,我们所用的JavaScript 在内存这一方面的处理已经让我们在开发中更注重业务逻辑的编写.但是随着业务的不断复杂化,单页面应用.移动HTML5 应用和Node.js 程序等等的发展,JavaScript 中的内存问题所导致的卡顿.内存溢出等现象也变得不再陌生. 这篇文章将从JavaScript 的语言层面进行内存的使用和优化的探讨.从大家熟悉或略有耳闻的方面,到大家大多数时候不会注意到的地方,我们一一进行剖析. 1. 语言层面的内存管理 1.1 作用域 作用域(scope

  • js变量、作用域及内存详解

    js变量、作用域及内存详解

    基本类型值有:undefined,NUll,Boolean,Number和String,这些类型分别在内存中占有固定的大小空间,他们的值保存在栈空间,我们通过按值来访问的. (1)值类型:数值.布尔值.null.undefined. (2)引用类型:对象.数组.函数. 如果赋值的是引用类型的值,则必须在堆内存中为这个值分配空间.由于这种值的大小不固定(对象有很多属性和方法),因此不能把他们保存到栈内存中.但内存地址大小是固定的,因此可以将内存地址保存在栈内存中. <script type="

  • JavaScript的内存释放问题详解

    本文详细的讲解了JavaScript及IE浏览器对内存的管理和释放的时机和方法,希望对前端开发人员有所帮助. 一个内存释放的实例 复制代码 代码如下: <SCRIPT LANGUAGE="JavaScript"> <!-- strTest = "1"; for ( var i = 0; i < 25; i ++ ) { strTest += strTest; } alert(strTest); delete strTest; CollectG

  • js 内存释放问题

    CollectGarbage(); setTimeout("CollectGarbage();", 1); 这里之所以使用setTimeout(),因为可以彻底回收当前所有对象,防止变量之间的引用导致释放失败,可以当作一个保障措施,按照道理来说,这里不会执行了. 使用的时候需要注意,一定在所有函数执行完毕之后执行,否则,setTimeout()和setIntervalue()等东东都将无法正常工作了. 另外,切忌胡乱使用,一般来说,顶级对象致空"var xxx='ss';xx

  • JavaScript 变量、作用域及内存

    JS变量是松散型的(不强制类型)本质,决定了它只是在特定时间用于保存特定值的一个名字而已; 由于不存在定义某个变量必须要保存何种数据类型值的规则,变量的值及其数据类型可以在脚本的生命周期内改变; 一 变量及作用域 1.基本类型和引用类型 // JS变量包含两种不同的数据类型的值:基本类型值和引用类型值; // 1.基本类型值:保存在栈内存中的简单数据段;即这种值完全保存在内存中的一个位置; // 基本类型值包含:Undefined|Null|Boolean|Number|String; // 这

  • JavaScript对内存分配及管理机制详细解析

    你可能听说过JAVA..NET.PHP这些语言有垃圾回收的内存管理机制,但是很少会听到JavaScript也有自己的内存管理机制,JavaScript同样有着类似的垃圾回收功能.本文主要讲述了JavaScript的垃圾回收原理和具体的过程. 简介在底层语言中,比如C,有专门的内存管理机制,比如malloc() 和 free().而Javascript是有垃圾回收(garbage collection)机制的,也就是说JS解释器会自动分配和回收内存.这样就有人觉得,我用的是高级语言,就不用关心内存

  • JavaScript内存管理介绍

    简介 低级语言,比如C,有低级的内存管理基元,想malloc(),free().另一方面,JavaScript的内存基元在变量(对象,字符串等等)创建时分配,然后在他们不再被使用时"自动"释放.后者被称为垃圾回收.这个"自动"是混淆并给JavaScript(和其他高级语言)开发者一个错觉:他们可以不用考虑内存管理. 内存生命周期 不管什么程序语言,内存生命周期基本一致: 1.分配你所需要的内存 2.使用它(读.写) 3.当它不被使用时释放   ps:和"把

  • 深入理解JavaScript程序中内存泄漏

    深入理解JavaScript程序中内存泄漏

    垃圾回收解放了我们,它让我们可将精力集中在应用程序逻辑(而不是内存管理)上.但是,垃圾收集并不神奇.了解它的工作原理,以及如何使它保留本应在很久以前释放的内存,就可以实现更快更可靠的应用程序.在本文中,学习一种定位 JavaScript 应用程序中内存泄漏的系统方法.几种常见的泄漏模式,以及解决这些泄漏的适当方法. 一.简介 当处理 JavaScript 这样的脚本语言时,很容易忘记每个对象.类.字符串.数字和方法都需要分配和保留内存.语言和运行时的垃圾回收器隐藏了内存分配和释放的具体细节. 许

  • 跟我学习JScript的Bug与内存管理

    1.JScript的Bug IE的ECMAScript实现JScript严重混淆了命名函数表达式,搞得现很多人都出来反对命名函数表达式,而且即便是现在还一直在用的一版(IE8中使用的5.8版)仍然存在下列问题. 下面我们就来看看IE在实现中究竟犯了那些错误,俗话说知已知彼,才能百战不殆.我们来看看如下几个例子: 例1:函数表达式的标示符泄露到外部作用域 var f = function g(){}; typeof g; // "function" 前面我们说过,命名函数表达式的标示符在

  • js内存泄露的几种情况详细探讨

    内存泄露是指一块被分配的内存既不能使用,又不能回收,直到浏览器进程结束.在C++中,因为是手动管理内存,内存泄露是经常出现的事情.而现在流行的C#和Java等语言采用了自动垃圾回收方法管理内存,正常使用的情况下几乎不会发生内存泄露.浏览器中也是采用自动垃圾回收方法管理内存,但由于浏览器垃圾回收方法有bug,会产生内存泄露. 1.当页面中元素被移除或替换时,若元素绑定的事件仍没被移除,在IE中不会作出恰当处理,此时要先手工移除事件,不然会存在内存泄露. 复制代码 代码如下: <div id="

  • JavaScript 事件对内存和性能的影响

    虽说事件处理程序可以为现代 Web 页面添加很强的交互能力,但是不分青红皂白就添加大量的事件处理程序绝对是一种愚蠢的行为. 我们来分析一下:事件处理程序本质上是一种函数,是一种对象,存放在内存中,设置大量的事件处理程序会使内存中的对象变多,Web 程序的性能会变得越来越差,用户体验很不好. 为了更好地利用好事件处理程序,便出现了事件委托,用来提升性能. 事件委托 事件委托(event delegation):把若干个子节点上的相同事件的处理函数绑定到它的父节点上去,在父节点上统一处理从子节点冒泡

随机推荐