js中数组for循环调用后端接口，返回数据填充入数组

问题

一般来说 我们for循环调用后端接口， 数组需要返回的数据填充，但是返回后 发现 数组中的数据并没有接口返回的数据， 本人在vue项目中就遇到了这个问题，比如

 test(arr) {
      for (let i = 0; i < (arr.length - 1); i++) {
        let url = arr[i].dataUrl;
        if (url != null) {
          let data = this.getData(url);
          arr[i]['data'] = data.data.RESULTOBJECT;
        }
      }
      alert(JSON.stringify(arr))
    },

在代码中 for循环一个数组，this.getData(url)就是调用后端接口，打印后发现数组中 data对象还是空，接口也调用，这要怎么解决呢

解决

使用 async，await

async test(arr) {
      for (let i = 0; i < (arr.length - 1); i++) {
        let url = arr[i].dataUrl;
        if (url != null) {
          let data = await this.getData(url);
          arr[i]['data'] = data.data.RESULTOBJECT;
        }
      }
      alert(JSON.stringify(arr))
    },

只需加上两个关键字即可，打印发现数组中data对象已有后端返回的接口数据

*顺便记录一下 要想在循环中使用async await，请使用for…of 或者 for 循环, while循环，不能使用foreach *