js中哪些数据在栈上,哪些数据在堆上?

在 JavaScript 中,数据的存储位置(堆或栈)取决于其类型。

1,栈(Stack)存储的数据

栈用于存储**原始类型(Primitive Types)**的值,这些值大小固定且直接存储在栈中,访问速度快。包括:

  • Number (数字):如 423.14
  • String (字符串):如 "张三"
  • Boolean (布尔值):如 truefalse
  • Undefined :如 undefined
  • Null :如 null
  • Symbol (ES6+):如 Symbol('id')

特点:按值访问,直接操作存储的值,赋值时创建副本,互不影响。

javascript 复制代码
let a = 10;
let b = a; // b 是 a 的副本
a = 20;
console.log(b); // 仍为 10

2,堆(Heap)存储的数据

堆用于存储**引用类型(Reference Types)**的值,这些值大小不固定,存储在堆中,栈中仅保存指向堆的地址(引用)。包括:

  • Object (对象):如 { name: "李四" }
  • Array (数组):如 [1, 2, 3]
  • Function (函数):如 function() {}
  • DateRegExpMapSet 等内置对象。

特点:按引用访问,操作的是堆中的对象引用,赋值时共享同一对象,修改时会互相影响。

javascript 复制代码
    let obj1 = { name: "张三" };
    let obj2 = obj1; // obj2 和 obj1 指向同一个堆对象
    obj1.name = "李四";
    console.log(obj2.name); // 输出 "李四"

3,特殊情况与注意事项

  1. 字符串的存储
    • 短字符串(如常量)可能被优化存储在栈中(引擎实现依赖)。
    • 长字符串或动态生成的字符串通常存储在堆中。
  2. 闭包变量
    • 闭包中的变量可能被提升到堆中(如 V8 引擎的优化行为),以避免被栈销毁。
  3. 引擎优化
    • 现代 JS 引擎(如 V8、SpiderMonkey)会动态优化存储方式,例如对小对象进行内联缓存(Inline Caching)或隐藏类(Hidden Class)优化。

4,总结对比表

数据类型 存储位置 访问方式 赋值行为
原始类型(Number等) 按值访问 创建副本,互不影响
引用类型(Object等) 按引用访问 共享同一对象,修改互相影响

5,为什么要区分栈和堆?

  • 性能:栈访问快,但空间有限;堆空间大,但访问稍慢。
  • 内存管理:栈自动释放(函数调用结束时),堆需依赖垃圾回收(GC)。
  • 理解引用行为:避免因共享引用导致的意外修改。
相关推荐
冰暮流星12 小时前
javascript之date对象
开发语言·javascript·ecmascript
橘子星12 小时前
别光看教程!手把手拆解 React Todo 项目,一文吃透 5 个核心概念
前端·javascript
蜡台12 小时前
使用 uni-popup 实现数据选择器Data-Picker
前端·javascript·html·uniapp·uni-popup·data-picker
blns_yxl13 小时前
Promise封装Fetch + 重试机制(HTML+JS)
前端·javascript·html
Wang's Blog13 小时前
Go-Zero项目开发17: IM私聊功能实现与消息存储设计
开发语言·后端·golang
无巧不成书021813 小时前
Vue+Vue-CLI全平台零基础搭建教程
前端·javascript·vue.js·vue·前端开发·vue-cli·前端环境搭建
Ulyanov13 小时前
Python雷达电子对抗仿真引擎(一):打破单体瓶颈,构建微服务与ECS架构的顶层设计
开发语言·python·微服务·云原生·架构·雷达电子对抗
IT方大同13 小时前
C语言分支与循环语句
c语言·开发语言·算法