> 如果有記憶吐司就好了... # var、let、const 的差異 ## Hoisting ### var有hoisting的特性 ``` console.log(a) // 此時的a已宣告但還沒有值,所以是undefined var a = 1; ``` ### let與const沒有hoisting的特性 ``` console.log(a,b) // 此時的a,b皆尚未被宣告,會跳錯誤 let a = 1; const b = 2; ``` ## 重複宣告 ### 在同一個作用域內var可以重複宣告 宣告一個可更改的變數,若重複宣告一個同樣的變數,則由後者覆蓋前者,目前已經很少人使用var,而被let給取代了。 ``` var a = 1; var a = 2; //a的值為2 ``` ### 在同一個作用域內let與const不能重複宣告一樣的變數 宣告一個可更改的變數,無法重複宣告同樣的變數。 ``` let a = 1; let a = 2; //系統顯示錯誤,變數a已經被宣告過了 ``` ## 透過window取得變數 ### var可透過window取得變數 ``` var x = 1; console.log(window.x) // 回傳1 ``` ### let與const無法透過window取得變數 ``` let x = 1; const y = 2; console.log(window.x,window.y) // 回傳undefined ``` ## const特性 ### 不能更改賦予的值 ``` const x = 1; x = 2 ; //回傳錯誤 ``` ### 可以更改物件屬性的值 ``` const number = {x:1,y:2.z:3}; number.x = 10; number.y = 20; number.z = 30; console.log(number) // 回傳 {x:10,y:20.z:30} ``` ### 可以更改陣列的值 ``` const number = [1,2,3] number[0] = 10; number[1] = 20; number[2] = 30; console.log(number) // 回傳 [10,20,30] ``` ### const使用時機 宣告一個不可更改的變數與值,例如太陽只有一個,或是週年慶的折扣及其他不想讓人更改的資料。 ex: 新光三越周年慶全館打九折,小明打算趁周年慶去購買60000元的洗衣機。 ``` const departmentSales = 0.9; const washingmachinePrice = 60000; let washingmachineNum = 1; //周年慶的折扣與洗衣機的標價,基本上不會改變,所以使用const。小明不確定會買幾台洗衣機所以使用let。 ``` ### 補充說明: **當我們宣告一個變數時,這個變數會在當下的環境去建立記憶體,而記憶體的有效範圍就稱為作用域,作用域又分為全域作用域、區域作用域。** **簡單來說,在函式之內所宣告的變數為區域作用域,反之在函式之外所宣告的變數皆為全域作用域。** 參考文獻: * https://codinggirl.timelog.to/a174653905 * https://wcc723.github.io/javascript/2017/12/06/javascript-variables/ * https://pjchender.blogspot.com/2016/03/javascriptby-referenceby-value.html * https://iter01.com/548218.html * https://ithelp.ithome.com.tw/articles/10103799