了解javascript中變量及函數的提升

javascript中變量以及函數的提升，在我們平時的項目中其實還是挺常用的，尤其是大型項目中，不知不覺就會順手添加一些變量，而有時候自己的不小心就會釀成一些不必要錯誤，趁有時間整理一下自己對于js中變量及函數提升的理解。

首先，看一個題目：

console.log(a); // undefined
var a = 1;
console.log(a); // 1
console.log(b());
function b(){return 2;} // 2
console.log(c) //報錯
let c = 4;
console.log(d()) // 報錯 
var d = function(){return 3;} // 報錯
(function(){
var m = n = 1;
})()
console.log(m) //報錯
console.log(n) // 1

上面的實例對于javascript變量及函數提升的可謂是淋漓盡致...

一、javascript 變量的提升

-函數及變量的聲明都將被提升到函數的最頂部

-變量可以在使用后聲明，也就是變量可以先使用再聲明

敲黑板，劃重點，是變量的聲明，聲明，聲明，當變量或函數已經初始化之后，就不會提升到函數的最頂部。這里上面的變量a已經初始化了，所以第一個console取不到變量a得值，為undefined；

注意：變量的提升只會提升到當前作用域下

二、javascript函數的提升

而函數b僅僅是先聲明了一個函數方法，函數c是函數表達式無法提升，所以在嚴格模式下b=2；d報錯

對于m,n，這里就涉及到javascript作用域的問題

首先，var m = n = 1的執行順序是什么？并不是我們大多數人心中所想的連續賦值，javascript的賦值是從右向左的，而是 n=1;var m = n;很好，一目了然，在函數作用域內的變量m=n，n是全局變量，最后嚴格模式下輸出結果，n=1，m報錯；

三、關于es6兩個關鍵字——let和const

let 聲明的變量只在 let 命令所在的代碼塊內有效，不存在變量的提升

const 聲明一個只讀的常量，一旦聲明，常量的值就不能改變。一旦聲明必須初始化，否則就會報錯

來個對比很明顯的栗子（完美的體現出let命令只在代碼塊內有效的意思）：

{
let test = 2;
var web = 'font';
}
console.log(test); // 報錯
console.log(web); // font

再次回到上面的題目，c就是報錯的

ES6 明確規定，代碼塊內如果存在 let 或者 const，代碼塊會對這些命令聲明的變量從塊的開始就形成一個封閉作用域。代碼塊內，在聲明變量 PI 之前使用它會報錯。

var PI = "a";
if(true){
console.log(PI); // 報錯，即使函數外面全局聲明了PI，但在代碼塊內還是會報錯
const PI = "3.1415926";
}

以上，就是關于javascript中變量提升的理解。

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。