js内存与数据

news2024/11/21 1:34:14

1.内存空间的重要性

想要对js理解更深刻,就需要对内存空间有个清晰的认知。

  • 比如基本和引用数据类型存储方式和引用传递到底是怎么回事? 
  • 栈内存与堆内存的区别?

2.计算机存储空间

  • 内存:容量小 访问速度快 程序运行时(临时占用)
  • 硬盘:容量大 访问速度慢 程序安装

3.js运行和存储空间的关联

  • js运行在哪里? 运行在浏览器内存
  • 和硬盘完全没有关联吗? 有关联,比如做数据的持久化存储(localStorage)

4.js的哪些场景会占用内存空间?

  • 函数声明 -> 函数体:页面运行期间持续存在。如全局变量会一直占用内存空间
  • 函数运行 -> 执行上下文:临时占用内存空间,函数运行结束释放内存

5.内存的生命周期(内存管理的过程)

  1. 分配内存 (定义变量)
  2. 使用内存(变量值的读取或写入)
  3. 回收内存(对不在使用的数据进行回收)
// 分配内存
var obj = {
  b: 2
}

var obj1 = 1

// 使用内存
console.log(obj)

// 回收内存?那基本数据类型怎么回收?
obj = null

6.js中内存空间类型:栈内存与堆内存

栈内存与堆内存本身没有区别,只是存储方式的差异,有了不同。

6.1 栈内存:

  • 栈内存:通常用于记录函数执行记录(函数调用栈),包括函数内的基础数据类型
  • 特性:先进后出 后进先出
  • 使用场景:通常用于记录函数的执行记录,它代表了函数的执行顺序(函数调用栈

6.2 堆内存

  • 堆内存:存储引用数据类型,也就是对象。访问没有顺序限制
  • 特性:堆内存中的变量只有在所有对它的引用都结束的时候才会被回收。

var testHeap = {
  a: 10,
  b: 20,
  c: {
    m: 100,
    n: 110
  }
}

testHeap.a

7.数据类型——基础数据类型 => 栈内存

  • string
  • number 
  • boolean
  • null
  • undefined
  • BigInt
  • Symbol

7.1特性:

  • 按值访问
  • 是不可变数据(值本身无法被改变

 7.2实例说明1:

var a = 1;
var b = a;

console.log(a === b)
b += 1;//栈中值的本身是无法修改的,var b = a赋值时,是先在栈中开辟内存b,然后将a的值赋值给b;当b = b+1是又会重新开辟一块空间,将b+1的值2赋值给b,原来的b占用的空间被释放
console.log(a === b)
console.log(a);
console.log(b);

var str = 'hello'
str += 'world'

解析:栈中值的本身是无法修改的,var b = a赋值时,是先在栈中开辟内存b,然后将a的值赋值给b;当b = b+1是又会重新开辟一块空间,将b+1的值2赋值给b,原来的b占用的空间被释放 

 

说明:

第一个打印中a b 的等价,并不表示他们是同一个地址(指向同一个内存地址)。a赋值给b的时候,其实是把1这个值赋值给了b,而不是赋值的内存地址。所以说,基础数据类型,是按值访问的。

7.3 当两个基础类型的变量进行比较时,本质上,也是他们的值在进行比较

var a = 1;
var b = a;
console.log(a === b)

7.4不可变数据实例2:

如:对字符串的操作一定是返回一个新字符串,原始字符串并没有被改变

var str = 'hello world'
str[0] = 'b'

console.log(str) // 'hello world'基本数据类型值的本身不会被修改

 8.数据类型——引用数据类型(对象) => 堆内存

  • object
  • array
  • function
  • Date
  • RegExp
  • Set和WeakSet
  • Map和WeakMap

8.1特性

  • 按引用访问
  • 值可以被改变

8.2实例1

var a = {
    m: 1
};
var b = a; //b=a 赋值是赋值的内存地址,所以赋值后修改b,a也会被修改
console.log(a === b) //true
b.m = 2
console.log(a === b)
console.log(b.m);
console.log(a.m);

赋值是赋值的内存地址,所以赋值后修改b,a也会被修改 

 

 8.3当引用数据类型在进行比较时,本质上,是对他们的内存地址进行比较

var a = {}
var b = {}
console.log(a == b) //false

此处a和b都由自己独立的内存地址,所以返回false 

8.4对象常见雷区:引用传递

实例1:

想要通过一个方法修改对象,而不改变原有对象

// 示例1
var person = {
  province: 'hubei',
  city: 'wuhan'
}

function getPerson(p, name, age) {
  p.name = name; 
  p.age = age;
  return p;
}

var a = getPerson(person, 'Bob', 10);

console.log(a);
console.log(person);
console.log(a === person);

说明:最后原有对象也被修改了,传入的是person对象的内存地址,所以修改p以后,person也会被修改 

实例2

想通过Object.assign()方法创建一个新的对象bar,但是发现最后foo对象也被更改了

console.log(foo === bar);//进行了浅拷贝

// 示例2
var foo = {
  a: 1,
  b: 2
};
// Object.assign方法是浅拷贝,拷贝的是数据的内存地址
var bar = Object.assign(foo, { c: 100 }); // a,b,c

console.log(foo, bar);//foo被修改,{a: 1, b: 2, c: 100}

var bar = Object.assign({}, foo, { c: 100 });
console.log(foo, bar);//{a: 1, b: 2, c: 100}
foo.b = 3;
console.log(foo, bar);//{a: 1, b: 3, c: 100},{a: 1, b: 2, c: 100}
console.log(foo === bar);//进行了浅拷贝

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1088363.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

微型导轨可用在哪些设备上?

微型导轨是一种高精度、小体积的导轨系统,被广泛应用于各种需要高精度导向的场合。以下是一些常见的微型导轨应用场景: 1、半导体设备:在半导体制造过程中,设备需要精确、高速和稳定的运动。微型导轨具有高精度和高刚性&#xff0…

【管理运筹学】第 10 章 | 排队论(1,排队论的基本概念)

文章目录 引言一、基本概念1.1 排队过程1.2 排队系统的组成和特征1.3 排队模型的分类1.4 系统指标1.5 系统状态 引言 开一点排队论的内容吧,方便做题。 排队论(Queuing Theory)也称随机服务系统理论,是为解决一系列排队问题&…

工业互联网系列1 - 智能制造中有哪些数据在传输

工业互联网以网络为基础,需要传输的数据种类多种多样,这些数据对于实时监控、生产优化、设备维护和决策支持等方面都至关重要。 以下是一些常见智能制造业中需要传输的数据类型: 传感器数据:制造设备上安装的传感器(如…

高效视频剪辑:批量合并视频与背景音乐结合的技巧解析

在数字媒体时代,视频剪辑已经成为了一种重要的技能。其中,批量合并视频与添加背景音乐是视频剪辑过程中不可忽视的环节。本文将为您提供高效地合并视频和背景音乐的技巧解析,帮助您更快速地完成视频剪辑,创作出更加生动有趣的视频…

加固数据安全:Java助力保护Excel文件,让数据无懈可击

摘要:本文由葡萄城技术团队于CSDN原创并首发。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。 前言 Excel文件保护是常用的一种功能,文件保护主要有三种: 添…

OLED透明拼接屏:福州鼓山风景区:徜徉于城市壮丽之

福州是中国福建省的省会城市,历史悠久,文化底蕴深厚。 该城市曾是唐宋时期的重要港口城市,也是丝绸之路海上丝绸之路的起点之一。 福州以其独特的地理位置和丰富的历史遗产而闻名于世。 福州拥有众多的历史景点,其中最著名的是…

掌动智能浅析Web自动化测试的重要性

在现代Web开发中,确保Web应用程序的质量和稳定性至关重要。Web自动化测试工具成为了开发团队的关键资源,帮助他们自动化测试流程、减少手动劳动,提高测试覆盖率和效率。本文将介绍Web自动化测试的重要性是什么! Web自动化测试的重要性&#x…

给电瓶车“消消火”——TSINGSEE青犀智能电瓶车棚监控方案

近年来,电瓶车电梯起火、室内起火、楼道起火的新闻层出不穷,很多人为了图方便就将电瓶车推到家中充电,这种十分危险的行为,严重影响了社区的公共安全和个人生命财产,为什么惨痛新闻不断播出,这种行为还是屡…

java 并发AQS 理解

最近复习并发中AQS相关知识,这边看到一个比较好的文章,转载记录下 转载自:Java AQS 核心数据结构-CLH 锁 在并发编程中,锁是一种常用的保证线程安全的方法。Java 中常用的锁主要有两类,一种是 Synchronized 修饰的锁…

html页面提交数据后,数据库有新增但为空值

经过仔细查找错误的原因,发现问题就出在我的html文件 红色箭头指示的语句我没加进去

vscode中注释多行bash脚本

选择你要注释的行,右击所选的行,从命令调色板中选择添加行注释。 选择后,所选的行将被注释为#,如下图所示。 选择你想取消注释的行,在所选行上点击右键,从命令调色板中选择删除区块注释,就可以从…

【力扣每日一题】2023.10.13 避免洪水泛滥

目录 题目: 示例: 分析: 代码: 题目: 示例: 分析: 给我们一个一维数组,元素为0表示对应日期不下雨,非0则表示对应日期对应号的湖泊下雨,下雨之后会导致该…

01-10 周二 PyCharm远程Linux服务器配置进行端点调试

01-10 周二 PyCharm远程Linux服务器配置 时间版本修改人描述2023年1月10日14:04:15V0.1宋全恒新建文档2023年2月6日11:03:45V0.2宋全恒添加快捷指令别名的实现方便虚拟环境的切换 简介 使用 PyCharm,您可以使用位于另一台计算机(服务器)上的解释器调试应用程序。 …

HotSpot的算法实现

1.根节点的枚举 我们通过可达性分析算法从GC Roots中找到全局性的引用(例如常量或者类静态属性)或者是执行上下文(例如栈帧中的本地变量)中,尽管我们的目标非常明确,但是随着java的不断扩大,光一…

JTS: 12 Descriptions 图形覆盖

这里写目录标题 版本代码Intersection 交集Union 并集Difference 差集SymDifference 补集 版本 org.locationtech.jts:jts-core:1.19.0 链接: github 代码 /*** 图形覆盖操作* author LiHan* 2023年10月12日 19:34:09*/ public class GeometryDescriptions {private final Ge…

抽象类

一、认识抽象类 public abstract class A {//类该有的成员,抽象类都有private String name;public static String schoolName;public A() {}//抽象方法:必须有abstract修饰 只有方法签名,没有方法体public abstract void run();} //一个类继…

Kafka SASL认证授权(六)全方位性能测试

Kafka SASL认证授权(六)全方位性能测试。 官网地址:https://kafka.apache.org/ 一、场景 线上已经有kafka集群,服务运行稳定。但是因为产品升级,需要对kakfa做安全测试,也就是权限验证。 但是增加权限验证,会不会对性能有影响呢?影响大吗?不知道呀! 因此,本文就此…

机器学习网络模型绘图模板

一 前言 本期为读者推荐一款名为ML Visuals的机器学习画图PPT模板,ML Visuals 专为解决神经网络画图问题设计,通过提供免费的专业的、科学的和充分的视觉和图形来帮助机器学习社区改善科学传播。目前,ML Visuals 包含了超过100多个的自定义图…

Python接口自动化 —— token登录(详解)

简介 为了验证用户登录情况以及减轻服务器的压力,减少频繁的查询数据库,使服务器更加健壮。有些登录不是用 cookie 来验证的,是用 token 参数来判断是否登录。token 传参有两种一种是放在请求头里,本质上是跟 cookie 是一样的&am…

人大与加拿大女王大学金融硕士——带你了解GMAT考试为何如此重要

随着社会经济的发展,金融行业的优势愈发明显。越来越多的人想要进入金融行业发展,但学历往往成为了敲门砖。自人大与加拿大女王大学金融硕士项目创办以来,受到了许多学子及在职人士的欢迎,但想要报考人大加拿大女王大学金融硕士项…