es6經常使用語法（二）

Promise 對象

---

Promise 是異步編程的一種解決方案，比傳統的解決方案——回調函數和事件——更合理和更強大。它由社區最先提出和實現，ES6 將其寫進了語言標準，統一了用法，原生提供了Promise對象.

• 基本用法

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

  if (/* 異步操做成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});
promise.then(function(value) {
  // success
}, function(error) {
  // failure
});
複製代碼

Promise實例生成之後，能夠用then方法分別指定resolved狀態和rejected狀態的回調函數。

function timeout(ms) {
   return new Promise((resolve, reject) => {
     setTimeout(resolve, ms, 'done');
   });
 }
 
 timeout(100).then((value) => {
   console.log(value);
 });
複製代碼

Generator 函數的語法

• 基礎語法

Generator 函數有多種理解角度。語法上，首先能夠把它理解成，Generator 函數是一個狀態機，封裝了多個內部狀態。

function* Test() {
  yield 'start';
  yield 'next';
  return 'end';
}

var hw = Test();
hw.next()
// { value: 'start', done: false }

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

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

hw.next()
// { value: undefined, done: true }
複製代碼

上面代碼定義了一個 Generator 函數helloWorldGenerator，它內部有兩個yield表達式（start和next），即該函數有三個狀態：star，next 和 return 語句（結束執行）。

yield 表達式,遇到yield表達式，就暫停執行後面的操做，並將緊跟在yield後面的那個表達式的值，做爲返回的對象的value屬性值

function* gen() {
  yield  12+10;
  yield  method();
}
複製代碼

• Generator 函數的異步應用

async 函數

async 函數就是 Generator 函數的語法糖。它是平時最經常使用的異步函數。

const asyncReadFile = async function () {
  const f1 = await readFile('/etc/fstab');
  const f2 = await readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};
複製代碼

因爲async函數返回的是 Promise 對象，能夠做爲await命令的參數。因此，上面的例子也能夠寫成下面的形式。

//
function timeout(msg,ms) {
  return new Promise((resolve) => {
    setTimeout(function(){
      resolve(msg)
    }, ms);
  });
}
async function asyncPrint(msg, ms) {
  let a = await timeout(msg,ms);
  console.log(a);
}
asyncPrint('ok', 1000);//1s後打印 ok
//await 後也能夠直接返回值
function Sync(ms) {
  return ms
}
async function Test(ms) {
  let a =  await Sync(ms);
  console.log(a);
}
Test('ok') //ok
複製代碼

返回 Promise 對象

async function fuc() {
  return 'ok';
}

fuc().then(r => console.log(r))
// 'ok'
複製代碼

錯誤處理

async function func() {
  await new Promise(function (resolve, reject) {
    throw new Error('出錯了');
  });
}

func()
.then(v => console.log(v))
.catch(e => console.log(e))
// Error：出錯了
複製代碼

Class語法

ES6 的class能夠看做只是一個語法糖，它的絕大部分功能，ES5 均可以作到，新的class寫法只是讓對象原型的寫法更加清晰、更像面向對象編程的語法而已。

• Class 的基本用法

class Super {
    
  //構造方法
  constructor(x, y) {
    this.x = x;
    this.y = y;
  }
  //靜態變量
  static classVar = [];
  //靜態方法
  static classMethod() {
    return 'hello';
  }
   // 私有方法
  _priviteMethod(baz) {
      return this.x;
    }
  // 公有方法 
  toString() {
    return '(' + this.x + ', ' + this.y + ')';
  }
}
複製代碼

• Class 的繼承

Class 能夠經過extends關鍵字實現繼承，這比 ES5 的經過修改原型鏈實現繼承，要清晰和方便不少。

class ColorPoint extends Point {
  constructor(x, y, color) {
    super(x, y); // 調用父類的constructor(x, y)
    this.color = color;
  }

  toString() {
    return this.color + ' ' + super.toString(); // 調用父類的toString()
  }
}
複製代碼