初步探索async 函数

这是我参与8月更文挑战的第7天，活动详情查看：8月更文挑战

定义

async是ES7才有的异步操作有关的关键字。

语法

async function name(param){
    statements
}

• name:函数名称。
• param：要传递给函数的参数的名称。
• statements：函数体语句。

返回值

async 函数返回一个 Promise 对象，可以使用 then 方法添加回调函数。

async function helloAsync(){
    return "helloAsync";
  }
  
console.log(helloAsync())  // Promise {<resolved>: "helloAsync"}
 
helloAsync().then(v=>{
   console.log(v);         // helloAsync
})

async 函数中可能会有 await 表达式，async 函数执行时，如果遇到 await 就会先暂停执行 ，等到触发的异步操作完成后，恢复 async 函数的执行并返回解析值。

await 关键字仅在 async function 中有效。如果在 async function 函数体外使用 await ，你只会得到一个语法错误。

function testAwait(){
    return new Promise((resolve) => {
        setTimeout(function(){
           console.log("testAwait");
           resolve();
        }, 1000);
    });
 }
  
 async function helloAsync(){
    await testAwait();
    console.log("helloAsync");
  }
 helloAsync();
 // testAwait
 // helloAsync

await

await 操作符用于等待一个 Promise 对象, 它只能在异步函数 async function 内部使用。

语法

[return_value] = await expression;

• expression: 一个 Promise 对象或者任何要等待的值。

返回值

返回 Promise 对象的处理结果。如果等待的不是 Promise 对象，则返回该值本身。

如果一个 Promise 被传递给一个 await 操作符，await 将等待 Promise 正常处理完成并返回其处理结果。

function testAwait (x) {
    return new Promise(resolve => {
      setTimeout(() => {
        resolve(x);
      }, 2000);
    });
  }
   
  async function helloAsync() {
    var x = await testAwait ("hello world");
    console.log(x); 
  }
  helloAsync ();
  // hello world

正常情况下，await 命令后面是一个 Promise 对象，它也可以跟其他值，如字符串，布尔值，数值以及普通函数。

function testAwait(){
    console.log("testAwait");
 }
 async function helloAsync(){
    await testAwait();
    console.log("helloAsync");
 }
 helloAsync();
 // testAwait
 // helloAsync

await针对所跟不同表达式的处理方式：

• Promise 对象：await 会暂停执行，等待 Promise 对象 resolve，然后恢复 async 函数的执行并返回解析值。
• 非 Promise 对象：直接返回对应的值。

我们可以通过使用async与await来处理异步。 如下代码就是我们使用的一个案例。

async rtc() {
            let cameraAble = false;
            let microAble = false;
            await TRTC.getCameras().then((res) => {
                console.log(res);
                cameraAble = res.length && res.length > 0;
            });
            await TRTC.getMicrophones().then((res) => {
                console.log(res);
                microAble = res.length && res.length > 0;
            });

            let { audioSwitch, agentCameraOn, model } = this.privates;
            let { userId } = model.dataSource.wxLiveSig;

            this.localStream = TRTC.createStream({
                userId,
                audio: microAble && audioSwitch,
                video: cameraAble && agentCameraOn,
            });
            let videoProfile = model.sheildPic && model.sheildPic.agentBitrate === 2 ? '720p' : '480p';
            this.localStream.setVideoProfile(videoProfile);
            //流初始化时涉及到权限校验
            await this.localStream
                .initialize()
                .catch((error) => {
                    //todo 用户拒绝授权的情况处理
                    console.log('初始化本地流失败', error);
                })
                .then((e) => {
                    this.localStream.setVideoContentHint('motion');
                    console.log('初始化本地流成功');
                });

            if (!(model.sheildPic && model.sheildPic.agentCameraOn) || !cameraAble) {
                $('#localStreamBox').hide();
                $('#shieldPic').show();
            }
            if ($('#localStreamBox')[0]) {
                this.localStream.play('localStreamBox');
            }
            await this.rtcClient
                .join({
                    roomId: this.privates.tabsItem.biz_session_id || this.privates.tabsItem.vroomId,
                })
                .catch((error) => {
                    console.log('进房失败', error);
                })
                .then(() => {
                    console.log('进房成功');
                });

            //发布本地流
            await this.rtcClient
                .publish(this.localStream)
                .catch((error) => {
                    console.log('本地流发布失败', error);
                })
                .then(() => {
                    console.log('本地流发布成功');
                    if (!(model.sheildPic && model.sheildPic.agentCameraOn) || !cameraAble) {
                        $('#localStreamBox').hide();
                        $('#shieldPic').show();
                    }
                    //调用混流接口
                    let { sdkOptions } = this.props;
                    proxy[`/web/wx_live/mix_transcoding`]({
                        type: 'get',
                        sdkOptions,
                        data: { roomId: this.privates.tabsItem.roomId },
                    }).then(
                        (resp) => {
                            console.log(resp);
                        },
                        (error) => {}
                    );
                });
            //answer之后立即获取可能获取不到时间
            // this.actions.update();
        }

征集一些小程序的需求：可以关注公众号联系我们。