在看JS内存机制之前我们先来看一下JS是门什么样的语言,他又有哪些变量类型。

动静态,强弱类型

静态:在使用之前就需要确认其变量数据类型。

动态:在运行过程中需要检查数据类型

强类型:不支持隐式类型转换。

弱类型:支持隐式类型转换。

而JS呢,则是一种动态弱类型的语言。

JS的变量类型

JS的变量类型分为8种,注意️:其中Symbol为ES6新增,BigInt为ES11新增

类型

描述

Number

基于IEE754标准的双精度64位二进制格式的值,范围为2的63次方减一到负的2的63次方减一

String

用于表示文本数据,️JS里面字符串是不可变的

Boolean

布尔值,只有true和false

Undefined

一个没有被赋值的变量值为undefined,变量提升的默认值也是undefined

Null

空的初始值,只有一个值Null

Symbol

符号类型,唯一且不可修改

BigInt

可以用任意精度表示数字,即使超出Number的安全范围也可以正常操作

Object

对象,可以看作一组属性的集合

注意:️

  • typeOf Null 为Object,原因在于在JS最初版本000开头的为对象,而Null全为0,故导致为Object。
  • 前七种称为基本数据类型(原始数据类型),最后一种为复杂数据类型又称为引用数据类型(合成数据类型)。

JS的内存

js的内存空间分为栈(stack)、堆(heap)、池(一般也会归类栈中)。其中栈存放变量,堆存放复杂对象,池存放常量,所以也叫常量池。

栈空间就是我们之前反复提及的调用栈是用来存储执行上下文的。基本数据类型的变量值都被保存在执行上下文中,而执行上下文又被压入到栈中,所以你也可以认为基本数据类型都是存放在栈中的(除了闭包)

复杂数据类型的变量都是存储在堆中的,而复杂数据类型的引用则是存储在栈中的。当访问复杂数据类型的时候相当于多了一道转手的流程。

对比

区别

数据结构

栈结构

堆结构

存储内容

基本数据类型和复杂数据类型的引用

复杂数据类型和闭包

空间

空间比较小

空间很大

经过以上我们可以得出除闭包外,基本数据类型的变量都是存储在栈中,而复杂数据类型都是存储在堆中,而复杂数据类型的引用则存储在栈中。

注意️:原始类型的赋值会完整复制变量值,而引用类型的赋值是复制引用地址。

问题

为什么一定要分堆和栈两个存储空间呢?

原因在于 JavaScript 引擎需要用栈来维护程序执行期间上下文的状态,如果栈空间大了话,所有的数据都存放在栈空间里面,那么会影响到上下文切换的效率,进而又影响到整个程序的执行效率

JS变量有哪几类?

JS里面堆存储和栈存储有什么区别?

Null和Undefined的区别?

原因:

其实最初JS也是只有null,但后来JS的设计者觉得这样不太好,原因有如下两点

  • null像在Java里一样,被当成一个对象。但是,JavaScript的数据类型分成原始类型(primitive)和合成类型(complex)两大类,Brendan Eich觉得表示"无"的值最好不是对象。
  • JS的最初版本没有包括错误处理机制,发生数据类型不匹配时,往往是自动转换类型或者默默地失败。Brendan Eich觉得,如果null自动转为0,很不容易发现错误。

区别:

null是一个表示"无"的对象,转为数值时为0;undefined是一个表示"无"的原始值,转为数值时为NaN。

null代表没有对象,即此处不应该有值,用法:

  1. 作为函数的参数,表示该函数的参数不是对象。
  2. 作为对象原型链的终点。

undefined表示"缺少值",就是此处应该有一个值,但是还没有定义,使用:

一变量二函数一对象

  1. 变量被声明了,但没有赋值时,就等于undefined。
  2. 调用函数时,应该提供的参数没有提供,该参数等于undefined。
  3. 函数没有返回值时,默认返回undefined。
  4. 对象没有赋值的属性,该属性的值为undefined。

参考

阮一峰Null和undefined区别

浏览器工作原理与实战

JS内存机制的更多相关文章

  1. javascript js 内存泄露

    JavaScript 内存泄露 1.什么是闭包.以及闭包所涉及的作用域链这里就不说了. 2.JavaScript垃圾回收机制 JavaScript不需要手动地释放内存,它使用一种自动垃圾回收机制(ga ...

  2. Chrome JS内存泄漏排查方法(Chrome Profiles)

     原文网址:http://blog.csdn.net/kaitiren/article/details/19974269 JS内存泄漏排查方法(Chrome Profiles)   Google Ch ...

  3. Js内存泄露问题总结

    最近接受了一个Js职位的面试,问了很多Js的高级特性,才发现长时间使用已知的特性进行开发而忽略了对这门语言循序渐进的理解,包括Java我想也是一样,偶尔在Sun官方看到JDK6.0列举出来的new f ...

  4. 从浏览器多进程到JS单线程,JS运行机制的一次系统梳理

    前言 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会及时修正. ----------超长文+多图预警,需要花费不少时间.---------- 如果看完本文后,还对进程线程傻傻分不清,不清楚浏 ...

  5. js内存深入学习(一)

    一. 内存空间储存 某些情况下,调用堆栈中函数调用的数量超出了调用堆栈的实际大小,浏览器会抛出一个错误终止运行.这个就涉及到内存问题了. 1. 数据结构类型 栈: 后进先出(LIFO)的数据结构  堆 ...

  6. 从浏览器多进程到JS单线程,JS运行机制最全面的一次梳理

    前言 来源:https://dailc.github.io/2018/01/21/js_singlethread_eventloop.html 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会 ...

  7. 【进阶1-4期】JavaScript深入之带你走进内存机制(转)

    这是我在公众号(高级前端进阶)看到的文章,现在做笔记 https://mp.weixin.qq.com/s/yK4DPKhkmkiroasWJMrJcw 阅读笔记 JS内存空间分为栈(stack).堆 ...

  8. js内存空间的那点事

    由于js具有自动垃圾回收机制,导致接触js后一直没去关注js的内存分配及变量回收等原理,只是懵懂的了解用变量标记法(null)可以手动的去清除或是回收:是时候弥补这个大坑了... 垃圾回收两种方法 一 ...

  9. 转---单页面应用下的JS内存管理

    正文从这开始- 内存问题对于后端童鞋而言可能是家常便饭,特别是C++童鞋.我在实习时做过半年的c++游戏客户端开发(也是前端开发哦),也见识了各式各样的内存问题,就说说我的第一个坑,当时做个需求,就是 ...

随机推荐

  1. Docker(三)Docker常用命令

    Docker常用命令 帮助命令 # 显示 Docker 版本信息 docker version # 显示系统信息,包括镜像和容器的数量 docker info # 查看帮助文档 帮助文档地址:http ...

  2. 如果人生也能存档——C#中的备忘录模式

    大家好,老胡又和大家见面了.首先承认今天的博客有点标题党了,人生是没有存档,也没有后悔药的.有存档和后悔药的,那是游戏,不知道这是不是游戏让人格外放松的原因之一. 今天恰逢端午放假,就让我们来试着做一 ...

  3. activiti学习笔记二

    上一篇文章大概讲了下什么是流程引擎,为什么我们要用流程引擎,他的基本原理是啥,以及怎么进行基本的使用,这篇文章我们再讲下其他的一些使用. 删除流程部署 package activiti02; impo ...

  4. yqq命令

    用 apt-get install 安装时 ,会有一个提问,问是否继续,需要输入 yes.使用 yqq 的话,就没有这个提问了,自动 yes . 例如下面的更新和安装nginx: apt-get -y ...

  5. js事件入门(3)

    3.键盘事件 3.1.onkeydown 键盘按下事件 当键盘按下的时候触发 <!DOCTYPE html> <html> <head> <meta char ...

  6. 同一WpfApplication下简单的页面转换

    别人写的很不错的Dome...分享学习下 源文件地址 : http://pan.baidu.com/share/link?shareid=1698564707&uk=3912660076

  7. Tomcat Filter之动态注入

    前言 最近,看到好多不错的关于"无文件Webshell"的文章,对其中利用上下文动态的注入Filter的技术做了一下简单验证,写一下测试总结,不依赖任何框架,仅想学习一下tomca ...

  8. 「MoreThanJava」Day2:变量、数据类型和运算符

    「MoreThanJava」 宣扬的是 「学习,不止 CODE」,本系列 Java 基础教程是自己在结合各方面的知识之后,对 Java 基础的一个总回顾,旨在 「帮助新朋友快速高质量的学习」. 当然 ...

  9. H5禁止微信内置浏览器调整字体大小

    微信webview内置了调整字体大小的功能,用户可以根据实际情况进行调节.但是这也会导致字体大小改变以后,出现页面布局错乱的情况. 1.iOS的解决方案是覆盖掉微信的样式: body { /* IOS ...

  10. TJOI2018 数学计算 题解

    题目 小豆现在有一个数 \(x\) ,初始值为 \(1\) . 小豆有 \(Q\) 次操作,操作有两种类型: \(m\): \(x=x×m\),输出 \(x\mod M\) : \(pos\): \( ...