HTML CSS JAVASCRIPT PYTHON PYTHON2 JAVA C C++ C# SQL Excel Linux AI BOOTSTRAP PHP 教程库 参考手册 技术文章 测验 练习 HOWTO FAQ
❮ 上一节 下一节 ❯

ES6 - 变量

根据定义，变量是"内存中的命名空间"，用于存储值。换句话说，它充当程序中值的容器。变量名称为标识符。以下是标识符的命名规则 −

  • 标识符不能是关键字。

  • 标识符可以包含字母和数字。

  • 标识符不能包含空格和特殊字符，下划线 (_) 和美元 ($) 符号除外。

  • 变量名不能以数字开头。

类型语法

变量必须在使用前声明。ES5 语法使用 var 关键字来实现相同的目的。 ES5 声明变量的语法如下。

//使用 var 关键字声明
var variable_name

ES6 引入了以下变量声明语法 −

  • 使用 let。
  • 使用 const。

变量初始化是指将值存储在变量中的过程。变量可以在声明时初始化，也可以在稍后的时间点初始化。

声明和初始化变量的传统 ES5 类型语法如下 −

//使用 var 关键字声明
var variable_name = value

示例:使用变量

var name = "Tom"
console.log("变量中的值为:"+name)

上述示例声明了一个变量并打印其值。

执行成功后将显示以下输出。

变量中的值为 Tom

JavaScript 和动态类型

JavaScript 是一种无类型语言。这意味着 JavaScript 变量可以保存任何数据类型的值。与许多其他语言不同，您不必在变量声明期间告诉 JavaScript 变量将保存什么类型的值。变量的值类型可以在程序执行期间发生变化，JavaScript 会自动处理。此功能称为动态类型。

JavaScript 变量范围

变量的范围是定义它的程序区域。传统上，JavaScript 仅定义两个范围 - 全局和本地。

  • 全局范围 − 具有全局范围的变量可以从 JavaScript 代码的任何部分访问。

  • 本地范围 −具有局部作用域的变量可以在声明它的函数内访问。

示例:全局变量与局部变量

以下示例声明了两个名为 num 的变量 - 一个在函数外(全局作用域)，另一个在函数内(局部作用域)。

var num = 10 
function test() { 
   var num = 100 
   console.log("value of num in test() "+num) 
} 
console.log("value of num outside test() "+num) 
test()

在函数内引用变量时，会显示本地作用域变量的值。但是，在函数外部访问变量 num 时，会返回全局作用域实例。

成功执行后将显示以下输出。

test() 外 num 的值 10
test() 内 num 的值 100

ES6 定义了一个新的变量作用域 - 块作用域。

Let 和块作用域

块作用域将变量的访问限制在声明它的块中。var 关键字为变量分配函数作用域。与 var 关键字不同，let 关键字允许脚本将对变量的访问限制在最近的封闭块中。

"use strict" 
function test() { 
   var num = 100 
   console.log("value of num in test() "+num) { 
      console.log("Inner Block begins") 
      let num = 200 
      console.log("value of num : "+num)  
   } 
} 
test()

该脚本在函数的局部范围内声明变量 num，并使用 let 关键字在块内重新声明该变量。当在内部块外部访问变量时，将打印局部范围变量的值，而在内部块内引用块范围变量。

注意 − 严格模式是一种选择加入受限制的 JavaScript 变体的方式。

成功执行后将显示以下输出。

value of num in test() 100 
Inner Block begins 
value of num : 200

示例: let 与 var

var no = 10; 
var no = 20; 
console.log(no);

成功执行上述代码后将显示以下输出。

20

让我们使用 let 关键字重写相同的代码。

let no = 10; 
let no = 20; 
console.log(no);

上述代码将抛出错误:标识符"no"已被声明。使用 let 关键字声明的任何变量都被分配了块范围。

let 和块级安全性

如果我们尝试在同一个块内两次声明 let 变量，它将抛出错误。请考虑以下示例 −

<script>
    let balance = 5000 // 数字类型
    console.log(typeof balance)
    let balance = {message:"hello"} // 将数字更改为对象类型
    console.log(typeof balance)
</script>

上述代码将导致以下错误 −

未捕获的语法错误:标识符"balance"已声明

let 和多个块

但是，相同的 let 变量可以在不同的块级作用域中使用，而不会出现任何语法错误。

示例

<script>
   let count = 100
   for (let count = 1;count <= 10;count++){
      //for循环括号内，计数值从1开始
      console.log("count value inside loop is ",count);
   }
   //在 for 循环括号外，计数值为 100
   console.log("count value after loop is",count);

   if(count == 100){
      //在 if 括号内，计数值为 50
      let count = 50;
      console.log("count inside if block",count);
   }
   console.log(count);
</script>

上述代码的输出将如下所示 −

count value inside loop is 1
count value inside loop is 2
count value inside loop is 3
count value inside loop is 4
count value inside loop is 5
count value inside loop is 6
count value inside loop is 7
count value inside loop is 8
count value inside loop is 9
count value inside loop is 10
count value after loop is 100
count inside if block 50
100

const

const 声明创建对值的只读引用。这并不意味着它所保存的值是不可变的，只是变量标识符不能重新分配。常量是块作用域的，与使用 let 语句定义的变量非常相似。常量的值不能通过重新分配来改变，也不能重新声明。

以下规则适用于使用 const 关键字声明的变量 −

  • 常量不能重新赋值。
  • 常量不能重新声明。
  • 常量需要初始化器。这意味着常量必须在声明期间初始化。
  • 分配给 const 变量的值是可变的。

示例

const x = 10
x = 12 // 将导致错误!!

上述代码将返回错误，因为常量不能重新赋值。常量变量是不可变的。

常量是不可变的

与使用 let 关键字声明的变量不同，常量是不可变的。这意味着它的值不能改变。例如，如果我们尝试更改常量变量的值，将显示错误。

<script>
   let income = 100000
   const INTEREST_RATE = 0.08
   income += 50000 // mutable
   console.log("changed income value is ",income)
   INTEREST_RATE += 0.01
   console.log("changed rate is ",INTEREST_RATE) //Error: not mutable
</script>

上述代码的输出将如下所示 −

changed income value is 150000
Uncaught TypeError: Assignment to constant variable

const 和数组

以下示例显示如何创建不可变数组。可以向数组添加新元素。但是，重新初始化数组将导致错误，如下所示 −

<script>
   const DEPT_NOS = [10,20,30,50]
   DEPT_NOS.push(40)
   console.log('dept numbers is ',DEPT_NOS)

   const EMP_IDS = [1001,1002,1003]
   console.log('employee ids',EMP_IDS)
   //重新分配变量员工 ID
   EMP_IDS = [2001,2002,2003]
   console.log('employee ids after changing',EMP_IDS)
</script>

上述代码的输出将如下所示 −

dept numbers is (5) [10, 20, 30, 50, 40]
employee ids (3) [1001, 1002, 1003]
Uncaught TypeError: Assignment to constant variable.

var 关键字

在 ES6 之前，var 关键字用于在 JavaScript 中声明变量。使用 var 声明的变量不支持块级作用域。这意味着如果在循环或 if 块 中声明变量，则可以在循环或 if 块 之外访问该变量。这是因为使用 var 关键字声明的变量支持提升。

var 和提升

变量提升 允许在 JavaScript 程序中使用变量，甚至在声明之前。默认情况下，此类变量将被初始化为 undefined。JavaScript 运行时将扫描变量声明并将它们放在函数或脚本的顶部。使用 var 关键字声明的变量将被提升到顶部。考虑以下示例 −

<script>
   variable company is hoisted to top , var company = undefined
   console.log(company); // using variable before declaring
   var company = "TutorialsPoint"; // declare and initialized here
   console.log(company);
</script>

上述代码的输出将如下所示 −

undefined
TutorialsPoint

var 和块作用域

块作用域将变量的访问限制在声明它的块中。var 关键字为变量分配函数作用域。使用 var 关键字声明的变量没有块作用域。请考虑以下示例 −

<script>
   //hoisted to top ; var i = undefined
   for (var i = 1;i <= 5;i++){
      console.log(i);
   }
   console.log("after the loop i value is "+i);
</script>

上述代码的输出将如下所示 −

1
2
3
4
5
after the loop i value is 6

变量 i 在 for 循环中使用 var 关键字声明。变量 i 在循环外部可访问。但是，有时可能需要在块内限制变量的访问。在这种情况下，我们不能使用 var 关键字。ES6 引入了 let 关键字来克服这一限制。

var 和块级安全性

如果我们在块中使用 var 关键字 两次声明相同的 变量，编译器不会抛出错误。但是，这可能会导致运行时出现意外的逻辑错误。

<script>
   var balance = 5000
   console.log(typeof balance)
   var balance = {message:"hello"}
   console.log(typeof balance)
</script>

上述代码的输出如下所示 −

number
object
❮ 上一节 下一节 ❯