ECMAScript 6.0(简称：ES6)是 JavaScript 语言的下一代标准，于2015年6月正式发。目标是使得JavaScript语言可以用来编写复杂的大型应用程序，成为企业级开发语言。现在企业中的项目基本都采用ES6开发，因此学好ES6就变得尤为重要!接下来的郑州Web前端入门学习课，千锋老师就给大家简单梳理一下ES6属性知识。

　　let/const

　　ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。

　　{

　　let a = 10;

　　var b = 1;}

　　a // ReferenceError: a is not defined.

　　b // 1

　　上面代码在代码块之中，分别用let和var声明了两个变量。然后在代码块之外调用这两个变量，结果let声明的变量报错，var声明的变量返回了正确的值。这表明，let声明的变量只在它所在的代码块有效。

　　for循环的计数器，就很合适使用let命令。

　　var oLis = document.getElementsByTagName('li')

　　for (let i = 0; i < oLis.length; i++) {

　　// ...

　　oLis[i].onclick = function(){

　　console.log(i)// 0 1 2 3 4

　　}

　　}

　　console.log(i);

　　// ReferenceError: i is not defined

　　//上面代码相当与产生了几个块级作用域

　　{

　　var i=0;

　　oLis[i].onclick = function(){

　　console.log(i)

　　}

　　}

　　{

　　var i=1;

　　oLis[i].onclick = function(){

　　console.log(i)

　　}

　　}

　　上面代码中，计数器i只在for循环体内有效，在循环体外引用就会报错。

　　ES5只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景，let实际上为JavaScript新增了块级作用域。

　　var命令会发生”变量提升“现象，即变量可以在声明之前使用，值为undefined。这种现象多多少少是有些奇怪的，按照一般的逻辑，变量应该在声明语句之后才可以使用。

　　为了纠正这种现象，let命令改变了语法行为，它所声明的变量一定要在声明后使用，否则报错。

　　var命令会发生”变量提升“现象，即变量可以在声明之前使用，值为undefined。这种现象多多少少是有些奇怪的，按照一般的逻辑，变量应该在声明语句之后才可以使用。

　　为了纠正这种现象，let命令改变了语法行为，它所声明的变量一定要在声明后使用，否则报错。

　　const命令

　　const声明一个只读的常量。一旦声明，常量的值就不能改变。

　　const声明的变量不得改变值，这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值。

　　const PI = 3.1415;

　　PI // 3.1415

　　PI = 3;

　　// TypeError: Assignment to constant variable.

　　上面代码表明改变常量的值会报错。

　　箭头函数 =>

　　ES6 允许使用“箭头”(=>)定义函数。

　　var f = v => v;

　　// 等同于

　　var f = function (v) {

　　return v;};

　　如果箭头函数不需要参数或需要多个参数，就使用一个圆括号代表参数部分。

　　var f = () => 5;

　　// 等同于

　　var f = function () { return 5 };

　　var sum = (num1, num2) => num1 + num2;

　　// 等同于

　　var sum = function(num1, num2) {

　　return num1 + num2;};

　　如果箭头函数的代码块部分多于一条语句，就要使用大括号将它们括起来，并且使用return语句返回。

　　var sum = (num1, num2) => { return num1 + num2; }

　　箭头函数使得表达更加简洁。

　　const isEven = n => n % 2 == 0;

　　const square = n => n * n;

　　上面代码只用了两行，就定义了两个简单的工具函数。如果不用箭头函数，可能就要占用多行，而且还不如现在这样写醒目。

　　箭头函数的一个用处是简化回调函数。

　　// 正常函数写法

　　[1,2,3].map(function (x) {

　　return x * x;});

　　// 箭头函数写法

　　[1,2,3].map(x => x * x);

　　// 正常函数写法

　　var result = values.sort(function (a, b) {

　　return a - b;});

　　// 箭头函数写法

　　var result = values.sort((a, b) => a - b);

　　箭头函数有几个使用注意点。

　　1)函数体内的this对象，就是定义时所在的对象，而不是使用时所在的对象。

　　2)不可以当作构造函数，也就是说，不可以使用new命令，否则会抛出一个错误。

　　3)不可以使用arguments对象，该对象在函数体内不存在。

　　了解更多郑州Web前端入门知识点，你可以关注“千锋郑州校区”微信公众号，定期发布技术热点和行业趋势文章。你也可以来千锋郑州Web前端培训班进行系统的学习进阶，专业大牛讲师以项目驱动教学过程和内容，让你理论与实战兼备，快速就业拿高薪!

上一篇

郑州Java培训学习进阶之常用JSON库简介

下一篇

郑州Java学习教程之Tomcat入门知识点梳理