基本数据类型一定存在栈内存?一起来看看!

前言

平时大家都说基本数据类型存在栈内存,引用数据类型存在堆内存,这个说法完全对么?我们一起来看看吧。

因为栈内存是由浏览器引擎直接操作分配的,所以我们不能直观的去观察到栈内存的变化。但是我们可以通过浏览器控制台的memory观察堆内存的变化来曲线救国。

下面是测试代码

csharp 复制代码
  // 对象
  const obj = {
    a: 1,
    b:'b',
    c: 1.1
  }
  // 整数
  const int = 100
  // 浮点数
  const intFloat = 100.0
  const float = 100.1
  // 八进制
  const octalNumber = 0o144
  // 十六进制
  const hexNumber = 0x64
  // 科学计数法
  const scientificNumber = 1e2
  // 字符串,这里会不断声明全局变量来赋值,方便我们观察
  s0 = 's'
  for (let index = 1; index <= 50; index++) {
      window['s' + index] =   window['s' + (index-1)] + 's'
  }

null、undefined、boolean这几个类型存在栈中,没有争议,所以我们不做测试。

对象是引用数据类型,存放在堆内存中是没有争议的

浮点数和整数在堆内存中存储有一点区别的,他们的类型是不太一样的,一个是smi number,一个是heap number。这应该是浏览器针对number类型做优化所用到的,这里不做深入(有了解的大佬可以科普下)。

Number类型

可以看到只有浮点数100.1可以找到,而且100.0也没有找到,所以浏览器会试图将浮点数转为整数来存储。转换成功则直接存在栈里,转换失败则存放在堆内存中。

关于浮点数为何存储在堆内存中的猜测:

浮点数一般具有较高精度,并且浮点数运算需要更加复杂的数据结构和算法。所以不管是存储还是运算都会占用较多内存空间,所以浏览器默认会将浮点数存放在堆内存中方便处理,并节省栈内存空间(该猜测是结合chatGPT3.5的回答总结)。

String类型

可以看到从第12次拼接开始,所有变量的值都会存在堆内存中。还可以看到每个值都有first和second属性,分别是指向拼接用到的两个字符串的地址。并且运算用的值都是已存在的值,将结果存在新的内存空间(@82781、@17385这些便是值存在内存中的地址)。

关于部分字符串为何存储在堆内存中的猜测:

长字符串会放在堆内存中,具体阈值跟浏览器内存管理策略、引擎优化有关。

结论

所以我们都在堆内存找到了这些数字或者字符串,你还认为它存在栈内存中嘛?

相关推荐
老前端的功夫几秒前
TypeScript 类型守卫:从编译原理到高级模式
前端·javascript·架构·typescript
未来之窗软件服务11 分钟前
幽冥大陆(七十二) 东方仙盟-在线IP归属地自己封装—东方仙盟练气期
前端·javascript·tcp/ip·仙盟创梦ide·东方仙盟·阿雪技术观
QT 小鲜肉25 分钟前
【Linux命令大全】001.文件管理之mc命令(实操篇)
linux·运维·服务器·前端·笔记
ttod_qzstudio30 分钟前
备忘录之事件监听器绑定陷阱:为什么 .bind(this) 会移除失败?
javascript·typescript·内存泄漏·事件监听
土豆_potato32 分钟前
AI深度思考到底开不开
前端·aigc
ohyeah32 分钟前
React 中的跨层级通信:使用 Context 实现主题切换功能
前端·react.js
winfredzhang1 小时前
打造专属桌面时钟:纯HTML实现的全功能动态时钟
前端·html·农历·生肖·周次
哥本哈士奇1 小时前
使用Gradio构建AI前端 - RAG的QA模块
前端·人工智能·状态模式
扶我起来还能学_1 小时前
Vue3 proxy 数据响应式的简单实现
前端·javascript·vue
Dragon Wu2 小时前
前端项目架构 项目格式化规范篇
前端·javascript·react.js·前端框架