javascript中的数据类型以及存储上的区别

前言

在 JavaScript 中,主要有 8 种数据类型 ,可以分为两类:基本类型(原始类型)引用类型。每种类型在存储上有一些差别,下面是详细介绍。

1. 基本类型(原始类型 / Primitive Types)

基本类型的值直接存储在栈内存中,访问它们时是按值访问的(按值存储),它们不可变,即每次操作都会返回新值。

  1. Number(数字)

    • 用于表示整数和浮点数,所有数字在 JavaScript 中都使用 IEEE 754 64 位浮点数格式存储。
    • 特殊数值:NaN(非数字)、Infinity(正无穷)和 -Infinity(负无穷)。
  2. String(字符串)

    • 表示文本数据,字符串是不可变的,每次对字符串的操作都会生成新的字符串对象。
    • 在存储中,字符串是以 UTF-16 编码格式存储的,每个字符占用 2 字节。
  3. Boolean(布尔值)

    • 只有两个值:truefalse,通常用于逻辑判断。
    • 布尔值在内存中占用 1 位。
  4. Undefined

    • 当变量声明了但未赋值时,其默认值就是 undefined
    • 这种类型通常是占位符,代表"未定义的"状态。
  5. Null

    • 表示"空"或"无值",在逻辑上被视为一个空对象引用。
    • 注意,nullundefined 有区别,null 是明确赋值的空对象,而 undefined 是未定义。
  6. Symbol

    • ES6 新增的类型,用来生成唯一的标识符,常用于对象的属性。
    • 每个 Symbol 都是唯一的,尽管两个 Symbol() 表面上看起来相同,但它们在内存中存储的引用是不同的。
  7. BigInt

    • ES2020 引入的类型,用于表示任意精度的大整数。
    • 它通过在数字后加 n 来表示,如:12345678901234567890n
存储上的差别
  • 基本类型 通常存储在栈内存中,因为它们的大小是固定的,系统可以快速分配内存和访问。
  • 不可变:例如,修改字符串时,旧的字符串不会被更改,而是生成一个新的字符串。
  • 每个基本类型值都有自己独立的存储区域,不会共享存储。

2. 引用类型(Reference Types)

引用类型是指对象和函数,存储的是对象在内存中的地址(引用),这些引用存储在栈内存中,而真正的数据存储在堆内存中。

  1. Object(对象)

    • 对象是键值对的集合,键是字符串(Symbol 也可以),值可以是任意类型,包括对象、函数等。
    • 存储方式:对象的引用存储在栈中,而对象的实际内容存储在堆中。
  2. Array(数组)

    • 数组也是一种特殊的对象,用于存储有序的值列表。
    • 存储方式和对象类似,数组的引用在栈中,实际的内容存储在堆中。
  3. Function(函数)

    • 函数也是一种对象,可以作为值传递。
    • 存储方式和对象一样,函数的引用存储在栈中,实际函数对象存储在堆中。
存储上的差别
  • 引用类型的变量在栈内存中只存储一个指向堆内存中的引用(内存地址)。
  • 引用类型可以通过引用相互关联,多个变量可以引用同一个对象,因此修改对象会影响所有引用了该对象的变量。

3. 栈(Stack)与堆(Heap)存储的差别

  • 栈内存

    • 用于存储大小固定的基本类型变量和指向对象的引用。
    • 内存空间较小,访问速度快。
    • 存储按顺序进行,先进后出,系统会自动管理内存回收。
  • 堆内存

    • 用于存储大小可变的复杂数据结构,如对象和数组。
    • 内存空间大,但访问速度比栈慢。
    • 堆内存需要手动管理,通过垃圾回收机制(GC)来释放不再使用的对象。

总结

  • 基本类型 直接按值存储在栈中,大小固定,访问速度快,且不可变。
  • 引用类型 只在栈中存储引用,实际数据存储在堆中,大小可变,访问速度较慢,多个变量可以引用同一个对象。

练习

  • 基本类型:当将一个基本类型的值赋给另一个变量时,实际上是复制了该值。因此,修改其中一个变量不会影响到另一个变量。

    javascript 复制代码
    let a = 10;
    let b = a;
    a = 20; // b 仍然是 10
  • 引用类型:这些值存储在堆内存中,而变量中存储的是指向实际值的引用。这意味着当你将一个引用类型的值赋给另一个变量时,实际上是在复制该引用,而不是值本身。因此,两个变量指向同一个内存地址,修改其中一个也会影响另一个。

    javascript 复制代码
    let obj1 = { value: 10 };
    let obj2 = obj1;
    obj1.value = 20; // obj2.value 也会是 20

了解这些类型及其存储方式对于理解 JavaScript 中的数据操作和内存管理非常重要。

相关推荐
Maybyy几秒前
Chart.js图标绘制工具库
开发语言·javascript·ecmascript
漂流瓶jz3 分钟前
SourceMap数据生成核心原理:简化字段与Base64VLQ编码
前端·javascript·算法
1***s63219 分钟前
Python爬虫反爬策略,User-Agent与代理IP
开发语言·爬虫·python
柒儿吖23 分钟前
Qt for HarmonyOS 水平进度条组件开发实战
开发语言·qt·harmonyos
惜茶36 分钟前
websocket操作入门
前端·javascript·websocket
咖啡の猫1 小时前
Python的自述
开发语言·python
摇滚侠1 小时前
Vue 项目实战《尚医通》,获取当前账户就诊人信息并展示出来,笔记42
前端·javascript·vue.js·笔记·html5
用户47949283569152 小时前
接手祖传代码后,我终于理解了"组合优于继承"
javascript
C.果栗子2 小时前
Blob格式的PDF文件调用打印,浏览器文件打印(兼容)
前端·javascript·pdf
夏霞2 小时前
c# ASP.NET Core SignalR 客户端与服务端自动重连配置指南
开发语言·c#·asp.net