javascript
javascript 声明变量var、let、const详解及示例
1. var、let、const概述
ES6發布前,Javascript只能通過var聲明變量的方式,常量、塊級變量、函數變量這些概念的差別都不能很好的體現出來,于此同時,加入你要使用或者提供一個api,var聲明的變量可隨時被修改和重新分配的問題,會讓你時刻擔心代碼是否能正常運行。
ES6為我們帶來了let、const,我們先來了解一下三個標識符的特征:
var: var定義一個變量,這個變量可以被重新分配、可能會被用于整個函數(Function Scope)
let: let定義一個變量,這個變量可以被重新分配,但let可以被用于塊級作用域(Block Scope),不存在變量提升
const: const定義一個常量,不可以被重新分配
下面,我們將從作用域、變量提升、變量重新分配幾個方面講解var、let、const的差別以及用法實踐。
2. 作用域
var的作用域
當var定義的變量在函數內部時,通過函數外部調用變量,會導致 Uncaught ReferenceError: i is not defined 錯誤:
function doSomeThing () {var i = 1; }console.log(i); // Uncaught ReferenceError: i is not defined但是,在if、for、while這樣的塊級語句內通過var聲明變量,仍然可以在塊語句外部訪問:
if (true) {var i = 1; } console.log(i); // 1let的作用域
let定義了一個擁有塊級作用域屬性的變量,同樣的代碼我們用let聲明變量可以看看結果:
if (true) {let j = 1; } console.log(j); // Uncaught ReferenceError: j is not definedconst的作用域
const的作用域規則和let類似,同樣的代碼我們用const聲明變量可以看看結果:
if (true) {const k = 1; } console.log(k); // Uncaught ReferenceError: k is not defined3. 變量提升
先說結論:var聲明的變量存在變量提升,let和const則不會
來一個例子體會一下:
console.log(m); // undefined var m = 1;console.log(n); // Uncaught ReferenceError: n is not defined let n = 1;console.log(v); const v = 1; // Uncaught ReferenceError: v is not defined推薦使用let和const理由之一,就是可以避免在使用后面聲明的變量時出現未知錯誤。
4. let、const用法示例
明白var、let、const的區別,有助于我們用更簡潔易懂的方式表達我們的代碼。
先看看什么情況下你才用var?
通過上面的介紹,我們大概了解到var區別于let、const的地方在是:函數作用域、可被修改、變量提升,所以在函數聲明優先于變量聲明,但是函數調用在變量聲明之后的邏輯里可以用到var。
var f = {doThings: function () {console.log(i);} } var i = 1; // 聲明變量// 函數調用 f.doThings(); // 1使用let的場景?
let一般用于for(while)循環和數學表達式計算中
for (let i = 0, len = 100; i < len; i++) {console.log(i); }那么有個問題,上面的for循環用var聲明i變量也是可以的啊?
再來看一段代碼:
for (var i = 0; i < 100; i++) {setTimeout(function() {console.log(i);}, i * 1000); }// 控制臺會一直輸出100 // 改成 letfor (let i = 0; i < 100; i++) {setTimeout(function() {console.log(i);}, i * 1000); }解釋一下為什么會這樣:let的作用局的塊級作用局,即每次循環的i的作用域就是本次循環,下一次循環重新定義變量i。
const的使用場景?
const聲明了一個常量,推薦將const常量用于別名,降低常量的記憶難度。
const COLOR_RED = "#F00"; const COLOR_GREEN = "#0F0"; const COLOR_BLUE = "#00F"; const COLOR_ORANGE = "#FF7F00";結束
建議在"use strict"模式下,使用let和const替代var,以保證代碼的整潔和可讀。
總結
以上是生活随笔為你收集整理的javascript 声明变量var、let、const详解及示例的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: node项目架构与优化
- 下一篇: SpringBoot同时集成Redis和