前端技术文档前端技术文档
前端技术文档
  • HTML 文档
  • CSS 文档
  • JavaScript 文档
  • Browser 文档
  • Environment 文档
  • IMGProcess 文档
  • Interview 文档
前端技术文档
  • HTML 文档
  • CSS 文档
  • JavaScript 文档
  • Browser 文档
  • Environment 文档
  • IMGProcess 文档
  • Interview 文档
  • JavaScript 文档
  • JavaScript变量提升
  • JS事件流模型
  • JS中this的指向
  • Js异步机制
  • JavaScript闭包
  • Js严格模式
  • Js中==与===
  • Js箭头函数
  • Js中Array对象
  • Js中Date对象
  • Js中Math对象
  • Js中Number对象
  • Js中String对象
  • Js中Symbol对象
  • Js中RegExp对象
  • Js中Proxy对象
  • Js中Reflect对象
  • Js中fetch方法
  • Js创建对象的方式
  • Js数组操作
  • Js实现数组排序
  • Js实现链表操作
  • Js实用小技巧
  • Js将字符串转数字的方式
  • Js捕获异常的方法
  • Js文件异步加载
  • Js模块化导入导出
  • Js模块化开发的理解
  • Js的GC机制
  • Js中的位操作符
  • Js中的逻辑运算符
  • Js中的堆栈
  • Js中数组空位问题
  • ES6新特性
  • Function与Object
  • Generator函数
  • Js选择器
  • JSON WEB TOKEN
  • Js中Currying的应用

Js中的堆栈

堆heap是动态分配的内存,大小不定也不会自动释放,栈stack为自动分配的内存空间,在代码执行过程中自动释放。

栈区

在栈内存中提供一个供Js代码执行的环境,关于作用域以及函数的调用都是栈内存中执行的。
Js中基本数据类型String、Number、Boolean、Null、Undefined、Symbol,占用空间小且大小固定,值直接保存在栈内存中,是按值访问,对于Object引用类型,其指针放置于栈内存中,指向堆内存的实际地址,是通过引用访问。
关于调用栈,每调用一个函数,解释器就会把该函数添加进调用栈并开始执行;正在调用栈中执行的函数还调用了其它函数,那么新函数也将会被添加进调用栈,一旦这个函数被调用,便会立即执行;当前函数执行完毕后,解释器将其清出调用栈,继续执行当前执行环境下的剩余的代码;当分配的调用栈空间被占满时,会引发堆栈溢出错误。

// Console调试
var a = 1;
function s(){
    var b = 11;
    debugger; // 断点
}
function ss(){
    s();
}
ss();
/*
...
Call Stack
> s (VM383:4)
  ss (VM383:7)
  (anonymous) (VM383:9)
Scope
  Local
    b: 11
    this: Window
  Global Window
    ...
...
*/

堆区

引用类型Object的变量占据空间大且大小不固定,堆内存中存储实际对象,在栈内存中存储对象的指针,对于对象的访问是按引用访问的,在堆区的内存不会随着程序的运行而自动释放,这就需要实现垃圾回收机制GC,需要注意的是在Js中没有类似于C中的free()函数去手动释放内存,对于堆区内存回收全部需要通过Js的垃圾回收机制去实现。
在栈区中执行的变量等是通过值访问,当其作用域销毁后变量也就随之销毁,而使用引用访问的堆区变量,在一个作用域消失后还可能在外层作用域或者其他作用域仍然存在引用,不能直接销毁,此时就需要通过算法计算该堆区变量是否属于不再需要的变量,从而决定是否需要进行内存回收,在Js中主要有引用计数与标记清除两种垃圾回收算法。

每日一题

https://github.com/WindrunnerMax/EveryDay

参考

https://www.zhihu.com/question/42231657
https://segmentfault.com/a/1190000009693516
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Memory_Management
Prev
Js中的逻辑运算符
Next
Js中数组空位问题