ES6的基礎(chǔ)知識(shí)(三)

lieeps 發(fā)布于2019-08-23 16:14 / 632人閱讀

摘要：會(huì)觸發(fā)方法第一個(gè)回調(diào)會(huì)觸發(fā)方法第二個(gè)回調(diào)或方法成功操作失敗操作會(huì)終止的執(zhí)行需要方法觸發(fā)向下執(zhí)行執(zhí)行結(jié)果實(shí)現(xiàn)的參數(shù)是一個(gè)函數(shù)有和兩個(gè)參數(shù)回調(diào)函數(shù)中會(huì)指向需要保存才會(huì)指向?qū)嵗龑?duì)象三種狀態(tài)分別為狀態(tài)只能從變成或者成功回調(diào)方法集合失敗回調(diào)方法集合觸

promise

// resolve()會(huì)觸發(fā)then方法第一個(gè)回調(diào), reject()會(huì)觸發(fā)then方法第二個(gè)回調(diào)或catch方法
let p = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (Math.random() > 0.5) {
      resolve("成功操作");
    } else {
      reject("失敗操作");
    }
  });
});

p.then(
  res => {
    console.log(res);
  },
  err => {
    console.log(err);
  }
);

generator

// yield會(huì)終止fn()的執(zhí)行,需要next()方法觸發(fā)fn()向下執(zhí)行
function* fn(x) {
  yield x[0];
  yield x[1];
  yield x[2];
}

let res;
let t = fn([1, 2, 3]);
do {
  res = t.next();
  console.log(res);
} while (!res.done);

// 執(zhí)行結(jié)果
// { value: 1, done: false }
// { value: 2, done: false }
// { value: 3, done: false }
// { value: undefined, done: true }

實(shí)現(xiàn)promise

// Promise的參數(shù)是一個(gè)函數(shù)async,async()有resolve和reject兩個(gè)參數(shù)
function Promise(async) {
  // 回調(diào)函數(shù)中this會(huì)指向window,需要保存才會(huì)指向Promise實(shí)例對(duì)象
  let _this = this;
  // Promise三種狀態(tài),分別為pending,resolved,rejected.狀態(tài)只能從pending變成resolved或者rejected
  _this.status = "pending";
  _this.val = undefined;
  // 成功回調(diào)方法集合
  _this.onResolvedCallbacks = [];
  // 失敗回調(diào)方法集合
  _this.onRejectedCallbacks = [];
  // 觸發(fā)resolve()方法異步狀態(tài)改變成成功, 將會(huì)執(zhí)行成功回調(diào)集合中的方法
  function resolve(val) {
    if (_this.status === "pending") {
      _this.status = "resolved";
      _this.val = val;
      _this.onResolvedCallbacks.forEach(item => item(val));
    }
  }
  // 觸發(fā)reject()方法異步狀態(tài)改變成失敗, 將會(huì)執(zhí)行失敗回調(diào)集合中的方法
  function reject(val) {
    if (_this.status === "pending") {
      _this.status = "rejected";
      _this.val = val;
      _this.onRejectedCallbacks.forEach(item => item(val));
    }
  }
  // 異常捕獲
  try {
    async(resolve, reject);
  } catch (err) {
    reject(err);
  }
}
// then方法有兩個(gè)參數(shù), 第一個(gè)異步成功后執(zhí)行的函數(shù), 第二個(gè)是異步出異常后執(zhí)行的函數(shù)
Promise.prototype.then = function(resolved, rejected) {
  let _this = this;
  if (_this.status === "pending") {
    // 將所有then要執(zhí)行的方法push到回調(diào)函數(shù)集合中,在狀態(tài)改為resolved執(zhí)行其中的方法
    _this.onResolvedCallbacks.push(resolved);
    // 將所有then要執(zhí)行的方法push到回調(diào)函數(shù)集合中,在狀態(tài)改為rejected執(zhí)行其中的方法
    _this.onRejectedCallbacks.push(rejected);
  }
  if (_this.status === "resolved") {
    resolved(_this.val);
  }
  if (_this.status === "rejected") {
    rejected(_this.val);
  }
};

實(shí)現(xiàn)generator

// 生成器
function fn(val) {
  let i = 0;
  return {
    next() {
      let done = i === val.length;
      let value = val[i++];
      return {
        value,
        done
      };
    }
  };
}

// 迭代器
let it = fn([1, 2, 3]);
let result;
do {
  result = it.next();
  console.log(result);
} while (!result.done);