Promise
【JS异步入门】异步方式与场景
· ☕ 2 分钟

JavaScript 可以通过以下几种方式实现异步:

回调函数:将回调函数作为异步函数的参数,在异步操作完成后调用回调函数。例如:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
function fetchData(callback) {
  // 异步操作
  setTimeout(function() {
    const data = { name: 'Alice', age: 20 }
    callback(data)
  }, 1000)
}

fetchData(function(data) {
  console.log(data) // { name: 'Alice', age: 20 }
})
Promise使用 Promise 对象可以更方便地实现异步操作可以通过 then() 方法链式调用处理异步操作的结果例如
function fetchData() {
  return new Promise(function(resolve, reject){
    // 异步操作
    setTimeout(function() {
      const data = { name: 'Alice', age: 20 }
      resolve(data)
    }, 1000)
  })
}

fetchData().then(function(data) {
  console.log(data) // { name: 'Alice', age: 20 }
})
async/awaitasync/await 是在 Promise 基础上进行的封装使用起来更加方便代码更加易读易写例如
async function fetchData() {
  // 异步操作
  await new Promise(resolve => setTimeout(resolve, 1000))
  const data = { name: 'Alice', age: 20 }
  return data
}

fetchData().then(function(data) {
  console.log(data) // { name: 'Alice', age: 20 }
})

JavaScript 中的异步场景很多,常见的包括: