JS 函数调用栈

什么是函数调用栈

字面理解

1. 函数调用。就是执行函数，如下:

function showName(){
 console.log('xiaoli')
} // 函数声明
showName() // 函数调用

2. 栈。是一种数据存储结构，特点是：先入后出。

3. 函数调用栈。结合在一起，可以理解为：将函数调用以栈的数据结构存储。

举例

function addName(){
 let myName = 'xiaoli'
 return myName
}
​
function showName(){
 let result = addName()
 return result
}
​
showName()

1. 执行上面的函数复制语句时，创建全局执行上下文，压入栈中
2. 执行最后一行函数调用语句时，从全局执行上下文中取出 showName 函数体内的代码，并为其创建函数执行上下文，压入栈中。
3. 当执行到 showName 函数的第一行代码时，从全局执行上下文中取出 addName 函数体内的代码，并为其创建函数执行上下文，压入栈中
4. 执行 addname 函数内的第一行代码，为 myName 变量赋值
5. addName 执行完毕，将其从栈中弹出（变量回收），并将其返回值复制给 result
6. 执行 showName 函数的最后一句代码，答应出变量 result 的值 xiaoli，函数执行完毕，将其从栈中弹出（变量回收）

为什么要有函数调用栈

1. 追踪函数间的调用轨迹。
2. 保存执行全局代码或函数内代码时，需要用到的变量、函数、this 指向，参数等数据。