js 如何已同步方式获取异步函数的返回值

*** 参考 MDN异步

一、什么是普通函数

普通函数的语句执行是同步的，就是一步一步按照代码顺序步骤执行。

//函数1
function test1(){
    console.log("执行语句");//语句
}

//函数2
let test2 = function(){

}

//函数3：箭头函数
let test = ()=>{
}

二、异步函数

1. 为什么会有异步函数

答：浏览器提供的许多功能（尤其是最有趣的那一部分）可能需要很长的时间来完成，这样如果同步的话，就会导致其它任务被阻塞，消耗时间等待，所以js须让这些操作异步执行，不耽误其它任务执行。

因为同步执行任务有耗时问题，我们需要如下的来解决同步问题

• 通过调用一个函数来启动一个长期运行的操作

• 让函数开始操作并立即返回，这样我们的程序就可以保持对其他事件做出反应的能力

• 当操作最终完成时，通知我们操作的结果

这就是异步要完成的，而事件处理程序与其是最相似的，比如点击发送网络请求，它也是特殊的回调函数。

=》常见的异步模式

• 定时器： setTimeout

• 接口调用： 网络请求都是异步的

• 事件函数：点击事件、鼠标移入移出、右键 等等

• 使用 fetch() 发起 HTTP 请求

• 使用 getUserMedia() 访问用户的摄像头和麦克风

• 使用 showOpenFilePicker() (en-US) 请求用户选择文件以供访问

2. 回调函数（被淘汰了）

它是作为参数被传递到另一个函数里，并等待触发时机后，再返回结果。

例子如下：在这个例子中，第一步给输入的数据加 1，第二步加 2，第三步加 3，很容易产生不断嵌套，导致代码非常难阅读。所以现代大多数现代异步 API 都不使用回调。事实上，JavaScript 中异步编程的基础是Promise。

function doStep1(init, callback) {
  const result = init + 1;
  callback(result);
}
function doStep2(init, callback) {
  const result = init + 2;
  callback(result);
}
function doStep3(init, callback) {
  const result = init + 3;
  callback(result);
}
function doOperation() {
  doStep1(0, result1 => {
    doStep2(result1, result2 => {
      doStep3(result2, result3 => {
        console.log(`结果：${result3}`);
      });
    });
  });
}
doOperation();

3. 异步处理的基础Promise

下面是Promise的基础使用，fetch就是基于Promise来进行封装的，这种用then来捕获成功，用catch捕获执行失败。以这样的方式来处理异步。

function test(){
console.log("第1个被执行");
    fetch("http://baidu.com")
    .then(res=>{
        return res.json()
    })
    .then(res=>{
        console.log("第3个被执行");
        console.log("成功后打印数据",res);
    })
    .catch(err=>{
        console.log("错误捕获",err);
    })
    console.log("第2个被执行");
}

4. async 、await（重点）

async关键字为你提供了一种更简单的方法来处理基于异步 Promise 的代码。在一个函数的开头添加 async就可以使其成为一个异步函数。

async function myFunction() {
  // 这是一个异步函数
}

在异步函数中，你可以在调用一个返回 Promise 的函数之前使用 await 关键字。

这使得代码在该点上等待，直到 Promise 被完成，这时 Promise 的响应被当作返回值，或者被拒绝的响应被作为错误抛出。

function judgeRelation(){
    return new Promise((resolve, reject) => {
                    uni.request({ 
                        url : url,
                        method : method,
                        data : param,
                        header: {
                            'authorization': uni.getStorageSync("tokenKey")
                        },
                        success: (res) => {
                            console.log("1 最先执行");
                            resolve(res);  // 千万别忘写！！！这里是将结果返回给你await那里的值
                        },
                        fail:(err)=>{
                            console.log("是否执行错误回调",err);
                            reject('err');   // 千万别忘写！！！
                        }
                    })
                })
}
function async test(){
    let r1 = await judgeRelation();//等待
    console.log("这里r1将接收成功回调返回的结果",r1);
    console.log("2. 之后执行");
}

注意：await 关键字在forEach函数中会失效，使用 for in 循环代替。