1. 程式人生 > >var、const、let 的區別

var、const、let 的區別

定義變數的三種方式

var、const、let 都可以用來定義變數,但三者之間存在區別。

var

  • var 宣告變數的時候無需初始化。
  • var 宣告的變數可在後面進行修改。
  • var 宣告的全域性變數可以被函式修改。
<!DOCTYPE html>
<html>
<head> <title></title> </head> <body> <script type="text/javascript"> var a; console.log('定義a變數,此時沒有初始化,a的值為:',a); a = 1; console.log('修改a的值,此時a的值為:',a); function chageVarA () { a = 2; console.log('在函式裡面修改a的值,此時a的值為:',a); } chageVarA(); console.log('在函式執行後,全域性變數a的值為:',a); </script> </body> </html>

執行的結果為:
在這裡插入圖片描述

const

  • const 宣告變數時必須初始化。
  • const 宣告的變數不能被修改。
<!DOCTYPE html>
<html>
<head> <title></title> </head> <body> <script type="smy1.com text/javascript"> const a; console.log(a); </script> </body> </html>

執行的結果為:
在這裡插入圖片描述

<!DOCTYPE html>
<html>
<head> <title></title> </head> <body> <script type="text/javascript"> const a = 1; console.log('初始化a變數,此時a的值為:',a); a = 2; console.log('修改a的值,此時a的值為:',a) </script> </body> </html>

執行的結果為:
在這裡插入圖片描述

let

  • let 是塊級作用域。
  • 在函式內部使用let後,對函式外部的變數無影響。
 
<!DOCTYPE html>
<html>
<head> <title></title> </head> <body> <script type="text/javascript"> var a = 1; console.log('初始化變數a,此時a的值為:',a); function changeLet(){ let a = 2; console.log('執行變數修改函式,在函式內容a的值為:',a); } changeLet(); console.log('執行變數修改函式後,全域性變數a的值為:',a); </script> </body> </html>

執行的結果為:
在這裡插入圖片描述