简述 JavaScript 被执行的那些事情

news2024/11/26 8:59:27

简述 JavaScript 被执行的那些事情

JavaScript 是脚本语言

JavaScript 是解释型语言

JavaScript 执行流程

不同浏览器有不同的 JavaScript 引擎(运行时),主流的 JS 引擎有:

  • V8,chromium 内核的引擎,主要用于 chrome 和 node,目前来说是最主流,大概也是性能最高的 JS 引擎
  • SpyderMonkey,火狐的 JS 殷勤
  • JavaScriptCore,webkit 的引擎,它的名字好多,还包含 SquirrelFish、Nitro,不过项目名称是 JavaScriptCore

抛开早期的 JS 引擎不谈,现在的 JS 引擎的确是会先对 JS 进行编译——即时编译(just-in-time compiling)——,将其转化成二进制的机器语言并处理数据,从而提升运行速度。不过本质上 JS 还是一种解释型语言,因为代码还是一边运行一边执行的。

下面这张图是 v8 的执行过程:

在这里插入图片描述

其中 bytecode 就是二进制的机器码,是由 JIT 编译而成,具体执行的过程是在 baseline 这里(针对 v8,其他的引擎的名称不一样,大致执行流程是差不多的)。

内存管理

JavaScript 的内存管理和其他主流的编程语言差不多,主要就是存储没这么昂贵的(primitive data type)和函数会被存放在 stack 中,存储起来比较昂贵的会被存放到 heap 中:

在这里插入图片描述

以下面代码为例:

function c() {
  console.log('c');
}

function b() {
  c();
  console.log('b');
}

function a() {
  b();
  console.log('a');
}

a();

这时候的 stack 中的保存值为:

在这里插入图片描述

当 c 执行完毕后,c 执行完毕后,就会被退栈,然后执行 b,以此类推。搭配上引擎的事件池,这也是为什么目前 JS 对于异步的操作非常高效的缘故:

event loop

递归也是这样的操作,每次调用之后就会将当前函数再一次推到栈中,一直到 base case。这也是为什么一旦 base case 没有定义好,就会出现 stack excced limits 的报错。

垃圾回收

JavaScript 高级程序设计第四章学习笔记 有提,常规的有两种:

  • 标记清理(mark-and-sweep) :最常用的垃圾回收策略。

    其基本策略就是根据 执行上下文 去判断当前变量是否还在使用中,并且进行标记。一旦离开了 当前执行上下文 的范围内,该函数就会被标记为 离开当前执行上下文。在 垃圾回收 机制运行时,它会检查所有的标记,确认无用的变量后,再加上 待删除 的标记,最后执行内存清理,清理掉 待删除 的标记,释放空间。

  • 引用计数

    引用计数(reference computing) 是另外一种没那么常用的垃圾回收机制。其基本思路是标记每一个变量被引用的次数,当这个函数被调用时,引用的次数 +1,当保存该值引用的值被其他的覆盖了,引用的次数 -1。最终当引用的次数为 0 的时候,就被认定可以安全地释放其内存,并且会在下次垃圾回收机制运行的时候释放其空间。

    在互相引用的情况下,这个回收机制就会出现问题——引用计数永远不会为 0,这也代表着互相调用的内存永远不会被清空。

    其中一个人为的补救方式是将指针对象指向 null,即:

    const someSbject = {};
    // ........
    someSbject = null; // 完全切断变量与引用之间的关系
    

reference

  • SpiderMonkey

  • Firing up the Ignition interpreter

  • JavaScript V8 Engine Explained

  • JavaScript’s Memory Management Explained

其他一些相关的学习红宝书第四章也有,这里是笔记:

  • JavaScript 高级程序设计第四章学习笔记

    温故知新后发现之前有些囫囵吞枣的地方也变清楚了

  • BOM 操作学习笔记

    event loop 的一部分笔记在这里有提到

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

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

相关文章

【ChatGPT4.0+PPT】使用NewBing搭配mindshow快速完成PPT任务

使用NewBing搭配mindshow快速完成PPT任务 前言一、使用NewBing生成PPT大纲二、粘贴Markdown到mindshow生成PPT三、结果展示四、扩展 前言 完成一个简单的PPT只需要两步: 使用NewBing生成PPT大纲粘贴Markdown到mindshow生成PPT 如果访问不了NewBing可以用国内Chat…

Minecraft外置登录服务器Little-Skin讲解

随着Minecraft的普及与发展,现在许多小伙伴是越来越爱上了MC。但是想玩国际正版岂是那么容易?或许你会说“HMCL不就是java启动器吗?”,这句话是没错,但是HMCL的都是离线账户。那么该怎么永远拥有一个稳定的账户呢&…

JVM 垃圾回收相关算法

垃圾标记阶段 对象存活判断: 在堆里存放着几乎所有的 Java 对象实例,在GC 执行垃圾回收之前,首先需要区分出内存中哪些是存活对象,哪些是已经死亡的对象。只有被标记为已经死亡的对象,GC 才会在执行垃圾回收时,释放掉…

简单介绍Qt Quick、QML以及Qt Widgets之间的区别与联系

作者:CCAccept 专栏:Qt Quick 文章目录 前言Qt WidgetsQt Widgets的发展Qt Widgets的优点Qt Widgets的应用场景 QML与Qt QuickQML的发展QML的优点QML的应用场景 总结 前言 之前都是一直在做Qt Widgets的项目,最近由于实验室要求&#xff0…

从零开始,教你如何写出好的品牌策划推广方案

要写出一份好的品牌策划推广方案其实并不难,道叔今天给你分享自己十年来在品牌策划行业内的一个经验干货,希望对你有所帮助。 首先,你要知道的是一份“合格”品牌策划方案需要必备的三个条件: 1、逻辑 品牌策划的逻辑决定了方案…

Vue实战笔记(三) 引入Quill Editor

大家好,我是半虹,这篇文章来讲如何在 Vue 中引入 Quill \text{Quill} Quill 1、背景介绍 在前端开发中,富文本编辑器是一个重要的功能组件,方便用户创建和编辑格式丰富的文本内容 目前在市面上有着很多富文本编辑器组件&#x…

chatgpt赋能Python-30_days_of_python

用20行Python写的入门级小游戏:“猜数字”游戏 如果你想了解Python编程语言并开始使用它,那么编写一个短小精简的小游戏是一个不错的起点。在这篇文章中,我们将介绍一个入门级小游戏:猜数字游戏。 该游戏旨在帮助你了解Python命令行输入输出…

QRegion 限制 QPainter 的绘制区域

我有这样一个需求。 有一张图片,这张图片上面被我用不同的颜色画了不同的区域,然后我想选择这张图片中的某一种颜色,只在这种颜色所在的区域内进行绘制或者用橡皮擦擦除这种颜色,而不会影响其他颜色。 看着这个需求的时候&#…

Java【网络原理2】TCP 协议的连接管理机制 : 三次握手和四次挥手到底是怎么回事?

文章目录 前言一、三次握手二、四次挥手总结 前言 📕各位读者好, 我是小陈, 这是我的个人主页 📗小陈还在持续努力学习编程, 努力通过博客输出所学知识 📘如果本篇对你有帮助, 烦请点赞关注支持一波, 感激不尽 📙 希望我的专栏能够…

让AI来预测一下2023年软考系统分析师案例分析的新技术考点

预测 AI对考试的帮助可能没法雪中送炭,但是也许可以锦上添花。AI的预测新技术考点内容(仅供参考)如下: 由于我是一个AI模型,无法准确预测未来的技术内容。但是根据当前的发展趋势和历史变化,以下是可能出…

将核心交换机配置为NTP服务器

AR配置外源NTP 1&#xff0e;配置ntp <XQ-R1220>sys [XQ-R1220]ntp-service unicast-server 120.25.115.20 #阿里云ntp [XQ-R1220]ntp-service unicast-server 203.107.6.88 #阿里云ntp 2&#xff0e;查看ntp状态 <XQ-R1220>display ntp status clock sta…

什么是以太坊Layer2?

目录 1. Plasma2. State Channels3. Sidechains4. Rollups5. Optimistic Rollups 以太坊&#xff08;Ethereum&#xff09;是一种基于区块链技术的分布式计算平台&#xff0c;提供了智能合约的支持&#xff0c;使得开发者可以构建基于以太坊的去中心化应用&#xff08;DApps&am…

什么是【网络安全】?给你一步到位了解清楚

网络安全是什么&#xff1f; 在俺的私信里经常有人问&#xff1a; 网络安全技术是否就等同于”黑客”技术&#xff1f; 大漏特漏&#xff01;&#xff01;&#xff01; 所谓的「黑客」或「渗透」技术&#xff0c;仅仅是网络安全领域的分支&#xff0c;不能代表其全貌。 随着…

Open Judge——动态规划练习

目录 了解动态规划 2760:数字三角形 1、题目 2、代码 4120:硬币 1、题目 2、代码 了解动态规划 动态规划 是编程解题的一种重要手段。1951 年美国数学家 R.Bellman 等人&#xff0c;根据一类多阶段问题的特点&#xff0c;把多阶段决策问题变换为一系列互相联系的单阶段问…

Centos7连接外网的相关配置与实现yum本地与网络配置(yum配置不使用wget)

目录 一、背景 二、实现连接外网的相关配置 1&#xff09;查看物理机的IP相关信息 2&#xff09;配置物理机指定IP 3&#xff09;根据物理机配置虚拟机网卡 4&#xff09;进入虚拟机&#xff0c;配置网卡 三、yum配置 1&#xff09;切换到yum软件仓库配置文件目录中 2…

队列的基本操作详细介绍 看了就会!!!

文章目录 队列的介绍队列的概念队列的结构生活中队列的运用实例 队列的实现初始化队列队尾入队列队头出队列获取队列头部元素获取队列尾部元素判断队列是否为空获取队列中有效元素个数销毁队列 队列的介绍 队列的概念 队列&#xff1a;只允许在一端进行插入数据操作&#xff…

React18.x + i18next + antd 国际化正确使用姿势及避坑指南

如果你使用这个教程还不能够解决你的问题的话&#xff0c;直接私信我&#xff0c;免费一对一给你解决。 一、使用vite创建一个react项目 具体的创建方法大家参考vite官方文档&#xff0c;大概的操作如下&#xff0c;如果需要更详细的&#xff0c;大家去自行搜索即可 pnpm cr…

【LeetCode】172. 阶乘后的零

172. 阶乘后的零&#xff08;中等&#xff09; 方法一 思路 当一个数乘以 10 &#xff0c;此时数字结尾会增加一个 0&#xff0c;因此我们可以计算 n! 能够得出多少个 10 &#xff0c;就说明能得到多少个 0 。 具体对于5!&#xff0c;也就是 5 * 4 * 3 * 2 * 1 120&#xf…

CSS第一天总结

css第一天总结 css简介 CSS 是层叠样式表 ( Cascading Style Sheets ) 的简称. 有时我们也会称之为 CSS 样式表或级联样式表。 CSS 是也是一种标记语言 CSS 主要用于设置 HTML 页面中的文本内容&#xff08;字体、大小、对齐方式等&#xff09;、图片的外形&#xff08;宽高、…

【pyq文案】合理但有病の自拍文案

1、丑一眼 2、强子&#xff0c;妈发自拍了 3、真是方向失了南北&#xff0c;美的有点东西 4、妈的看自己就烦&#xff0c;800块出了&#xff0c;完美无瑕 5、拍了拍自己 6、这张脸&#xff0c;全是这双手给的 7、糟糕&#xff0c;没有酷起来 8、制造美女我比女娲还牛 …