js高级进阶之内存管理

js是动态语言,并没有提供内存管理相关的的api操作,需要开发人员在写代码中规避或者预判处理相关内存问题,随着前端复杂度逐渐增高,前端开发者对于js内存管理要求逐渐加强,如果你想进阶高级那么必须对内存管理有所较深理解,本篇博文详细介绍js内存相关知识。

首先从js数据类型着手

js实际上有两种数据类型:
原始数据类型
字符串String、数字Number、布尔Boolean、数组Array、空对象Null、未定义Undifined、Symbol

引用数据类型
Object,array、function、date

内存空间:栈内存stack和堆内存heap

原始数据类型是保存在栈内存中,引用类型数据是保存在栈和堆内存中。

栈结构先进后出如下图

在这里插入图片描述
js是无法直接操作堆内存,是通过栈内存中引用堆内存地址来实现堆内存的访问如下图
在这里插入图片描述

当我们声明一个函数

var fn = function(){
	var i=10;
	var j=10;
	console.log(i+j);
}

时内存的情况是这样:首先在堆内存中开辟空间存入函数体字符串,然后在栈内存中存入变量fn 其值是堆内存的地址如下图:
在这里插入图片描述
引用类型具有如下几个特点:

  1. 引用类型可以添加属性和方法
  2. 引用类型的赋值是对象引用
  3. 引用类型的比较是引用的比较
  4. 引用类型是同时保存在栈区中和堆区中的,引用类型的存储需要在内存的栈区和堆区中共同完成,栈区保存变量标识符和指向堆内存的地址。

js的垃圾回收机制

原理
JS的垃圾回收机制是为了以防内存泄漏,内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着,垃圾回收机制就是间歇的不定期的寻找到不再使用的变量,并释放掉它们所指向的内存。在JS中,JS的执行环境浏览器会负责管理代码执行过程中使用的内存。

js变量的生命周期
当一个变量的生命周期结束之后它所指向的内存就应该被释放。JS有两种变量,全局变量和在函数中产生的局部变量。局部变量的生命周期在函数执行过后就结束了,此时便可将它引用的内存释放(即垃圾回收),但全局变量生命周期会持续到浏览器关闭页面。

浏览器如何检测变量实现垃圾回收

目前浏览器有两种检测js变量回收垃圾的机制,标记清除和引用计数

引用计数这种方式常常会引起内存泄漏,低版本的IE使用这种方式。机制就是跟踪一个值的引用次数,当声明一个变量并将一个引用类型赋值给该变量时该值引用次数加1,当这个变量指向其他一个时该值的引用次数便减一。当该值引用次数为0时就会被回收。当程序中出现循环引用时该方式会引起内存泄漏。

标记清除大部分浏览器以此方式进行垃圾回收,当变量进入执行环境(函数中声明变量)的时候,垃圾回收器将其标记为“进入环境”,当变量离开环境的时候(函数执行结束)将其标记为“离开环境”,在离开环境之后还有的变量则是需要被删除的变量。标记方式不定,可以是某个特殊位的反转或维护一个列表等。
垃圾收集器给内存中的所有变量都加上标记,然后去掉环境中的变量以及被环境中的变量引用的变量的标记。在此之后再被加上的标记的变量即为需要回收的变量,因为环境中的变量已经无法访问到这些变量。

全局执行环境:是个相对概念,浏览器中最外层环境是window对象node中是global对象,全局变量和全局函数都是在window上,同理某个模块或方法中的变量及方法都会在该环境执行完成后环境销销毁同时对应的变量和方法也销毁,顶层window对象会在浏览器页面关闭后才销毁。

局部环境栈:每个函数都有其自己的执行环境,当执行流到来时该函数会进入局部执行栈,执行完成后栈弹出,控制权返回原来(上层)的执行环境。

在这里插入图片描述

V8的内存管理机制

Google V8 引擎使用 C++ 代码编写,实现了 ECMAScript 规范的第五版,可以运行在所有的主流操作系统中,甚至可以运行在移动终端 ( 基于 ARM 的处理器,如 HTC G7 等 )。V8 最早被开发用以嵌入到 Google 的开源浏览器 Chrome 中,但是 V8 是一个可以独立的模块,完全可以嵌入您自己的应用,著名的 Node.js( 一个异步的服务器框架,可以在服务端使用 JavaScript 写出高效的网络服务器 ) 就是基于 V8 引擎的。

和其他 JavaScript 引擎一样,V8 会编译 / 执行 JavaScript 代码,管理内存,负责垃圾回收,与宿主语言的交互等。V8 的垃圾回收器采用了众多技术,使得其运行效率大大提高。通过暴露宿主对象 ( 变量,函数等 ) 到 JavaScript,JavaScript 可以访问宿主环境中的对象,并在脚本中完成对宿主对象的操作。

老生代和新生代垃是v8圾回收最重要的机制。

发布了69 篇原创文章 · 获赞 6 · 访问量 1880

猜你喜欢

转载自blog.csdn.net/weixin_40073115/article/details/103839210