基本简介:
ECMAScript 和 JavaScript 的关系是,前者是后者的规格,后者是前者的一种实现。各大浏览器的最新版本,对 ES6 的支持可以查看kangax.github.io/es5-compat-table/es6/。随着时间的推移,支持度已经越来越高了,超过90%的 ES6 语法特性都实现了!
这里给大家推荐一个ES6转成ES5的Babel 转码器。
方便之前会ES5的人学习ES6,方便转码查看原理。阮一峰大神对ES6的介绍
下载Babel指令:
npm install --save-dev babel-cli babel-preset-env
Create a .babelrc file (or use your [package.json]
(在你的.babelrc 文件里面 添加下面内容)
{
"presets": ["env"]
}
若还未看懂的可以到官网上好好查看文档
点击传送门
ES6新增属性:
1 let 属性
ES6 新增了let命令,用来声明变量。它的用法类似于var,但是所声明的变量,只在let命令所在的代码块内有效。
{ let a=8;
var b=1;
}
a//. a is not defind.
b//1
上面代码在代码块之中,分别用let和var声明了两个变量。然后在代码块之外调用这两个变量,结果let声明的变量报错,var声明的变量返回了正确的值。这表明,let声明的变量只在它所在的代码块有效。
let 配合for
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[6](); // 6
上面的i是let定义的 每次循环。都会有自己一个新的变量,关键的是每次循环都会有自己的不同作用域。成功取到对应的值。换成是var 来定义的i。只能返回10
不允许重复声明
let不允许在相同作用域内,重复声明同一个变量。也不能在函数内部重新声明参数
// 报错
function () {
let a = 10;
var a = 1;
}
// 报错
function () {
let a = 10;
let a = 1;
}
function func(arg) {
let arg; // 报错
}
function func(arg) {
{
let arg; // 不报错
}
}
2 块级作用域
let实际上为 JavaScript 新增了块级作用域。
块级作用域的出现,实际上使得获得广泛应用的立即执行函数表达式(IIFE)不再必要了。
// IIFE 写法
(function () {
var tmp = ...;
...
}());
// 块级作用域写法
{
let tmp = ...;
...
}
3 const 命令
const声明一个只读的常量。一旦声明,常量的值就不能改变。
常用来存放地址,图片路径等。
const声明的常量,也与let一样不可重复声明。(定义过了就不能在去定定义)
// IIFE 写法
var message = "Hello!";
let age = 25;
// 以下两行都会报错
const message = "Goodbye!";
const age = 30;