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)。
  • 理解引用行为:避免因共享引用导致的意外修改。
相关推荐
我命由我123454 小时前
CesiumJS 笔记 - 获取容器中心点、Cartesian3 clone 方法、修改 Cartesian3 对象的高度
前端·javascript·css·前端框架·html·html5·js
抱抱宝5 小时前
Agent-study项目教程(03):手写 Mini-ReAct Agent(不依赖框架)
javascript·人工智能·gpt·react.js·prompt·agent
用户938515635076 小时前
Next.js 笔记系统(二):Redis 数据服务与侧边栏组件拆分实战
javascript·全栈
WWJA王文举6 小时前
I²C通信完整流程详解:START、地址、ACK、数据、Repeated START和STOP一次讲透
c语言·开发语言
zhanghaha13147 小时前
Python进阶教程:6_JSON 数据解析 —— 新手完全指南
开发语言·python·json
qq_448011168 小时前
C语言中的动态内存分配
c语言·开发语言·php
汉字萌萌哒9 小时前
2024CSP-J入门级C++真题详解
开发语言·c++
arbboter9 小时前
【网络工具】NetProxy网络代理用户手册
开发语言·网络·c#·网络代理·网络异常·代理工具
Heo10 小时前
大厂前端调试不能只会debugger
前端·javascript·面试
汉字萌萌哒10 小时前
2019CCF-CSP入门级C++试题解析
java·开发语言·c++