JS内存

119 阅读4分钟

js的内存世界

一切都运行在内存里

 开机
 操作系统的c盘(macOS的根目录下有过个目录)
 当你按下开机键,主板通电,开始读取固件
 固件就是主板上的存储设备,里面有开机程序
 开机程序会将文件中的操作系统加载到内存中运行

打开浏览器

 chrome.exe文件
 你双击chrome.exe图标,就会运行chrome.exe文件
 开启chrome进程,作为主进程
 主进程会开启一些辅助进程,如网络服务,CPU加速
 你每新建一个页面,就有可能开启一个子进程

浏览器的功能

 发起请求,下载HTML。解析HTML,下载CSS,解析CSS,渲染界面,下载JS,解析JS,执行JS等。
 功能模块;用户界面,渲染引擎,JS引擎,存储等。
 上面的功能模一般各自处理不同的线程(比进程更小)
 如果进程是车间,那么线程就是车间的流水线

JS引擎

 chrome用的是V8引擎,用c++写的
 网景用的是SpiderMonkey,后续被Firefox使用
 Safari用的是JavaScriptCode()
 IE用的是Chaka(JSript9)
 Edge用的是Chaka(JavaScript)
 Node.js用的是V8引擎

主要功能

 编译:把JS代码翻译成机器能执行的字符码和机器码
 优化;改写代码,使其更高效
 执行;执行上面的字节码或者机器码
 牢记回收;把JS用完的内吨回收,方便之后再次使用

执行JS代码的(准备工作)

 提供APIwindow / document / setTimeout
 上面这些都不是JS自身具备的功能
 我们将这些功能称之为运行环境;runtime eny
 一旦把JS放进页面中,就开始执行JS

内存图

1641373275154.png

红色区域

 作用
 红色区域专门来存放数据,我们目前只研究该区域
 红色区域并不存在变量名,变量名存在(不知道的区域)
 每种浏览器的分配规则并不一样
 上图的区域并不完整
 我还没有话(调用栈)(任务队列)等区域

Stah和Heap

 红色区域分为Stah栈和Heap堆
 Stach区特点;每个数据顺序存放
 Heap区特点;每个数据随机存放
 代码举例
 var a = 1
 var b = a
 var  person = {name:'xiaoing'}
 var person2 = person
 规律;
 数据分为两种;非对象和对象
 非对象都存在Stach中
 对象存在Heap中
 =号总是会把右边的东西复制到左边(不存在什么传值和传址)

Js开发要有什么

 有window(浏览器提供的)
 console(并且挂到window上)
 document(并且挂到window上)
 对象Object(并且挂到window上)
 数组Array(一种特殊的对象)(并且挂到window上)
 函数Function(一种特殊的对象)(并挂到window)
 为什么要都挂在window上?
 因为方便,挂在window上的东西可以在任何地方直接用

1641374704464.png

1641374725068.png

注意(细节)

 window变量和window对象是两个东西
 window变量是一个容器,存放window对象的地址
 window对象是Heap里的一拖数据
 不信的话,可以让var x = window,那么这个时候x指向了window对象
 同理
 consoleconsole对象不是一个东西
 objectObject函数对象不是一个东西
 前置是内存地址,后者是一坨内存

原型(prototype)

 代码
 var obj = {}
 var obj2 = {}
 obj2。toString()
 obj 和 obj2又什么联系
 相同点
 都可以调用.toString()
 不同点
 地址不同obj!= obj2
 可以拥有不同的属性
 XXX.prototype存储路xxx对象的共同属性,这就是原型
 每一个函数对象上都有是一个prototype原型对象
 每一个对象上都有一个隐藏属性指向原型(对象)
 这个隐藏属性叫做——proto——

protp和prototype的区别

 都存着原型的地址
 只不过prototype挂在函数上
 _proto_挂在每个新生成的对象上

代码

 var arr = [1,2,3]
 arr.join('-')
 为什么不报错?为什么可以运行?
 画图解释
 arr有一个隐藏属性,引港属性存储了,Array.prototype对象的地址
 arr.join()发现arr上没有join
 就去隐藏属性对象的对象里面找
 于是就找到了Array.prototype.join