ES6 - 变量

上一页
下一页

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

  • 标识符不能是关键字。

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

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

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

类型语法

必须在使用变量之前声明它。ES5 语法使用var关键字来实现相同的功能。声明变量的 ES5 语法如下所示。

//Declaration using var keyword 
var  variable_name

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

  • 使用 let。
  • 使用 const。

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

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

//Declaration using var keyword 
var variable_name = value

示例：使用变量

var name = "Tom" 
console.log("The value in the variable is: "+name)

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

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

The value in the variable is Tom

JavaScript 和动态类型

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

Explore our latest online courses and learn new skills at your own pace. Enroll and become a certified expert to boost your career.

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时，将返回全局作用域实例。

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

value of num outside test() 10
value of num in test() 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 // number type
   console.log(typeof balance)
   let balance = {message:"hello"} // changing number to object type
   console.log(typeof balance)
</script>

以上代码将导致以下错误：

Uncaught SyntaxError: Identifier 'balance' has already been declared

let 和多个块

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

示例

<script>
   let count = 100
   for (let count = 1;count <= 10;count++){
      //inside for loop brackets ,count value starts from 1
      console.log("count value inside loop is ",count);
   }
   //outside for loop brackets ,count value is 100
   console.log("count value after loop is",count);

   if(count == 100){
      //inside if brackets ,count value is 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 // will result in an error!!

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

常量是不可变的

与使用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)
   //re assigning variable employee ids
   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
打印页面
上一页
下一页
广告