第一章前端开发ES6基础

认识ES6

概述

ES6表示ECMAScript规范的第六版,正式名称为ECMAScript 2015,ECMAScript是由ECMA国际标准组织制定的一项脚本语言的标准规范化,引入了许多新特性和语法。

其中包括箭头函数、let和const声明、类、模板字符串、解构赋值、参数默认值、展开操作符、Promise等等。这些新的特性让JavaScript更加现代化、灵活和易于使用

ES6可以在大多数现代浏览器中使用,也可以通过Babel等工具转换为ES5的语法以支持更旧的浏览器。除了浏览器之外,ES6还可以在Node.js环境下使用。总的来说,ES6已经成为现代JavaScript开发的标准,被广泛应用于各种前端和后端项目中。

ES6的目的是使JavaScript语言适应更复杂的应用,实现代码库之间的共享,并迭代维护新版本,成为企业级开发语言

关系

ECMAScriptJavaScript语言的国际标准

JavaScript是实现ECMAScript标准的脚本语言

关键字

let关键字
  • let关键字声明的变量只有所处的块级作用域有效,而不是在整个函数作用域内有效

块级作用域是指花括号{}包含的代码块,比如for循环或if语句中的代码块。其作用场景有两个方面:

  1. 防止代码块内层变量覆盖外层变量

这段代码中使用了let关键字来声明变量a。let关键字声明的变量具有块级作用域,即只在当前代码块内有效。在这个例子中,a只在if语句的代码块中定义,因此在代码块外部访问变量a时会报错,提示变量未定义。

具体地说,当执行到console.log(a)的时候,因为a只存在于if语句的块级作用域中,所以在块级作用域外部并不存在变量a,导致此处的console.log(a)执行时出现了引用错误

  1. 防止循环变量变成全局变量

这段代码使用了let关键字来声明变量i。在JavaScript中,let关键字声明的变量具有块级作用域,因此在代码块外部无法访问该变量。在这个例子中,for循环中的变量i只存在于for循环的代码块中,当循环结束后,变量i的作用域也就结束了,外部无法再访问该变量。因此,在代码块外部访问变量i时,会报错提示变量未定义。

具体来说,当执行到console.log(i)的时候,因为i只存在于for循环的块级作用域中,所以在块级作用域外部并不存在变量i,导致此处的console.log(i)执行时出现了引用错误。

提示:let关键字的好处是避免变量污染全局作用域,提高代码可维护性,也可以避免var声明变量时存在的变量提升问题,即在变量声明之前使用变量会导致不可预测的结果。

function foo() {
  let x = 1;  //只在 example 函数内部有效
  if (true) {
    let x = 2;  // 不同于外部的 x,只在 if 语句块内有效
    console.log(x); //输出2
  }
  console.log(x); //输出1
}
 

在if语句的块级作用域内声明的变量x只在该作用域内有效,不会影响到外部作用域的变量x,因此输出结果为2和1。

  • let关键字声明的变量不存在变量提升

在JavaScript中使用var关键字声明的变量时,变量可以先使用后声明,即变量的声明语句会被提前至作用域的顶部,但是变量的赋值语句仍然保留在原来的位置。这种现象称为变量提升

而使用let关键字声明的变量则不会发生变量提升,变量的声明和赋值必须在同一代码块内完成,否则会报错。这意味着,在使用let关键字声明变量之前,该变量的上下文中必须不存在对该变量的引用或调用,否则会抛出ReferenceError异常。

下面是一个简单的案例:


 

在上述例子中,使用let关键字声明了一个名为count的变量,并将其初始化为0。但是,在第一行调用count时,由于使用let关键字声明的变量不存在变量提升,count变量未被定义,代码会抛出引用错误。

  • let关键字声明的变量具有暂时性死区特性

暂时性死区是指在代码块中(例如,函数、循环或块语句中)使用let或const声明变量时,变量在声明前无法被访问。在该变量声明之前的任何访问都将导致“ReferenceError”。

具体来说只要块级作用域内存在let命令,它所声明的变量就“绑定”(binding)了这个区域,不再受外部的影响。这意味着在变量声明前,该变量是不能被访问或调用的。

以下是一个例子,展示了let关键字声明的变量具有暂时性死区特性:


                    
                    

你可能感兴趣的:(es6,前端)