执行环境 Excution Context

首先我们先来看到下方这张图:

当左方的 function 被呼叫的时候，就会创建一个 local 的作用域，并且限制在这个作用域中，this的指向后续的文章会做介绍。

所以根据上述的概念，如果我们一直反覆的执行同一个 function 它就会创造出很多个不同的执行环境。

另外，除了函式可以创造出执行环境以外，全域本身也有自己的执行环境喔!

全域执行环境的创建，是在你的浏览器一开启，或是node.js开始运作的时候就建立了

通常会有对应的全域变数 window(Chrome) 或是 global(NodeJS)，并且 this 同时等同于 window 或是 global。

接下来用实际的例子进行后面执行环境以及执行堆叠的概念吧!

function sayHi (name) {    var greeting = 'hi';    return greeting + ' ' + name;}function doSomething () {    var mom = '老妈';    console.log(1, sayHi(mom));}doSomething();

以上方这段程式码来说，如果我这边不执行 doSomething(); 的话，上方两个 function 的作用域也不会被创建喔!

这就呼应到一开始我们讲的，function 要被 呼叫 | 调用 的时候才会创建作用域。

那么执行上述的这段程式码的话，我们可以想像，作用域从

全域作用域创建 doSomething 的作用域创建变数 mom 并且赋值 '老妈'列印出后方的结果，同时执行 sayHi(mom) 的 function创建 sayHi 的作用域带入变数 name = '老妈'回传字串 'hi 老妈'回到 doSomething 的作用域console.log出结果回到全域作用域

这样的过程，我们的作用域就进行了执行堆叠的概念

首先在第一步骤的时候，执行堆叠的状况是

再来第二步骤，执行 doSomething 的时候创建对应的作用域

执行到 console.log 的时候，又执行了 sayHi 的 funciton， 创建了对应的作用域

等到 sayHi 的内容处理完之后，就离开 sayHi 的作用域，回到了 doSomething 的作用域

印出 console.log 的结果之后，同样的也离开 doSomething 的作用域，回到全域的作用域

这样的状况就叫做，执行堆叠。

透过另外一段程式码，透过同一段 function 创建不同的 执行环境

function openTheDoor (num) {    return '开第 ' + num + ' 扇门';}function openDoors () {    openTheDoor(1);    for (var i = 2; i < 5; i++) {        openTheDoor(i);    }}openDoors();

透过上方的函式，作用域从全域 => openDoors => openTheDoor => openDoors => openTheDoor ....值到迴圈跑完以后，才从openTheDoor => 全域。

也可以自己用chrome的浏览器source的工具式式看喔~

本篇 作用环境 跟 执行堆叠 的讲解就到这~汪汪