当前位置: 首页 > news >正文

垃圾回收与内存泄漏

前端面试大全·JavaScript垃圾回收与内存泄漏

🌟经典真题

🌟什么是内存泄露

🌟JavaScript 中的垃圾回收

🌟标记清除

🌟引用计数

🌟真题解答

🌟总结


🌟经典真题

  • 请介绍一下 JavaScript 中的垃圾回收站机制

🌟什么是内存泄露

程序的运行需要内存。只要程序提出要求,操作系统或者运行时(runtime)就必须供给内存。

对于持续运行的服务进程(daemon),必须及时释放不再用到的内存。否则,内存占用越来越高,轻则影响系统性能,重则导致进程崩溃。

也就是说,不再用到的内存,如果没有及时释放,就叫做内存泄漏(memory leak)。

🌟JavaScript 中的垃圾回收

浏览器的 Javascript 具有自动垃圾回收机制(GCGarbage Collecation),也就是说,执行环境会负责管理代码执行过程中使用的内存。其原理是:垃圾收集器会定期(周期性)找出那些不在继续使用的变量,然后释放其内存

但是这个过程不是实时的,因为其开销比较大并且 GC 时停止响应其他操作,所以垃圾回收器会按照固定的时间间隔周期性的执行。

不再使用的变量也就是生命周期结束的变量,当然只可能是局部变量,全局变量的生命周期直至浏览器卸载页面才会结束。局部变量只在函数的执行过程中存在,而在这个过程中会为局部变量在栈或堆上分配相应的空间,以存储它们的值,然后在函数中使用这些变量,直至函数结束,而闭包中由于内部函数的原因,外部函数并不能算是结束。

下面是一段示例代码:

function fn1() {var obj = {name: 'zhangsan', age: 10};
}
function fn2() {var obj = {name:'zhangsan', age: 10};return obj;
}var a = fn1();
var b = fn2();

在上面的代码中,我们首先声明了两个函数,分别叫做 fn1 和 fn2

当 fn1 被调用时,进入 fn1 的环境,会开辟一块内存存放对象 {name: 'zhangsan', age: 10}。而当调用结束后,出了 fn1 的环境,那么该块内存会被 JavaScript 引擎中的垃圾回收器自动释放;

在 fn2 被调用的过程中,返回的对象被全局变量 b 所指向,所以该块内存并不会被释放。

这里问题就出现了:到底哪个变量是没有用的?

所以垃圾收集器必须跟踪到底哪个变量没用,对于不再有用的变量打上标记,以备将来收回其内存。

用于标记的无用变量的策略可能因实现而有所区别,通常情况下有两种实现方式:标记清除引用计数

引用计数不太常用,标记清除较为常用。

🌟标记清除

JavaScript 中最常用的垃圾回收方式就是标记清除。

当变量进入环境时,例如,在函数中声明一个变量,就将这个变量标记为“进入环境”。

从逻辑上讲,永远不能释放进入环境的变量所占用的内存,因为只要执行流进入相应的环境,就可能会用到它们。

而当变量离开环境时,则将其标记为“离开环境”。

function test(){var a = 10 ; // 被标记 ,进入环境 var b = 20 ; // 被标记 ,进入环境
}
test(); // 执行完毕 之后 a、b 又被标离开环境,被回收。

垃圾回收器在运行的时候会给存储在内存中的所有变量都加上标记(当然,可以使用任何标记方式)。

然后,它会去掉环境中的变量以及被环境中的变量引用的变量的标记(闭包)。而在此之后再被加上标记的变量将被视为准备删除的变量,原因是环境中的变量已经无法访问到这些变量了。

最后,垃圾回收器完成内存清除工作,销毁那些带标记的值并回收它们所占用的内存空间。

到目前为止,IE9+、Firefox、Opera、Chrome、Safari 的 JS 实现使用的都是标记清除的垃圾回收策略或类似的策略,只不过垃圾收集的时间间隔互不相同。

🌟引用计数

引用计数的含义是跟踪记录每个值被引用的次数。

当声明了一个变量并将一个引用类型值赋给该变量时,则这个值的引用次数就是 1。如果同一个值又被赋给另一个变量,则该值的引用次数加 1

相反,如果包含对这个值引用的变量又取得了另外一个值,则这个值的引用次数减 1。当这个值的引用次数变成 0 时,则说明没有办法再访问这个值了,因而就可以将其占用的内存空间回收回来。

这样,当垃圾回收器下次再运行时,它就会释放那些引用次数为 0 的值所占用的内存。

function test() {var a = {};	// a 指向对象的引用次数为 1var b = a;	// a 指向对象的引用次数加 1,为 2var c = a;	// a 指向对象的引用次数再加 1,为 3var b = {};	// a 指向对象的引用次数减 1,为 2
}

Netscape Navigator3 是最早使用引用计数策略的浏览器,但很快它就遇到一个严重的问题:循环引用

循环引用指的是对象 A 中包含一个指向对象B的指针,而对象 B 中也包含一个指向对象 A 的引用。

function fn() {var a = {};var b = {};a.pro = b;b.pro = a;
}
fn();

以上代码 a 和 b 的引用次数都是 2fn 执行完毕后,两个对象都已经离开环境,在标记清除方式下是没有问题的,但是在引用计数策略下,因为 a 和 b 的引用次数不为 0,所以不会被垃圾回收器回收内存,如果 fn 函数被大量调用,就会造成内存泄露。在 IE7 与 IE8 上,内存直线上升。

🌟真题解答

  • 请介绍一下 JavaScript 中的垃圾回收站机制

参考答案:

JavaScript 具有自动垃圾回收机制。垃圾收集器会按照固定的时间间隔周期性的执行。

JavaScript 常见的垃圾回收方式:标记清除引用计数方式。

1、标记清除方式:

  • 工作原理:当变量进入环境时,将这个变量标记为“进入环境”。当变量离开环境时,则将其标记为“离开环境”。标记“离开环境”的就回收内存。

  • 工作流程:

  • 垃圾回收器,在运行的时候会给存储在内存中的所有变量都加上标记;

  • 去掉环境中的变量以及被环境中的变量引用的变量的标记;

  • 被加上标记的会被视为准备删除的变量;

  • 垃圾回收器完成内存清理工作,销毁那些带标记的值并回收他们所占用的内存空间。

2、引用计数方式:

  • 工作原理:跟踪记录每个值被引用的次数。

  • 工作流程:

  • 声明了一个变量并将一个引用类型的值赋值给这个变量,这个引用类型值的引用次数就是 1

  • 同一个值又被赋值给另一个变量,这个引用类型值的引用次数加 1

  • 当包含这个引用类型值的变量又被赋值成另一个值了,那么这个引用类型值的引用次数减 1

  • 当引用次数变成 0 时,说明没办法访问这个值了;

  • 当垃圾收集器下一次运行时,它就会释放引用次数是 0 的值所占的内存。

🌟总结

本篇文章是关于JavaScript的一道面试题,后续还会持续更新HTML、CSS、JavaScript、Node.js、Vue.js、网络等前端相关面试题。如果文中出现有瑕疵的地方各位通过评论或者私信联系我,我们一起进步,有兴趣的伙伴可以关注订阅: 前端面试题大全  

相关文章:

垃圾回收与内存泄漏

前端面试大全JavaScript垃圾回收与内存泄漏 🌟经典真题 🌟什么是内存泄露 🌟JavaScript 中的垃圾回收 🌟标记清除 🌟引用计数 🌟真题解答 🌟总结 🌟经典真题 请介绍一下 Jav…...

SQL Server 2016(创建数据表)

1、需求描述。 在名为“class”的数据库中创建表,表名称为“course”,其中要包含序号、课程、课程编号、学分、任课教师、上课地点、开始时间、结束时间、备注等列。 设置各个字段的数据类型。其中,"序号"列为标识列,从…...

mysql配置文件低于8.0版本慎用(头部声明的路径请自行替换或删减)(干货)

[mysqld] character-set-server utf8mb4 collation-server utf8mb4_general_ci init_connectSET NAMES utf8mb4datadir/data/mysql/data socket/data/mysql/mysql.socklog-error/data/mysql/log/mysql_error.log pid-file/data/mysql/mysqld.pidserver_id1 #如果做集群不同my…...

给WordPress文章添加广告位

/* * WordPress 在文章内容中间插入广告//由www.wwttl.com提供学习 */ //在文章内容的第二段后面插入广告 add_filter( the_content, prefix_insert_post_ads ); function prefix_insert_post_ads( $content ) { $ad_code <div>广告代码放这里</div>;if ( is_sing…...

[GPT-1]论文实现:Improving Language Understanding by Generative Pre-Training

Efficient Graph-Based Image Segmentation 一、完整代码二、论文解读2.1 GPT架构2.2 GPT的训练方式Unsupervised pre_trainingSupervised fine_training 三、过程实现3.1 导包3.2 数据处理3.3 模型构建3.4 模型配置 四、整体总结 论文&#xff1a;Improving Language Understa…...

23种设计模式之C++实践(一)

23种设计模式之C++实践 1. 简介2. 基础知识3. 设计模式(一)创建型模式1. 单例模式——确保对象的唯一性1.2 饿汉式单例模式1.3 懒汉式单例模式比较IoDH单例模式总结2. 简单工厂模式——集中式工厂的实现简单工厂模式总结3. 工厂方法模式——多态工厂的实现工厂方法模式总结4.…...

华为OD机试 - 园区参观路径(Java JS Python C)

题目描述 园区某部门举办了Family Day,邀请员工及其家属参加; 将公司园区视为一个矩形,起始园区设置在左上角,终点园区设置在右下角; 家属参观园区时,只能向右和向下园区前进,求从起始园区到终点园区会有多少条不同的参观路径。 输入描述 第一行为园区的长和宽; 后…...

【ARM Trace32(劳特巴赫) 使用介绍 12 -- Trace32 常用命令之 d.dump | data.dump 介绍】

文章目录 Trace32 常用命令之 d.dump | data.dump 介绍1 字节显示 (Byte)4 字节显示&#xff08;word&#xff09;8 字节显示&#xff08;通常long&#xff09;十进制显示显示指定列数显示地址范围内的值 Trace32 常用命令之 d.dump | data.dump 介绍 在 TRACE32 调试环境中&a…...

【Git】Git撤销操作

记录一下&#xff0c;方便后续查找&#xff0c;不全&#xff0c;后续再做补充。 丢弃当前工作区未提交的修改 # 丢弃所有修改 git checkout .# 丢弃某个文件修改 git checkout 文件名丢弃本地已经提交的代码 &#xff08;1&#xff09;撤销最近一次提交 如果我们在最近一次提…...

改造python3中的http.server为简单的文件上传下载服务

改造 修改python3中的http.server.SimpleHTTPRequestHandler&#xff0c;实现简单的文件上传下载服务 simple_http_file_server.py&#xff1a; # !/usr/bin/env python3import datetime import email import html import http.server import io import mimetypes import os …...

Fiddler抓包工具之fiddler的composer可以简单发送http协议的请求

一&#xff0c;composer的详解 右侧Composer区域&#xff0c;是测试接口的界面&#xff1a; 相关说明&#xff1a; 1.请求方式&#xff1a;点开可以勾选请求协议是get、post等 2.url地址栏&#xff1a;输入请求的url地址 3.请求头&#xff1a;第三块区域可以输入请求头信息…...

14、pytest像用参数一样使用fixture

官方实例 # content of test_fruit.py import pytestclass Fruit:def __init__(self, name):self.name nameself.cubed Falsedef cube(self):self.cubed Trueclass FruitSalad:def __init__(self, *fruit_bowl):self.fruit fruit_bowlself._cube_fruit()def _cube_fruit(s…...

C++ Primer Plus第十三章笔记

目录 基类 构造函数&#xff1a;访问权限的考虑 1.2 派生类和基类之间的特殊关系 继承&#xff1a;is-a关系 多态公有继承 静态联编和动态联编 指针和引用类型的兼容性 虚成员函数和动态联编 虚函数的注意事项 构造函数 析构函数 友元 没有重新定义 重新定义将隐…...

【JavaEE】单例模式

作者主页&#xff1a;paper jie_博客 本文作者&#xff1a;大家好&#xff0c;我是paper jie&#xff0c;感谢你阅读本文&#xff0c;欢迎一建三连哦。 本文于《JavaEE》专栏&#xff0c;本专栏是针对于大学生&#xff0c;编程小白精心打造的。笔者用重金(时间和精力)打造&…...

第十五届蓝桥杯模拟赛(第二期 C++)

俺自己做的噢&#xff0c;还未核实答案&#xff0c;若有差错&#xff0c;望斧正。 第一题 小蓝要在屏幕上放置一行文字&#xff0c;每个字的宽度相同。小蓝发现&#xff0c;如果每个字的宽为 36 像素&#xff0c;一行正好放下 30 个字&#xff0c;字符之间和前后都没有任何空隙…...

关于Unity中字典在Inspector的显示

字典在Inspector的显示 方法一&#xff1a;实现ISerializationCallbackReceiver接口 《unity3D游戏开发第二版》记录 在编辑面板中可以利用序列化监听接口特性对字典进行序列化。 主要继承ISerializationCallbackReceiver接口 实现OnAfterDeserialize() OnBeforeSerialize() …...

使用Plex结合cpolar搭建本地私人媒体站并实现远程访问

文章目录 1.前言2. Plex网站搭建2.1 Plex下载和安装2.2 Plex网页测试2.3 cpolar的安装和注册 3. 本地网页发布3.1 Cpolar云端设置3.2 Cpolar本地设置 4. 公网访问测试5. 结语 1.前言 用手机或者平板电脑看视频&#xff0c;已经算是生活中稀松平常的场景了&#xff0c;特别是各…...

svn合并冲突时每个选项的含义

合并冲突时每个选项的含义 - 这个图片是 TortoiseSVN&#xff08;一个Subversion&#xff08;SVN&#xff09;客户端&#xff09;的合并冲突解决对话框。当你尝试合并两个版本的文件并且出现差异时&#xff0c;你需要解决这些差异。这个对话框提供了几个选项来处理合并冲突&…...

指针、数组与函数例题3

1、字符串复制 题目描述 设计函数实现字符串复制功能&#xff0c;每个字符串长度不超过100&#xff0c;不要使用系统提供的strcpy函数 输入要求 从键盘读入一个字符串到数组b中&#xff0c;以换行符结束 输出要求 将内容复制到另一个数组a中&#xff0c;并分别输出数组a和…...

ThreeJs样例 webgl_shadow_contact 分析

webgl_shadow_contact 官方样例中&#xff0c;对阴影的渲染比较特殊&#xff0c;很值得借鉴&#xff0c;学习渲染阴影的思路&#xff1b;这个例子中对阴影的渲染&#xff0c;并没有使用任何光源&#xff0c;没有用shadowmap的常规方式 渲染阴影&#xff1b;而是使用了深度材质T…...

绕过 Cloudflare 防护:Puppeteer 与 Node.js 的实战指南

1. 为什么需要绕过Cloudflare防护&#xff1f; 最近几年做自动化项目的开发者应该都深有体会&#xff0c;Cloudflare的安全防护越来越难对付了。我去年帮一个电商公司做价格监控系统时就踩过坑&#xff0c;他们的网站用了Cloudflare Turnstile防护&#xff0c;普通的爬虫根本过…...

收藏!程序员转行大模型必看:6高潜职业方向与学习资料包推荐

收藏&#xff01;程序员转行大模型必看&#xff1a;6高潜职业方向与学习资料包推荐 大模型技术引领行业变革&#xff0c;为程序员带来转行机遇。本文推荐6大高潜职业方向&#xff1a;自然语言处理工程师、计算机视觉工程师、大模型算法工程师、大模型部署工程师、大模型产品经理…...

绝地求生罗技鼠标宏配置全攻略:从零到精通的压枪优化指南

绝地求生罗技鼠标宏配置全攻略&#xff1a;从零到精通的压枪优化指南 【免费下载链接】logitech-pubg PUBG no recoil script for Logitech gaming mouse / 绝地求生 罗技 鼠标宏 项目地址: https://gitcode.com/gh_mirrors/lo/logitech-pubg 还在为《绝地求生》中的枪口…...

别再死记硬背BPSK公式了!用Python+NumPy手把手带你仿真2PSK信号生成与解调全过程

用Python实战BPSK&#xff1a;从信号生成到误码率分析的完整指南 通信工程专业的学生常常被各种调制公式搞得晕头转向&#xff0c;尤其是BPSK&#xff08;二进制相移键控&#xff09;这类基础但抽象的概念。今天&#xff0c;我们将彻底改变这种学习方式——通过Python代码和可视…...

想转行做产品经理?看看你身上有没有这5个“隐藏技能”

在数字经济飞速发展的当下&#xff0c;产品经理早已不是互联网行业的“专属岗位”&#xff0c;而是横跨互联网、硬件、金融、制造业等多个领域的核心角色——连接用户需求与技术实现&#xff0c;主导产品从创意到落地的全流程&#xff0c;被称为“CEO的学前班”。正因如此&…...

USB2.0供电那些事儿:为什么你的外设总是供电不足?

USB2.0供电困境解析&#xff1a;从原理到实践的全面解决方案 当你的移动硬盘突然断开连接&#xff0c;或者外接键盘间歇性失灵时&#xff0c;很可能正遭遇USB2.0供电不足的经典难题。这种看似简单的接口背后&#xff0c;隐藏着复杂的电力分配机制与设备兼容性博弈。本文将带你穿…...

AI如何助力人力资源管理:从效率工具到战略伙伴的跃迁

去年某互联网大厂HR负责人跟我说&#xff0c;他们团队用AI筛选简历后&#xff0c;招聘周期从45天缩短到28天&#xff0c;但更让他意外的是——AI还帮他们发现了一个被忽视3年的优质候选人。这个案例折射出AI对人力资源管理的深层改变&#xff1a;不只是提速&#xff0c;更是让H…...

告别数据丢失!GD32串口DMA双缓冲+内存对齐配置避坑指南

GD32串口DMA双缓冲与内存对齐实战&#xff1a;工业级数据零丢失方案 在工业自动化、高速数据采集等场景中&#xff0c;串口通信的稳定性和效率直接关系到整个系统的可靠性。当波特率提升到921600甚至更高时&#xff0c;传统的轮询或中断方式往往难以应对持续的数据流&#xff0…...

velocity-subtemplate-variable-fix

为什么你的 Velocity 子模板变量总是失效&#xff1f;一行代码解决了阅读前提&#xff1a;你正在用 Velocity 做模板引擎开发&#xff0c;主模板能正常渲染&#xff0c;但子模板里一用变量就报空指针或者路径找不到。先说我的血泪史 昨晚被一个问题折磨了两个小时&#xff1a; …...

C# : 引用类型都存在堆上吗

不完全是&#xff0c;这里要精确区分&#xff1a;引用类型的实例大多数存在堆上&#xff0c;但引用本身不一定在堆上。我们拆开来说&#xff1a;引用类型本身 vs 引用变量对象实例&#xff08;类的实例&#xff09;绝大多数情况下分配在 堆上由 垃圾回收器 管理生命周期引用变量…...