JavaScript之调用栈

很早之前写过栈和堆的结构,非常简单的介绍了一下,主要是为了明白深拷贝和浅拷贝。最近突然发现了调用栈这个概念,理解这个概念对于一些函数的执行能更清晰的理解,比如递归。

栈(stack)是计算机中特殊的一个数据列表,栈有一个特点就是先进后出。我们可以把栈当做乒乓球的盒子,先放进去的最后才拿出来。今天只说说入栈和出栈两个概念:

代码运行过程中会有调用栈(call stack)的概念,就是解析的机制,栈的一种运行结构。栈一定遵循先进后出。

有时候会让自己钻进牛角尖,比如栈是先进后出,那么代码从上往下执行的时候,上面的代码先入栈,那么为什么上面的输出会先执行?还有数据都是存储在栈里面,为什么随便可以取值?等等等等。

这些都是待研究的,这边自己给了自己一个应该不正确的理解,栈有链式调用,就跟对象一样,所以数据可以随便调用。JavaScript执行上下文是按顺序调用的,只有调用栈也叫作执行上下文栈才是先进后出。而执行上下文在JavaScript中跟作用域一样,一个函数就是一个作用域,就是一个执行上下文。

看下面代码:

console.log('globals' + i);
var i = 1;
fn(1);
function fn(i) { 
 if(i == 4){      
   console.log('fns:'+ i);
 return    
}    
console.log('fns:' + i);
fn(i + 1); 
console.log('fne' + i);}
console.log('globale' + i);

执行结果是:

globalsundefined
fns:1
fns:2
fns:3
fns:4
fne3
fne2
fne1
globale1

代码运行的时候先生成一个window上下文执行栈,然后压入栈中,接着执行到fn(1),把fn(1)压入栈,fn(1)上下文执行,然后执行到fn(2),把fn(2)压入栈,一直到fn(4),执行上下文栈里面是这样的:


Window上下文按顺序执行,输出globalsundefined,fn(1)上下文按顺序执行先输出fns:1,然后就把fn(2)压入栈了,所以就输出fns2,依次一直到fn(4)。这就是入栈的过程。

然后开始出栈的执行,栈顶的先执行,当fn(4)执行完毕,就把fn(4)弹出栈,fn(3)就变成栈顶,fn(3)接着往下执行,输出fne3,然后fn(3)弹出,依次一直到window。这就是出栈的过程。

执行上下文按顺序执行,执行上下文栈(也叫调用栈)严格按照先进后出的顺序执行。

按照正常的顺序思维去理解或许更快更清晰得到答案,只是这些东西对于想要做些什么的还是有必要去了解的。

解释的不是很好,自己是明白了点,但是文字表述的不清楚,还有一些原理我自己也解释不清,欢迎指教也欢迎留言。

Coding 个人笔记

猜你喜欢

转载自blog.csdn.net/wade3po/article/details/88988240