JavaScript 变量声明之三种方式

前言：

​ 变量有两种类型：全局变量和局部变量。

​ 全局变量声明在函数体外，任何地方都可访问到此变量。

​ 局部变量声明在函数体内，此变量只有在声明的函数体内可以访问并使用。

一、使用 var 关键字声明

​ 使用 var 可以声明全局变量和局部变量。

​ 声明全局变量：

<script type="text/javascript">
   var t = 123; // 声明全局变量 t
   function f () {
      
   }
   alert(t); // 结果为 123
</script>

​ 声明局部变量：

<script type="text/javascript">
	function f () {
		var t = 456;
     	alert(t); // 结果为 456
	}
	f();
</script>

​ 如果函数外声明过一个全局变量，那么在函数内再次声明这个变量时，使用 var 和不使用 var 是有区别的。

<script type="text/javascript">
   var t = 123; // 声明全局变量 t
   function f () {
      t = 456; // 不使用 var 声明局部变量 t
      alert(t); // 结果为 456
   }
   f();
   alert(t);  // 结果为 456
</script>

​ 因为在函数体内声明局部变量 t 时没有使用 var 关键字，全局变量 t 的值最终被局部变量 t 的值替换。

<script type="text/javascript">
   var t = 123; // 声明全局变量 t
   function f () {
      var t = 456; // 使用 var 声明局部变量 t
      alert(t); // 结果为 456
   }
   f();
   alert(t);  // 结果为 123
</script>

​ 因为在函数体内声明局部变量 t 时使用了 var 关键字，全局变量 t 的值最终没有被局部变量 t 的值替换。

二、使用 const 关键字声明

​ const 关键字用来修饰常量，const 定义的常量的值不可被改变，而且还要赋初值，声明位置不限制，通常在开头使用。

<script type="text/javascript">
		const t = 123;
		function f () {
			t = 456;
		}
		f();
		alert(t);
	</script>

以上代码浏览器会报错 Uncaught TypeError: Assignment to constant variable.。

三、使用 let 关键字声明

let 关键字声明的变量作用域限制在块级域中，即 {} 中。

<script type="text/javascript">
		function f () {
			let t = 123;
		}
		alert(t);
	</script>

以上代码浏览器会报错 Uncaught ReferenceError: t is not defined。

因为在函数体外使用变量 t ，超出了它的作用域。