ES6笔记三

yield*语句

如果yield命令后面跟的是一个遍历器，需要在yield命令后面加上星号，表明它返回的是一个遍历器。这被称为yield*语句

Generator是一个普通函数，但是有两个特征。一是，function命令与函数名之间有一个星号；二是，函数体内部使用yield语句，定义遍历器的每个成员，即不同的内部状态（yield语句在英语里的意思就是“产出”）。

ES6的Promise对象是一个构造函数，用来生成Promise实例。下面是Promise对象的基本用法。

var promise = new Promise(function(resolve, reject) {
  if (/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }});
  
  promise.then(function(value) {
  // success}, function(value) {
  // failure});

var getJSON = function(url) {
  var promise = new Promise(function(resolve, reject){
    var client = new XMLHttpRequest();
    client.open("GET", url);
    client.onreadystatechange = handler;
    client.responseType = "json";
    client.setRequestHeader("Accept", "application/json");
    client.send();

    function handler() {
      if (this.status === 200) { 
              resolve(this.response); 
          } else { 
              reject(new Error(this.statusText)); 
          }
    };
  });
  return promise;
  };
  
  getJSON("/posts.json").then(function(json) {
      console.log(‘Contents: ‘ + json);
      }, function(error) {
  console.error(‘出错了‘, error);});

generator

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

var hw = helloWorldGenerator();

hw.next() // { value: ‘hello‘, done: false }
hw.next() // { value: ‘world‘, done: false }
hw.next() // { value: ‘ending‘, done: true }
hw.next() // { value: undefined, done: true }

function* foo(x) {
  var y = 2 * (yield (x + 1));
  var z = yield (y / 3);
  return (x + y + z);
 }
 
 var it = foo(5);
 it.next()// { value:6, done:false }
 it.next(12)// { value:8, done:false }
 it.next(13)// { value:42, done:true }
 由于next方法的参数表示上一个yield语句的返回值，所以第一次使用next方法时，不能带有参数

function *foo() {
  yield 1;
  yield 2;
  yield 3;
  yield 4;
  yield 5;
  return 6;}
  
  for (let v of foo()) {
      console.log(v);
  }
  
  // 1 2 3 4 5

function* fibonacci() {
    let [prev, curr] = [0, 1];
    for (;;) {
        [prev, curr] = [curr, prev + curr];
        yield curr;
    }
}

for (let n of fibonacci()) {
    if (n > 1000) break;
    console.log(n);
}

var g = function* () {
    while (true) {
        try {
            yield;
        } catch (e) {
            if (e != ‘a‘) {
                throw e;
            }
            console.log(‘内部捕获‘, e);
        }
    }
  };
  
  var i = g(); 
  i.next();
  try {
    i.throw(‘a‘);
    i.throw(‘b‘);
   } catch (e) {
    console.log(‘外部捕获‘, e);
    }
    // 内部捕获 a
    // 外部捕获 b

foo(‘a‘, function (a) {
    if (a.error) {
        throw new Error(a.error);
    }

    foo(‘b‘, function (b) {
        if (b.error) {
            throw new Error(b.error);
        }

        foo(‘c‘, function (c) {
            if (c.error) {
                throw new Error(c.error);
            }

            console.log(a, b, c);
        });
    });});

使用Generator函数可以大大简化上面的代码。

function* g(){
  try {
        var a = yield foo(‘a‘);
        var b = yield foo(‘b‘);
        var c = yield foo(‘c‘);
    } catch (e) {
        console.log(e);
    }

  console.log(a, b, c);}

let delegatedIterator = (function* () {
  yield ‘Hello!‘;
  yield ‘Bye!‘;}());
  
let delegatingIterator = (function* () {
  yield ‘Greetings!‘;
  yield* delegatedIterator;
  yield ‘Ok, bye.‘;}());
  
for(let value of delegatingIterator) {
  console.log(value);}
  
  // "Greetings!
  // "Hello!"
  // "Bye!"
  // "Ok, bye."

如果yield*后面跟着一个数组，就表示该数组会返回一个遍历器，因此就会遍历数组成员。

function* gen(){
  yield* ["a", "b", "c"];}
  
 gen().next() 
 
 // { value:"a", done:false }

上面代码中，yield命令后面如果不加星号，返回的是整个数组，加了星号就表示返回的是数组的遍历器。

yield*命令可以很方便地取出嵌套数组的所有成员。

function* iterTree(tree) {
  if (Array.isArray(tree)) {
    for(let i=0; i < tree.length; i++) {
      yield* iterTree(tree[i]);
    }
  } else {
    yield tree;
  }
}

const tree = [ ‘a‘, [‘b‘, ‘c‘], [‘d‘, ‘e‘] ];

for(let x of iterTree(tree)) {
  console.log(x);
 }
 // a
 // b
 // c
 // d
 // e

下面是一个稍微复杂的例子，使用yield*语句遍历完全二叉树。

// 下面是二叉树的构造函数，
// 三个参数分别是左树、当前节点和右树
function Tree(left, label, right) {
  this.left = left;
  this.label = label;
  this.right = right;
}

// 下面是中序（inorder）遍历函数。
// 由于返回的是一个遍历器，所以要用generator函数。
// 函数体内采用递归算法，所以左树和右树要用yield*遍历

function* inorder(t) {
  if (t) {
    yield* inorder(t.left);
    yield t.label;
    yield* inorder(t.right);
  }
}

// 下面生成二叉树
function make(array) {
  // 判断是否为叶节点  
  if (array.length == 1) 
      return new Tree(null, array[0], null);
  return new Tree(make(array[0]), array[1], make(array[2]));
 }
 
 let tree = make([[[‘a‘], ‘b‘, [‘c‘]], ‘d‘, [[‘e‘], ‘f‘, [‘g‘]]]);
 
 // 遍历二叉树
 var result = [];
 for (let node of inorder(tree)) {
  result.push(node); 
 }
 
 result
 // [‘a‘, ‘b‘, ‘c‘, ‘d‘, ‘e‘, ‘f‘, ‘g‘]