使用JavaScript异步函数获取和去重数据

这段代码演示了如何使用异步函数和循环结构调用后台接口，并在获取完所有数据后进行去重操作。特别适用于需要处理大量数据时。

代码示例

以下是示例代码，它演示了如何使用JavaScript异步函数获取数据并进行去重操作：

async function getAll() {
  const params = {
    currentPage: 0,
    numberPerPage: 10 // 每次查10条
  }

  const array = [] // 存储所有数据的数组
  let hasMoreData = true // 标识是否还有更多数据可加载

  while (hasMoreData) {
    const res = await getFirstAudits(params)

    const { rows } = res.data.data

    if (rows.length > 0) {
      // 数据存在，将数据添加到array数组中
      for (const item of rows) {
        array.push(item.name)
      }
      params.currentPage++ // 增加页数，以获取下一页数据
    } else {
      // 没有更多数据可加载
      hasMoreData = false
    }
  }

  // 去重
  const uniqueArray = [...new Set(array)]
  return uniqueArray
}

代码解析

1. async function getAll()：这是一个异步函数的声明，用于获取和处理数据。

2. params：定义了一个包含两个属性的常量对象，currentPage 表示当前页数，numberPerPage 表示每页要获取的数据条数。

3. array 和 hasMoreData：分别是用于存储所有获取到的数据的数组和标识是否还有更多数据可加载的布尔变量。

4. while 循环：进入一个循环，只要 hasMoreData 为 true，就会一直执行循环内部的操作。

5. 异步数据获取：在循环内部，使用 await 调用 getFirstAudits 函数，传入 params 作为参数，将结果存储在 res 变量中，并在控制台输出。

6. 数据提取：从 res 中提取出需要的数据，这里是 rows 属性，它应该是一个包含数据的数组。

7. 数据处理：检查 rows 数组的长度，如果大于 0，说明有数据存在，就进入一个内部的 for...of 循环，遍历 rows 数组中的每个元素，将每个元素的 name 属性的值添加到 array 数组中。

8. 页数增加：同时，增加 params 对象的 currentPage 属性，以便获取下一页数据。

9. 数据加载完成：如果 rows 数组的长度为 0，表示没有更多数据可加载，就将 hasMoreData 设为 false，退出循环。

10. 去重操作：循环结束后，使用 ES6 中的 Set 数据结构将 array 数组转换为一个 Set，这会自动去除数组中的重复元素，并将结果存储在 uniqueArray 中。

11. 输出去重数据：最后，在控制台输出去重后的数组 uniqueArray。