##### 5 變數提升 看以下代碼, 或多或少會有些問題的. ```javascript function fn(){ console.log(name); var name = '大馬猴'; } fn() ``` 發現問題了麽. 這麼寫代碼, 在其他語言里. 絕對是不允許的. 但是在js里. 不 ...
5 變數提升
看以下代碼, 或多或少會有些問題的.
function fn(){
console.log(name);
var name = '大馬猴';
}
fn()
發現問題了麽. 這麼寫代碼, 在其他語言里. 絕對是不允許的. 但是在js里. 不但允許, 還能執行. 為什麼呢? 因為在js執行的時候. 它會首先檢測你的代碼. 發現在代碼中會有name使用. OK. 運行時就會變成這樣的邏輯:
function fn(){
var name;
console.log(name);
name = '大馬猴';
}
fn()
看到了麽. 實際運行的時候和我們寫代碼的順序可能會不一樣....這種把變數提前到代碼塊第一部分運行的邏輯被稱為變數提升. 這在其他語言里是絕對沒有的. 並且也不是什麼好事情. 正常的邏輯不應該是這樣的. 那麼怎麼辦? 在新的ES6中. 就明確了, 這樣使用變數是不完善的. es6提出. 用let來聲明變數. 就不會出現該問題了.
function fn(){
console.log(name); // 直接報錯, let變數不可以變數提升.
let name = '大馬猴';
}
fn()
結論一, 用let聲明變數是新版本javascript提倡的一種聲明變數的方案.
let還有哪些作用呢?
function fn(){
// console.log(name); // 直接報錯, let變數不可以變數提升.
// let name = '大馬猴';
var name = "JAY";
var name = "WLH"
/*註意, 報錯是發生在代碼檢查階段. 所以. 上述代碼根本就執行不了.
==結論二, 在同一個作用域內. let聲明的變數只能聲明一次. 其他使用上和var沒有差別=="; */
console.log(name);
}
fn()
顯然一個變數被聲明瞭兩次. 這樣也是不合理的. var本意是聲明變數. 同一個東西. 被聲明兩次. 所以ES6規定. let聲明的變數. 在同一個作用域內. 只能聲明一次.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>變數提升</title>
</head>
<body>
<script src = "變數提升.js"></script>
</body>
</html>
// // 變數提升
// function fn() {
// console.log(name);
// var name = '大馬猴';
// }
// fn();
//
// function fn() {
// var name;
// console.log(name);
// name = '大馬猴';
// }
// fn();
// // let 聲明變數可以避免變數提升問題
// function gn() {
// console.log(name); // 直接報錯, let變數不可以變數提升.
// let name = '大馬猴';
// }
// gn();
// function sn() {
// var name = 'jay';
// var name = 'wlh';
// console.log(name);
// } // 一個變數被聲明瞭兩次. 這樣也是不合理的
// sn(); // wlh
// // 在同一個作用域內. let聲明的變數只能聲明一次. 其他使用上和var沒有差別
// function xn() {
// let name = 'jay';
// console.log(name);
// let name = 'wlh';
// console.log(name);
// }
// xn(); // 報錯是發生在代碼檢查階段. 所以. 上述代碼根本就執行不了
本文來自博客園,作者:生而自由愛而無畏,轉載請註明原文鏈接:https://www.cnblogs.com/zczhaod/p/17639686.html