从闭包函数的变量自增的角度 - 解析js垃圾回收机制

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
全局流量管理 GTM,标准版 1个月
云解析 DNS,旗舰版 1个月
简介:

前言

感觉每一道都可以深入研究下去,单独写一篇文章,包括不限于闭包,原型链,从url输入到页面展示过程,页面优化,react和vue的价值等等。

代码实现

const times = (()=>{
  var times = 0;
  return () => times++;
})()
console.log(
  times(),
  times(),
  times(),
  times()
) // 0,1,2,3,复制代码

原理

因为times变量一直被引用,没有被回收,所以,每次自增1。

更简单的实现方式,一行代码实现闭包

const times = ((times = 0)=> () => times++)()
console.log(
  times(),
  times(),
  times(),
  times()
) // 0,1,2,3复制代码

这并非闭包地专利, 变量放在闭包外部同样可以实现阻止变量地垃圾回收机制

let time = 0
const times = ()=>{
	let time = 10
	return function(){
		return time++
	} 
}// 根据JavaScript作用域链地规则,闭包内部没有,就从外面拿变量

const a = times();  // times函数只被执行了1次,产生了一个变量 time
console.log(
	a(),          // 而times返回的匿名函数却被执行了5次
	a(),          // 而times返回的匿名函数却被执行了5次
	a(),          // 而times返回的匿名函数却被执行了5次   其中的差别相差非常远
	a(),          // 而times返回的匿名函数却被执行了5次
	a()           // 而times返回的匿名函数却被执行了5次
) // 0,1,2,3复制代码

深入写下去之前,先放出类似的代码

同样的执行,我把函数执行时间放到了前面,自增失败

const times = ((times = 0)=> () => times++)()();  匿名函数只被执行了一次,同时返回函数再次执行一次
console.log(
  times,   // 得到匿名函数返回值, 函数只有配合()才会被执行一次么,此处
  times,   // 此处没有函数被执行
  times,   // 因此打印值为四个零
  times
); // 0,0,0,0复制代码

同样的执行,我把闭包函数执行时间放到了后面,同样自增失败

const times = ((times = 0)=> () => times++); time相当于声明式函数
console.log(
  times()(),    // 此处外部函数执行一次,产生times变量,返回的函数再执行一次times引用次数为0
  times()(),    // 此处外部函数执行一次,产生times变量,返回的函数再执行一次
  times()(),    // 此处外部函数执行一次,产生times变量,返回的函数再执行一次
  times()()
); // 0,0,0,0复制代码

函数[1,2,3,4,4].entires()会返回一个迭代器,一下代码同样实现了类似自增1的效果
image

const arr = [1,2,3,3,5,6,4,78].entries()
console.log(
  arr2.next().value,
  arr2.next().value,
  arr2.next().value,
  arr2.next().value,
  arr2.next().value
); // [0, 1], [1, 2], [2, 3], [3, 3], [4, 5]  迭代器返回值, 【index,value】复制代码

JavaScript辣鸡回收机制

按照JavaScript里垃圾回收的机制,是从root(全局对象)开始寻找这个对象的引用是否可达,如果引用链断裂,那么这个对象就会回收。换句话说,所有对象都是point关系。引用链就是所谓的指针关系。
当const的过程中,声明的那个函数会被压入调用栈,执行完毕,又没有其他地方引用它,那就会被释放。这个浏览器端,挺难的,但是在nodejs端,就可以用process.memoryUsage()调用查看内存使用情况。

{ 
  rss: 23560192,         // 所有内存占用,包括指令区和堆栈。
  heapTotal: 10829824,   // "堆"占用的内存,包括用到的和没用到的。
  heapUsed: 4977904,     // 用到的堆的部分。同时也是判断内存是否泄露的标准。
  external: 8608         // V8 引擎内部的 C++ 对象占用的内存。
}复制代码

如果你想要引用,又不想影响垃圾回收机制,那就用WeakMap,WeakSet这种弱引用吧,es6的新属性。

从引用次数来解释为什么变量times没有被回收

const timeFunc = ((time = 0)=> () => time++)
var b = timeFunc();   // time 变量引用次数+1,不能被回收
console.log(b());
console.log(b());
console.log(b());复制代码
// 真的非常神奇,需要满足2个条件
// 1.变量命名于返回函数外部,函数函数内部。
// 2.返回函数引用外部变量,导致外部变量无法触发垃圾回收机制。因为引用次数>1
let timeFunc = (time = 0)=>{
  return (() => time++)()
}
var b = timeFunc();  // b变量接受的是timeFunc返回的函数,由于返回函数内部有引用外部变量,故
console.log(b)
console.log(b)复制代码

JavaScript中的内存简介(如果缺少必须的基础知识,想要深入了解下去,也是比较难的吧)

像C语言这样的高级语言一般都有低级的内存管理接口,比如 malloc()和free()。另一方面,JavaScript创建变量(对象,字符串等)时分配内存,并且在不再使用它们时“自动”释放。 后一个过程称为垃圾回收。这个“自动”是混乱的根源,并让JavaScript(和其他高级语言)开发者感觉他们可以不关心内存管理。 这是错误的。

闭包的本质

JavaScript闭包的形成原理是基于函数变量作用域链的规则 和 垃圾回收机制的引用计数规则。
JavaScript闭包的本质是内存泄漏,指定内存不释放
(不过根据内存泄漏的定义是无法使用,无法回收来说,这不是内存泄漏,由于只是无法回收,但是可以使用,为了使用,不让系统回收)
JavaScript闭包的用处,私有变量,获取对应值等,。。

内存生命周期

不管什么程序语言,内存生命周期基本是一致的:

  • 分配你所需要的内存
  • 使用分配到的内存(读、写)
  • 不需要时将其释放\归还

在所有语言中第一和第二部分都很清晰。最后一步在底层语言中很清晰,但是在像JavaScript 等上层语言中,这一步是隐藏的、透明的。

为了不让程序员操心(真的是操碎了心),JavaScript自动完成了内存分配工作。

var n = 123;   // 给数值变量分配内存
var s = "azerty"; // 给字符串变量分配内存

var obj = {
	a: 1,
	b: null
};  // 给对象以及其包含的值分配内存

var arr = [1,null,"abra"]; // 给函数(可调用的对象)分配内存

function f(a){
	return a+2
} // 给函数(可调用对象)分配内存

// 为函数表达式也分配一段内存
document.body.addEventListener('scroll', function (){
	console.log('123')
},false)复制代码

有些函数调用之后会返回一个对象

var data = new Date();
var a = document.createElement('div');复制代码

有些方法是分配新变量或者新对象

var s1 = 'azerty';   // 由于字符串属于引用,所以JavaScript不会为他分配新的内存
var s2 = 's.substr(0,3)'; // s2是一个新的字符串

var a = ["ouais ouais", "nan nan"];
var a2 = ["generation", "nan nan"];
var a3 = a.concat(a2); 
// 新数组有四个元素,是 a 连接 a2 的结果复制代码

命名变量的过程其实是对内存的写入和释放

辣鸡回收

如上文所述,内存是否仍然被需要是无法判断的,下面将介绍垃圾回收算法以及垃圾回收的局限性

引用

辣鸡回收算法主要依赖于引用的概念。在内存管理的环境中,如果一个对象有访问另一个对象的权限,那么对于属性属于显示引用,对于原型链属于隐式引用。

引用计数垃圾收集

下面是最简单的垃圾回收算法。此算法把“对象是否被需要”简单定义为“该对象没有被其他对象引用到”。

var o = {
	a: {
		b: 2
	}
};
// 两个对象被创建,一个作为另一个的属性被引用,另一个被分配给变量o
// 很显然,没有一个可以被作为辣鸡收集

var o2 = o; // o2变量是第二个对“这个对象”

o = 1;   // 现在这个对象的原始引用o被o2替换了

var oa = o2.a; // 引用“这个对象”的a属性
                 // 现在,“这个对象”有两个引用了,一个是o2,一个是oa

o2 = 'yo';  // 最初的对象现在已经是零引用了
		// 它可以被垃圾回收了
		// 然而他的属性a还在被调用,所以不能回收

oa = null;	// a属性的那个对象现在也是零引用了
		// 它可以被垃圾回收了复制代码


原文发布时间:2018-6-20
原文作者: Object点assign
本文来源 掘金如需转载请紧急联系作者
相关文章
|
2月前
|
JavaScript 前端开发 Go
CSS 与 JS 对 DOM 解析和渲染的影响
【10月更文挑战第16天】CSS 和 JS 会在一定程度上影响 DOM 解析和渲染,了解它们之间的相互作用以及采取适当的优化措施是非常重要的。通过合理的布局和加载策略,可以提高网页的性能和用户体验,确保页面能够快速、流畅地呈现给用户。在实际开发中,要根据具体情况进行权衡和调整,以达到最佳的效果。
|
25天前
|
SQL 数据挖掘 测试技术
南大通用GBase8s数据库:LISTAGG函数的解析
南大通用GBase8s数据库:LISTAGG函数的解析
|
28天前
|
监控 算法 Java
Java虚拟机(JVM)的垃圾回收机制深度解析####
本文深入探讨了Java虚拟机(JVM)的垃圾回收机制,旨在揭示其背后的工作原理与优化策略。我们将从垃圾回收的基本概念入手,逐步剖析标记-清除、复制算法、标记-整理等主流垃圾回收算法的原理与实现细节。通过对比不同算法的优缺点及适用场景,为开发者提供优化Java应用性能与内存管理的实践指南。 ####
|
1月前
|
存储 JavaScript 前端开发
JavaScript的垃圾回收机制
【10月更文挑战第29天】JavaScript的垃圾回收机制是确保程序高效运行的重要保障,了解其工作原理和相关注意事项,有助于开发者更好地编写高性能、稳定的JavaScript代码。
|
2月前
|
存储 前端开发 JavaScript
JavaScript垃圾回收机制深度解析
【10月更文挑战第21】JavaScript垃圾回收机制深度解析
113 59
|
20天前
|
C语言 开发者
【C语言】断言函数 -《深入解析C语言调试利器 !》
断言(assert)是一种调试工具,用于在程序运行时检查某些条件是否成立。如果条件不成立,断言会触发错误,并通常会终止程序的执行。断言有助于在开发和测试阶段捕捉逻辑错误。
28 5
|
19天前
|
存储 监控 算法
Java虚拟机(JVM)垃圾回收机制深度解析与优化策略####
本文旨在深入探讨Java虚拟机(JVM)的垃圾回收机制,揭示其工作原理、常见算法及参数调优方法。通过剖析垃圾回收的生命周期、内存区域划分以及GC日志分析,为开发者提供一套实用的JVM垃圾回收优化指南,助力提升Java应用的性能与稳定性。 ####
|
1月前
|
JavaScript 前端开发 Java
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
本文介绍了JavaScript中常用的函数和方法,包括通用函数、Global对象函数以及数组相关函数。详细列出了每个函数的参数、返回值及使用说明,并提供了示例代码。文章强调了函数的学习应结合源码和实践,适合JavaScript初学者和进阶开发者参考。
42 2
[JS]同事:这次就算了,下班回去赶紧补补内置函数,再犯肯定被主管骂
|
26天前
|
机器学习/深度学习 自然语言处理 语音技术
揭秘深度学习中的注意力机制:兼容性函数的深度解析
揭秘深度学习中的注意力机制:兼容性函数的深度解析
|
1月前
|
前端开发 JavaScript 开发者
除了 Generator 函数,还有哪些 JavaScript 异步编程解决方案?
【10月更文挑战第30天】开发者可以根据具体的项目情况选择合适的方式来处理异步操作,以实现高效、可读和易于维护的代码。

推荐镜像

更多
下一篇
DataWorks