1、模板字符串模板字符串
不使用ES6
使用+号降变量拼接喂字符串
例:var name ='My name is '+ first+' ' + last + '.'
使用ES6
将变量放在大括号之中:
例:var name = `Your name is ${first}${last}.`
2、解构赋值解构赋值
不使用ES6
var options = {
repeat: true,
save: false
};
// 从对象中提取数据
var repeat = options.repeat,
var save = options.save;
使用ES6
let node = {
type: "Identifier",
name: "foo"
};
let { type, name } = node;
console.log(type); // "Identifier"
console.log(name); // "foo"
3、对象属性简写对象扩展
不使用ES6
varbar ='bar';
varfoo =function()
{
// ...
}
varbaz = {
bar: bar,
foo: foo
};
使用ES6
varbar ='bar';
varfoo =function()
{
// ...
}
varbaz = { bar, foo };
4、箭头函数箭头函数
var f=()=>5;
// 等同于var f = function() { return5 };
var sum=(num1,num2)=>num1+num2;
// 等同于var sum = function(num1,num2) { return num1+num2; };
5、promisePromise
异步编程
var wait1000 = new Promise (function(resolve,reject){
setTimeout(resolve,1000)
});
wait1000.then(function(){
console.log("hello");// 1秒后输出"Hello"
return wait1000;
}).then(function(){
console.log("fundbug");// 2秒后输出"fundbug"
})
6、模块化Module
不使用ES6
Node.js采用CommenJS规范实现了模块化,而前端也可以采用,只是在部署时需要使用Browserify等工具打包。
module.js中使用module.exports导出port变量和getAccounts函数:
module.exports = {
port:3000,
getAccounts:function(){
...
}
}
main.js中使用require导入module.js:
varservice =require('module.js')
console.log(service.port)// 输出3000
使用ES6
export var port =3000
export function getAccounts(url){
...
}
main.js中使用import导入module.js,可以指定需要导入的变量:
import {port, getAccounts} from'module'
console.log(port)// 输出3000
7、ES7 asyncasync
es7标准引入了async函数,async函数是什么?它就是Generator函数的语法糖
async函数就是将Generator函数的星号(*)替换成async,将yield替换成await。
一:async函数相比Generator函数的改进
1、内置执行器
generator函数需要调用next方法或者用co模块才可以执行,async函数自带执行器
2、更好的语义
3、更广的适用性
4、返回值是promise
async函数的返回值是promise,Generator函数的返回值是Iterator
二:与其他异步处理方法的比较
例如实现一个用户登录
this.$http.jsonp('/login', (res) => {
this.$http.jsonp('/getInfo', (info) => {
// do something })
})
1、promise写法
2、Generator写法
3、async写法
8、Generator函数Generator异步函数
一:异步编程方法 见上一篇文章