JavaScript 对引擎、运行时、调用堆栈的概述理解
JavaScript 对引擎、运行时、调用堆栈的概述理解
随着JavaScript越来越流行,越来越多的团队广泛的把JavaScript应用到前端、后台、hybrid 应用、嵌入式等等领域。
这篇文章旨在深入挖掘JavaScript,以及向大家解释JavaScript是如何工作的。我们通过了解它的底层构建以及它是怎么发挥作用的,可以帮助我们写出更好的代码与应用。据 GitHut 统计显示,JavaScript 长期占据GitHub中 Active Repositories 和 Total Pushes 的榜首,并且在其他的类别中也不会落后太多。
如果一个项目越来越依赖 JavaScript,这就意味着开发人员必须利用这些语言和生态系统提供更深层次的核心内容去构建一个令人振奋的应用。然而,事实证明,有很多的开发者每天都在使用 JavaScript,但是却不知道在底层 JavaScript 是怎么运作的。
概述
几乎每个人听说过 V8 引擎的概念,而且,大多数人都知道 JavaScript 是单线程的,或者是它是使用回调队列的。
在这篇文章中,我们将详细的介绍这些概念,并解释 JavaScript 是怎么工作的。通过了解这些细节,你就能利用这些提供的 API 来写出更好的,非阻塞的应用来。如果你对 JavaScript 比较陌生,那么这篇文章将帮助您理解为什么 JavaScript 相较于其他语言显得如此“怪异”。如果您是一位经验丰富的 JavaScript 开发人员,希望它能给你带来一些新的见解,说明 JavaScript 的运行时,尽管你可能每天都会用到它。
JavaScript 引擎
JavaScript 引擎说起来最流行的当然是谷歌的 V8 引擎了, V8 引擎使用在 Chrome 以及 Node 中,下面有个简单的图能说明他们的关系:
这个引擎主要由两部分组成:
- 内存堆:这是内存分配发生的地方
- 调用栈:这是你的代码执行时的地方
运行时
有些浏览器的 API 经常被使用到(比如说:setTimeout),但是,这些 API 却不是引擎提供的。那么,他们是从哪儿来的呢?事实上这里面实际情况有点复杂。
所以说我们还有很多引擎之外的 API,我们把这些称为浏览器提供的 Web API,比如说 DOM、AJAX、setTimeout等等。
然后我们还拥有如此流行的事件循环和回调队列。
调用栈
JavaScript 是一门单线程的语言,这意味着它只有一个调用栈,因此,它同一时间只能做一件事。
调用栈是一种数据结构,它记录了我们在程序中的位置。如果我们运行到一个函数,它就会将其放置到栈顶。当从这个函数返回的时候,就会将这个函数从栈顶弹出,这就是调用栈做的事情。
让我们来看一看下面的例子:
function multiply(x, y) {
return x * y;
}
function printSquare(x) {
var s = multiply(x, x);
console.log(s);
}
printSquare(5);
当程序开始执行的时候,调用栈是空的,然后,步骤如下:
每一个进入调用栈的都称为__调用帧__。
这能清楚的知道当异常发生的时候堆栈追踪是怎么被构造的,堆栈的状态是如何的。让我们看一下下面的代码:
function foo() {
throw new Error('SessionStack will help you resolve crashes :)');
}
function bar() {
foo();
}
function start() {
bar();
}
start();
如果这发生在 Chrome 里(假设这段代码实在一个名为 foo.js 的文件中),那么将会生成以下的堆栈追踪:
"堆栈溢出",当你达到调用栈最大的大小的时候就会发生这种情况,而且这相当容易发生,特别是在你写递归的时候却没有全方位的测试它。我们来看看下面的代码:
function foo() {
foo();
}
foo();
当我们的引擎开始执行这段代码的时候,它从 foo 函数开始。然后这是个递归的函数,并且在没有任何的终止条件的情况下开始调用自己。因此,每执行一步,就会把这个相同的函数一次又一次地添加到调用堆栈中。然后它看起来就像是这样的:
然后,在某一时刻,调用栈中的函数调用的数量超过了调用栈的实际大小,浏览器决定干掉它,抛出一个错误,它看起来就像是这样:
在单个线程上运行代码很容易,因为你不必处理在多线程环境中出现的复杂场景——例如死锁。但是在一个线程上运行也非常有限制。由于 JavaScript 只有一个调用堆栈,当某段代码运行变慢时会发生什么?
并发与事件循环
调用栈中的函数调用需要大量的时间来处理,那么这会发生什么情况呢?例如,假设你想在浏览器中使用 JavaScript 进行一些复杂的图片转码。
你可能会问?这算什么问题?事实上,问题是当调用栈有函数要执行,浏览器就不能做任何事,它会被堵塞住。这意味着浏览器不能渲染,不能运行其他的代码,它被卡住了。如果你想在应用里让 UI 很流畅的话,这就会产生问题。
而且这不是唯一的问题,一旦你的浏览器开始处理调用栈中的众多任务,它可能会停止响应相当长一段时间。大多数浏览器都会这么做,报一个错误,询问你是否想终止 web 页面。
总结
以上所述是小编给大家介绍的JavaScript 对引擎、运行时、调用堆栈的概述理解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!
相关文章:
- 漫谈JS引擎的运行机制 你应该知道什么
- JavaScript实现显示函数调用堆栈的方法
- JS实现队列与堆栈的方法
- java自带的工具Jstack截取进程中的堆栈信息
- 输出java进程的jstack信息示例分享 通过线程堆栈信息分析java线程
- JavaScript调用堆栈及setTimeout使用方法深入剖析
文章同步发布: https://www.geek-share.com/detail/2751296348.html
JavaScript 对引擎、运行时、调用堆栈的概述理解的更多相关文章
- JavaScript是如何工作的:引擎,运行时和调用堆栈的概述!
摘要: 理解JS执行原理. 原文:JavaScript是如何工作的:引擎,运行时和调用堆栈的概述! 作者:前端小智 Fundebug经授权转载,版权归原作者所有. 本文是旨在深入研究JavaScrip ...
- arcgis安装msi安装包提示"在未标记为正在运行时,调用了RunScript”解决办法
安装msi安装包提示"在未标记为正在运行时,调用了RunScript”解决办法 windows/temp目录相关权限不对,右击temp文件夹,选择管理员获取所有权限.
- JavaScript是如何工作的01:引擎,运行时和调用堆栈的概述!
概述 几乎每个人都已经听说过 V8 引擎,大多数人都知道 JavaScript 是单线程的,或者它使用的是回调队列. 在本文中,我们将详细介绍这些概念,并解释 JavaScrip 实际如何运行.通过了 ...
- JavaScript学习(一)——引擎,运行时,调用堆栈
JavaScript引擎 谷歌 V8 引擎是流行的 JavaScript 引擎之一.V8 引擎在诸如 Chrome 和 Node.js 内部使用. 引擎包括两个主要组件: 动态内存管理 – 在这里分配 ...
- How Javascript works (Javascript工作原理) (一) 引擎,运行时,函数调用栈
个人总结:该系列文章对JS底层的工作原理进行了介绍. 这篇文章讲了 运行时:js其实是和AJAX.DOM.Settimeout等WebAPI独立分离开的 调用栈:JavaScript的堆内存管理 和 ...
- 解读JavaScript 之引擎、运行时和堆栈调用
转载自开源中国 译者:Tocy, 凉凉_, 亚林瓜子, 离诌 原文链接 英文原文:How JavaScript works: an overview of the engine, the runtim ...
- 解读 JavaScript 之引擎、运行时和堆栈调用
https://www.oschina.net/translate/how-does-javascript-actually-work-part-1 随着 JavaScript 变得越来越流行,很多团 ...
- How Javascript works (Javascript工作原理) (二) 引擎,运行时,如何在 V8 引擎中书写最优代码的 5 条小技巧
个人总结: 一个Javascript引擎由一个标准解释程序,或者即时编译器来实现. 解释器(Interpreter): 解释一行,执行一行. 编译器(Compiler): 全部编译成机器码,统一执行. ...
- JavaScript js调用堆栈(二)
本文主要介绍JavaScript的内存空间 var a = 20; var b = 'abc'; var c = true; var d = { m: 20 } 首先需要对栈(stack),堆(hea ...
随机推荐
- Siebel计划和实施
1.计划: 自上而下计划配置项目 1)首先,确定UI和应用产品功能 2)然后,确定为实现UI功能而需要在业务层所做的更改 3)最后,确定为实现业务层更改而需要在数据层所做的更改---尽可能少做更改 如 ...
- sqlserver学习2---java执行存储过程
一.存储过程 1.新增操作存储过程 --------------1.新建 增加学生的存储过程---------------------------- set IDENTITY_INSERT stude ...
- Python——追加学习笔记(二)
文件处理 # 文件内移动 seek()方法可以在文件中移动文件指针到不同的位置,offset字节代表相对于某个位置偏移量,默认为0,代表从文件开头算起,1代表从当前位置算起,2代表从文件末尾算起. s ...
- [转]Linux学习
Linux简介与厂商版本 http://www.cnblogs.com/vamei/archive/2012/09/04/2671103.html Linux开机启动(bootstrap) http: ...
- BAT的云
近期,关于用国内那家云非常纠结! 我也来说道说道各家云. 首先,说说我想要的云服务(按优先级): 0.最好能提供二级域名.移动互联网时代,顶级域名必需要吗?在手机浏览器上输入长长的域名非常蛋痛(即不要 ...
- 写一个简单的shellcode
0x00 前言 漏洞利用中必不可缺的部分就是shellcode,不会编写shellcode和咸鱼有什么区别,跳出咸鱼第一步. 0x01 系统调用 通过系统调用execve函数返回shell C语言实现 ...
- 【洛谷P1100】高低位交换
高低位交换 题目链接 这道题非常水,我是用位运算做的 a=n>>16 二进制的“高位”b=n-(a<<16) 二进制的“低位”ans=(b<<16)+a 转换 #i ...
- 【luogu P3952 时间复杂度】 题解
对于2017 D1 T2 这道题 实实在在是个码力题,非常考验耐心. 其实大体的思路并不是非常难想出来,但是要注意的小细节比较多. 题目链接:https://www.luogu.org/problem ...
- Android学习笔记_5_文件操作
1.Activity提供了openFileOutput()方法可以用于把数据输出到文件中,具体的实现过程与在J2SE环境中保存数据到文件中是一样的. package com.example.servi ...
- php如何实现登陆后返回原页面
访问网站页面时,有的页面需要授权才能访问,这时候就会要求用户登录,跳转到登录页面login.php,怎么实现登录后返回到刚才访问的页面项目需求 访问网站页面时,有的页面需要授权才能访问,这时候就会要求 ...