tags: ItIron2021 Javascript

作者碎碎念

當時在用這一系列題目跑模擬面試活動時，在某個梯次有個參加的同學問了一個很好的問題。

Danny，現在不是都用const/let嗎? var還有人在用嗎? 如果沒有，為什麼還要複習var相關的題目?

確實，現代網路開發你很少很少會看到有人用var(除非你是去翻一些套件的原始碼)，但很遺憾的是，即便許多玩意在開發時已經漸漸式微，但仍會出現在你的面試環節中。我當時辦模擬面試的目的就是為了協助同學了解大致上面試會碰到的東西，因此雖然我自己開發也沒在用了，但在選擇題目時還是會忠實呈現我自己在面試中碰到的題目，再過幾年這一系列文章也大概率會變得沒有參考價值，但希望至少在這幾年中還是可以幫到一些求職者?

前言

昨天我們探討了hoist的概念，接下來的兩天我們一樣透過小弟我當時碰到的面試題目來複習一下吧! 放心，複習的文章都很短，在廁所的時間就可以看完的? 我們就馬上開始吧!

本日題目與解釋

請問下方程式碼輸出結果為何

let salary = "1000";

(function () {
  console.log("Origin salary was " + salary);
  
  var salary = "5000";
  
  console.log("My new salary is ", + salary);
})();

老樣子，今天也來張不一樣的防雷圖

我想既然已經有據透今天的題目與hoist相關，許多人看到以下的答案應該不會太意外了

Origin salary was undefined
My new salary is  5000

這個題目牽扯到作用域(scope)以及提升(hoist)的概念，多虧了Day1的文章，我們知道var宣告的變數是functional scope，那我們只要關心IIFE內的東西即可，最外圍的let salary = "1000"可以直接忽略不記。接著配合昨天的內容，我們知道提升會先將宣告移置記憶體位置(或是你要說是該scope的最上層也行)，且被提升的部分僅有宣告，賦值的行為並不會一併被提升，因此IIFE內其實會被解讀為以下的程式碼

(function () {
  var salary;
  console.log("Origin salary was " + salary);
  
  salary = "5000";
  
  console.log("My new salary is ", + salary);
})();

如此一來以上的輸出結果就完全合理了吧! 是不是很簡單呢?

本日核心觀念與總結

核心觀念

作用域(scope)、提升(hoist)

總結

• 複習作用域與提升的概念

本文章同步發布於個人部落格，有興趣的朋友也可以來逛逛~!