教程 > ES6 教程 > ES6 基础 阅读:33

ES6 变量

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

  • 标识符不能是关键字。
  • 标识符可以包含字母和数字。
  • 标识符不能包含空格和特殊字符,除了下划线(_)和美元($)标志。
  • 变量名称不能以数字开头。

类型语法

必须在使用变量之前声明它。 ES5语法使用 VAR 关键字实现相同的内容。 用于声明变量的ES5语法如下。

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

ES6引入以下变量声明语法

  • 使用 let
  • 使用 const

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

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

// 使用var关键字声明
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会自动处理它。 此功能称为动态类型。


JavaScript 变量范围

变量的范围是定义程序的区域。 传统上,JavaScript仅定义了两个Scopes-Global和本地。

  • 全局范围 - 可以从JavaScript代码的任何部分中访问具有全局范围的变量。
  • 本地范围 - 可以从声明其声明的函数中访问带有本地范围的变量。

示例:全局与本地变量

下面的示例用名称数字声明两个变量 - 一个函数之外(全局范围),另一个在函数(本地范围)中。

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定义了一个新的变量范围 - block 范围。


let 和 block 范围

block 范围限制了变量对声明的块的访问。 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 和 block 安全

如果我们尝试在同一块内两次声明 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 count = 100
for (let count = 1;count <= 10;count++){
    // 内部用于循环括号,计数值从1开始
    console.log("count value inside loop is ",count);
}
// 外部用于循环括号,计数值为100
console.log("count value after loop is",count);

if(count == 100){
    //  内部 计数值为50
    let count = 50;
    console.log("count inside if block",count);
}
console.log(count);

上述代码的输出将如下

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 x = 10
x = 12 // 将导致错误!!

上面的代码将返回错误,因为常数不能重新分配值。 常数变量是不变的。


常数是不变的

与使用LET关键字声明的变量不同,常数是不变的。 这意味着其值无法更改。 例如,如果我们尝试更改常数变量的值,将显示错误。

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

上述代码执行之后结果如下

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

const 和数组

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

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)

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

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块之外访问。 这是因为变量使用 var 关键字支持 hoisting 声明。

var 提升

变量提升允许在javaScript程序中使用变量,甚至在声明该变量之前。 此类变量将初始化为默认情况下的未定义。 JavaScript运行时将扫描可变声明,并将其放在函数或脚本的顶部。 用 var 关键字声明的变量将悬挂在顶部。 考虑以下示例

variable company is hoisted to top , var company = undefined
console.log(company); // 在声明之前使用变量
var company = "Jiyik"; // 在这里声明并初始化
console.log(company);

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

undefined
Jiyik

var 和块范围

块范围限制了变量对声明的块的访问。 var 关键字将函数范围分配给变量。 使用 var 关键字声明的变量没有块范围。 考虑以下示例

// 悬挂在顶部; var i = undefined
for (var i = 1;i <= 5;i++){
    console.log(i);
}
console.log("after the loop i value is "+i);

上述代码的输出将如下

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

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


var 和块水平安全

如果我们使用块中的 var 关键字两次声明相同的变量,则编译器不会丢弃错误。 但是,这可能会导致运行时出乎意料的逻辑错误。

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

上述代码的输出如下所示

number
object

查看笔记

扫码一下
查看教程更方便