WEB-从零开始让前端飞

JavaScript 的异步方案

2018-03-14  本文已影响4人  YjWorld

异步: 一段不连续的程序流,在未来不确定的事件发生的事情。
问题编程表述 在一件异步事件 A 发生后执行程序 B
发展:异步事件+回调 -> 三方库(消息驱动,Promise,二次编译) -> 标准Promise对象,Generator函数, async函数

// Promise
const promise = new Promise(function(resolve, reject) {
  // 异步操作
  const A  = '异步事件'
  if ( A/* 异步操作成功 */){
    resolve(value);
  } else {
    reject(error);
  }
});
promise.then(function(value) {
  // success
console.log('B')
}, function(error) {
  // failure
});

// Generator
function* GeneratorAB() {
  yield 'A';
  yield 'B';
  return 'ending';
}
const hw = GeneratorAB();
hw.next()
hw.next()

//async
function timeoutA(ms) {
  return new Promise((resolve) => {
    setTimeout(resolve, ms);
  });
}

async function asyncAB(value, ms) {
  await timeoutA(ms);
  console.log(value);
}

asyncAB('B', 3000);


Promise,Generator,async三者的关系:
实际运用过程中,使用 Promise 包装异步事件,使用 async 函数控制流程。
async 是 Generator 函数的语法糖


Promise 对象


Generator 函数


async 函数

参考:阮一峰-ES6入门

问题: Javascript 是单线程。setTimeout(),发生了什么,原理是怎样的?

上一篇下一篇

猜你喜欢

热点阅读