关于同步异步操作

同步异步操作是什么？
- 同步操作：就是代码按照顺序执行下来，下一个操作必须等待上一个操作完成后执行。如果有需要等待时间长的操作，比如alert，confirm，也必须等待它们执行完成后，才能往下执行。这样容易造成代码阻塞
- 异步操作：就是所有代码都执行一遍，但是不会等待时间长的操作完成后，再去执行下一个操作
同步异步操作有什么区别？
- 执行方式：同步操作按顺序一次执行一个。异步操作可以同时执行多个；
- 阻塞代码：同步操作会阻塞后续代码。异步操作不会阻塞代码
- 函数处理：同步操作中不用回调函数，直接返回操作结果。异步操作需要用到回调函数才能进行异步处理
什么情况下使用异步操作？异步操作能带来什么好处？
- 什么情况用：
  1. 长时间的I/O操作：读取文件、写入文件、从数据库中获取数据、进行网络通信
  2. 交互式用户界面：在用户进行一些寻找、搜索、等待操作时，需要使用异步数据保持用户和界面的响应
  3. 并行操作：当需要执行多个操作时，异步数据可以更好的利用资源，提高性能
- 好处：
  1. 提高系统响应性能：避免代码阻塞可能造成的程序卡顿，提高用户体验
  2. 提高系统的可伸缩性：更好的利用处理器和其他资源，提升用户的数据量
  3. 增强代码的可维护性：异步操作时代啊结构更清晰，易于理解，提高可维护性
异步操作有哪些实现方法？
- 回调函数：最基本的异步处理方法。可以把想要异步实现的方法，封装成函数或者直接传给回调函数，在回调函数中进行异步处理（setTimeout、setInterval）
- Promise
- async/await

Promise你知道多少

Promise是JS中的一种异步编程解决方案。管理异步操作，解决回调地狱问题
- 回调地狱就是处理多个异步操作时，需要按照特定顺序执行，在回调函数中嵌套回调函数，导致代码不清晰、难维护
Promise是一个对象，里面放着异步操作事件，这个事件可能产生一个值，也可能抛出一个错误
Promise对象有三种状态：
- pending（进行中）：初始状态
- fulfilled（已成功）：操作完成并返回一个值
- rejected（已失败）：操作失败并返回一个错误对象

function asyncOperation() {
    return new Promise((resolve, reject) => {
        // 这里面执行异步操作
        setTimeout(function () {
            const res = '111'
            const err = '000'
            if ([] == '') {
                //异步操作成功，进入fulfilled状态，返回res
                resolve(res)
            } else {
                //异步操作失败，进入rejected状态，返回err
                reject(err)
            }
        }, 1000)
    })
}
// Promise链式调用
asyncOperation()
    .then(function (res) {
    console.log(res) // 111
    return '222'
})
    .then(function (wee) {
    console.log(wee) // 222
    return '333'
})
    .then(function (weee) {
    console.log(weee) // 333
})
    .catch(function (err) {
    console.error(err)
})

Promise对象的静态方法，处理Promise实例并发执行和结果处理
- Promise.all() 方法
  - 接受由Promise实例组成的数组，返回一个新的Promise实例
  - 待全部Promise都解析完成后，将所有Promise解析值返回一个数组，作为新Promise的解析值
- Promise.race() 方法
  - 接受由Promise实例组成的数组，返回一个新的Promise实例
  - 返回异步操作最快的Promise实例的解析值，作为新Promise的解析值

async/await

async/await是类似同步代码写异步的感觉。
- async 关键字定义一个函数，使这个函数成为一个异步函数，返回一个Promise对象
- await 关键字用于暂停异步函数的执行，等待一个Promise对象的解析结果。 await 只在异步函数内部使用

async function sxc() {
    let bbb = await setTimeout(() => {
        const ccc = 'sunxiaochuan'
        console.log(ccc)
    }, 2000)
}
sxc()
console.log('this is me')
// 打印结果： this is me
// 2秒后     sunxiaochuan

在async函数里怎么捕获错误

用try/catch

async function sxc() {
    try {
        let bbb = await setTimeout(() => {
            const ccc = 'sunxiaochuan'
            console.log(ccc)
        }, 2000)
        console.log(ccc) // 这里出错
    } catch(error) {
        console.log('error：', error)
        // 抛出的错误：error： ReferenceError: ccc is not defined at sxc
    }
}
sxc()
console.log('this is me')

JS针对性总结：同步异步操作、两个异步处理方式（Promise和async/await）

关于同步异步操作

Promise你知道多少

async/await