记录 函数的执行过程

今天分享的内容呢,本应该是this的,但是在看书的过程中,发现了很多不易理解的地方。为了让大家看起来更加清楚明白,今天先做一个this之前的铺垫

今天主要跟大家聊得是函数的执行过程

涉及的一些内容,可以在

https://juejin.im/post/5ea6581d6fb9a03c51481b69

https://www.cnblogs.com/onepixel/p/5090799.html

这两篇帖子中找到

前面我们提到 js代码经过编译器的编译,就会被拿去执行了,代码执行总要有个地方吧,JS引擎分配了一个叫做执行栈(excution stack)的地方用于执行代码
在这之前 引擎初始化可一个叫做Global Object 即 全局对象 的空间
对于浏览器来说,这个GO上有个名叫window的属性,指向它本身
所以window也就是这个全局对象了
chrome浏览器最新的版本上又添加了一个叫globalThis的属性,也是指向GO的
记录 函数的执行过程_第1张图片
当然GO上面还有我们常用的各种基类,Math对象,Date对象等

初始化这些东西之后,是代码执行的过程。
执行栈(excution context stack)开始启用,这个栈 是first in last out的,后进入的代码会先执行,单独贴一下图片地址吧

https://user-gold-cdn.xitu.io/2020/4/28/171c08ac05a719ef?imageslim

这个动图展示了函数被调用的时候,就会被推入执行栈,如果函数中又嵌套函数,那么内部函数就又会被推入执行栈中,在调用它的函数的上面, 内部的函数先执行,执行完成,就出栈, 这样调用它的函数来到了栈顶,继续执行,执行完成后,也出栈, 知道最后主函数执行完成

这里再念叨念叨主函数, 在C++等语言中是有Main这样一个主函数的, 但是我们在js中却没有写,是它不需要吗?其实不是的, 是js引擎帮我们写了一个主函数,而且这个主函数没有函数名,也就是一个匿名函数, 主函数是存在于同步代码的栈底的,

我们可以用一个throw error 来证明这件事
记录 函数的执行过程_第2张图片
如截图所示,函数层层嵌套,error从内向外层层捕获,所以我们在控制台的报错信息中,从栈顶向下挨个标记, 也就是,这个错误发生在f中,f在fn中,fn在foo中,foo在一个匿名函数中, 这匿名函数的位置是1,也就是在栈底了,讲到这里了,我们就顺带着讲一个内存溢出的小知识点,**当你不小心进入了无限循环,比如递归没有设置终点,一个个函数被推入栈内执行,却没有执行完的函数被推出,**很快栈内撑不下了,就溢出来了,因为引擎给它分配的空间也是个有限大的, 内存溢出,浏览器就卡死了。。。

动图展示:https://user-gold-cdn.xitu.io/2020/4/28/171c08a8bb497915?imageslim

而this这个关键字,或者这个属性 是和执行栈紧密相关的,具体的分析,请看下一期分享

你可能感兴趣的:(记录 函数的执行过程)