JS變數提升原理與用法例項淺析
阿新 • • 發佈:2020-05-25
本文例項講述了JS變數提升。分享給大家供大家參考,具體如下:
該篇介紹什麼是變數提升,寫給像我一樣的JS新手看的
簡單來說變數提升就是 JS會把var變數的宣告自動提升到作用域的頂部,即使你不想這樣
一個例子: (區域性變數與全域性變數同名時,區域性變數覆蓋全域性變數)
var a="全域性變數"; function test() { document.writeln(a); var a="區域性變數"; document.writeln(a); } test();
上例的兩個輸出結果是
undefined區域性變數
第一個輸出並沒有輸出全域性變數a而是undefined,這就是變數提升導致的
上例等同與下例:
var a="全域性變數"; function test() { var a; document.writeln(a); a="區域性變數"; document.writeln(a); } test();
test函式內即使區域性變數a還沒定義,就已經覆蓋了全域性變數,可見其宣告已經生效了,
即變數宣告會自動提升到作用域的頂部,即使該語句並沒執行
如下例:
var x=100; var y=200; function test() { document.writeln(x); document.writeln(y); if(false) { var x=1; } return; var y=2; } test();
輸出結果:
undefinedundefined
等同如下形式:
var x=100; var y=200; function test() { var x,y; document.writeln(x); document.writeln(y); if(false) { x=1; } return; y=2; } test();
那麼怎麼解決這個問題呢?
用let變數!let變數執行到定義部分才會裝載,具體用法請自行查詢!
感興趣的朋友可以使用線上HTML/CSS/JavaScript程式碼執行工具:http://tools.jb51.net/code/HtmlJsRun測試上述程式碼執行效果。
更多關於JavaScript相關內容可檢視本站專題:《JavaScript常用函式技巧彙總》、《javascript面向物件入門教程》、《JavaScript錯誤與除錯技巧總結》、《JavaScript資料結構與演算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程式設計有所幫助。