uni-app 项目记录

await等候,等待;期待css

什么是async、awaitawait 用于等待异步完成一般async、await都是跟随Promise一块儿使用的html

async返回的都是一个Promise对象同时async适用于任何类型的函数上。这样await获得的就是一个Promise对象express

async function testSync() {
     const response = await new Promise(resolve => {
         setTimeout(() => {
             resolve("async await test...");
          }, 1000);
     });
     console.log(response);
}
testSync();//async await test...复制代码

async function asyncAwaitFn(str) {
    return await new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(str)
        }, 1000);
    })
}

const serialFn = async () => { //串行执行

    console.time('serialFn')
    console.log(await asyncAwaitFn('string 1'));
    console.log(await asyncAwaitFn('string 2'));
    console.timeEnd('serialFn')
}

serialFn();复制代码
async function asyncAwaitFn(str) {
    return await new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(str)
        }, 1000);
    })
}
const parallel = async () => { //并行执行
    console.time('parallel')
    const parallelOne = asyncAwaitFn('string 1');
    const parallelTwo = asyncAwaitFn('string 2')

    //直接打印
    console.log(await parallelOne)
    console.log(await parallelTwo)

    console.timeEnd('parallel')


}
parallel()复制代码

await 操做符用于等待一个Promise 对象。它只能在异步函数 async function 中使用。表达式一个 Promise 对象或者任何要等待的值。返回值返回 Promise 对象的处理结果。若是等待的不是 Promise 对象,则返回该值自己。promise

await 表达式会暂停当前 async function 的执行,等待 Promise 处理完成。若 Promise 正常处理(fulfilled),其回调的resolve函数参数做为 await 表达式的值,继续执行 async function。app

若 Promise 处理异常(rejected),await 表达式会把 Promise 的异常缘由抛出。异步

另外,若是 await 操做符后的表达式的值不是一个 Promise,则返回该值自己。async

function resolveAfter2Seconds(x) {
  return new Promise(resolve => {
    setTimeout(() => {
      resolve(x);
    }, 2000);
  });
}

async function f1() {
  var x = await resolveAfter2Seconds(10);
  console.log(x); // 10
}
f1();复制代码

async function f2() {
  var y = await 20;
  console.log(y); // 20
}
f2();复制代码

async function f3() {
  try {
    var z = await Promise.reject(30);
  } catch (e) {
    console.log(e); // 30
  }
}
f3();复制代码

setTimeout,Promise,async/await的区别?file函数

filefile

async/awaitfileui

async/ await来发送异步请求,从服务端获取数据spa

async的用法它做为一个关键字放到函数前面,用于表示函数是一个异步函数

async function timeout() {
  return 'hello world';
}复制代码

async function timeout() {
    return 'hello world'
}
timeout();
console.log('虽然在后面,可是我先执行');复制代码

file

async function timeout() {
    return 'hello world'
}
timeout().then(result => {
    console.log(result);
})
console.log('虽然在后面,可是我先执行');复制代码

file

控制台中的Promise 有一个resolved,这是async 函数内部的实现原理。

返回一个值当调用该函数时,内部会调用Promise.solve() 方法把它转化成一个promise 对象做为返回

函数内部抛出错误就会调用Promise.reject() 返回一个promise 对象

async function timeout(flag) {
    if (flag) {
        return 'hello world'
    } else {
        throw 'my god, failure'
    }
}
console.log(timeout(true))  // 调用Promise.resolve() 返回promise 对象。
console.log(timeout(false)); // 调用Promise.reject() 返回promise 对象。复制代码

file

若是函数内部抛出错误, promise 对象有一个catch 方法进行捕获。

timeout(false).catch(err => {
    console.log(err)
})复制代码

await是等待的意思它后面跟着什么呢?

注意await 关键字只能放到async 函数里面

更多的是放一个返回promise 对象的表达式

// 2s 以后返回双倍的值
function doubleAfter2seconds(num) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(2 * num)
        }, 2000);
    } )
}复制代码
async function testResult() {
    let result = await doubleAfter2seconds(30);
    console.log(result);
}复制代码

filefilefile

const express = require('express');
const app = express();// express.static 提供静态文件,就是html, css, js 文件
app.use(express.static('public'));

app.listen(3000, () => {
    console.log('server start');
})复制代码

file

file

file

file

若本号内容有作得不到位的地方(好比:涉及版权或其余问题),请及时联系咱们进行整改便可,会在第一时间进行处理。

请点赞!由于大家的赞同/鼓励是我写做的最大动力!

欢迎关注达达的简书!

这是一个有质量,有态度的博客

博客

相关文章
相关标签/搜索