[筆記] JavaScript 的基本觀念 – 4 – Variable Environment @地瓜大的飛翔旅程

章節連結

課程對應章節
內容
JavaScript 全攻略系列文章

JavaScript 的變數縱使名稱設定一樣，會因所在環境不同而有不同的結果。在函式 function 內的變數會獨立於 global execution 的區塊，所以若要函式內的執行結果回傳到 global execution 中，記得要下 return 。

課程對應章節

Course 15 ~ Course 16 (全部一共有 85 Courses)

請注意：本系列文章為個人對應課程的消化吸收後，所整理出來的內容。換言之，並不一定會包含全部的課程內容，也有可能會添加其他資源來說明。課程連結網址：http://tinyurl.com/w7vrql6

內容

1. 直接看例子來解說吧，縱使定義是使用最弱型別的 var，因為有 function 的保護，所以範例中的 myVar 並沒有受到影響。
2. 有 OuterReference 的特性，故位於 Stack 最頂端的 function，會向外層的 function 一個個找尋對應值，直到 global。
3. Scope 是指編譯器或 JavaScript 藉由名稱來查尋變數的規則，在 ES6 以前只能用 function 來定義變數範圍(Scope)。ES6 以後多了用 {…} 的方式。

// 1. 例子 
function b() {
  var myVar
  console.log(myVar) // (3)
}

function a() {
  var myVar = 2
  console.log(myVar) // (2)
  b()
}

var myVar = 1
console.log(myVar) // (1)
a()
console.log(myVar) // (4)

// 最後console.log的結果為 1, 2, undefined, 1

// 2. 例子 
function b() {
  console.log(myVar) // (3)
}

function a() {
  var myVar = 2
  b()
}

var myVar = 1
console.log(myVar) // (1)
a()

// 最後console.log的結果為 1, 1，因為 function b 所在的位置，外層就是 global 的區塊。