您的位置:首页 > 其它

ECMAScript6入门简述&索引篇(摘自阮一峰的《ECMAScript 6 入门》)

2017-03-02 15:34 435 查看

函数扩展

1、函数参数可以有默认值

function log(x, y = 'World') {
console.log(x, y);
}


2、rest参数

rest参数的形式为:“…变量名”,用于获取函数的多余参数,这样就不需要使用arguments对象了。rest 参数搭配的变量是一个数组,该变量将多余的参数放入数组中。

3、扩展运算符

扩展运算符(spread)是三个点(…)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。

4、箭头函数

var f = v => v;


等同于

var f = function(v) {
return v;
};


另外,函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。也就是说,箭头函数可以绑定this对象,大大减少了显式绑定this对象的写法。

详见:

http://es6.ruanyifeng.com/#docs/function

Promise 对象

Promise 是异步编程的一种解决方案,比传统的解决方案——回调函数和事件(callback)——更合理、更强大。

基本用法:

var promise = new Promise(function(resolve, reject) {
// ... some code

if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});


Promise构造函数接受一个函数作为参数,该函数的两个参数分别是resolve和reject。它们是两个函数,由JavaScript引擎提供,不用自己部署。

resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从Pending变为Resolved),在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从Pending变为Rejected),在异步操作失败时调用,并将异步操作报出的错误,作为参数传递出去。


Promise实例生成以后,可以用then方法分别指定Resolved状态和Reject状态的回调函数。

promise.then(function(value) {
// success
}, function(error) {
// failure
});

then方法可以接受两个回调函数作为参数。
第一个回调函数是Promise对象的状态变为Resolved时调用,
第二个回调函数是Promise对象的状态变为Reject时调用。
其中,第二个函数是可选的,不一定要提供。
这两个函数都接受Promise对象传出的值作为参数。


详细说明参见:http://es6.ruanyifeng.com/#docs/promise

Generator 函数的语法

Generator 函数是 ES6 提供的一种异步编程解决方案。

从语法上,首先可以把它理解成,Generator 函数是一个状态机,封装了多个内部状态。

执行 Generator 函数会返回一个遍历器对象,也就是说,Generator 函数除了状态机,还是一个遍历器对象生成函数。返回的遍历器对象,可以依次遍历 Generator 函数内部的每一个状态。

形式上,Generator 函数是一个普通函数,但是有两个特征。一是,function关键字与函数名之间有一个星号;二是,函数体内部使用yield语句,定义不同的内部状态(yield在英语里的意思就是“产出”)。

例如:

function* helloWorldGenerator() {
yield 'hello';
yield 'world';
return 'ending';
}

var hw = helloWorldGenerator();


上面代码定义了一个Generator函数helloWorldGenerator,它内部有两个yield语句“hello”和“world”,即该函数有三个状态:hello,world和return语句(结束执行)。

然后,Generator函数的调用方法与普通函数一样,也是在函数名后面加上一对圆括号。不同的是,调用Generator函数后,该函数并不执行,返回的也不是函数运行结果,而是一个指向内部状态的指针对象,也就是上一章介绍的遍历器对象(Iterator Object)。

下一步,必须调用遍历器对象的next方法,使得指针移向下一个状态。也就是说,每次调用next方法,内部指针就从函数头部或上一次停下来的地方开始执行,直到遇到下一个yield语句(或return语句)为止。换言之,Generator函数是分段执行的,yield语句是暂停执行的标记,而next方法可以恢复执行。

hw.next()
// { value: 'hello', done: false }

hw.next()
// { value: 'world', done: false }

hw.next()
// { value: 'ending', done: true }

hw.next()
// { value: undefined, done: true }


由于Generator函数返回的遍历器对象,只有调用next方法才会遍历下一个内部状态,所以其实提供了一种可以暂停执行的函数。yield语句就是暂停标志。

由于Generator函数就是遍历器生成函数,因此可以把Generator赋值给对象的Symbol.iterator属性,从而使得该对象具有Iterator接口。

详细内容参见:http://es6.ruanyifeng.com/#docs/generator

async 函数

async 函数是什么?一句话,它就是 Generator 函数的语法糖。

详细内容见:

http://es6.ruanyifeng.com/#docs/async

Module

模块功能主要由两个命令构成:export和import。export命令用于规定模块的对外接口,import命令用于输入其他模块提供的功能。

// ES6模块
import { stat, exists, readFile } from 'fs';


// profile.js
export var firstName = 'Michael';
export var lastName = 'Jackson';
export var year = 1958;


详细见:

http://es6.ruanyifeng.com/#docs/module
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: