await和wait的区别

一、概述

在Javascript中，async-await是现代异步编程的一种方式，它是ES6提供的语法糖，使得异步代码看起来像同步代码。而wait则是ES5时代的一种实现方式。

二、使用场景

等待某个操作完成时，可以使用await关键字，例如调用了一个异步函数，需要等待其执行完毕，再进行下一步操作。

async function foo() {
  const result1 = await asyncFunc1();
  const result2 = await asyncFunc2(result1);
  const result3 = await asyncFunc3(result1, result2);
  return result3;
}

而在ES5中，则需要使用回调函数或者Promise来实现异步调用。

function foo(callback) {
  asyncFunc1(function(result1) {
    asyncFunc2(result1, function(result2) {
      asyncFunc3(result1, result2, function(result3) {
        callback(result3);
      });
    });
  });
}

三、错误处理

在使用await时，可以使用try-catch语句来捕获异步操作中的错误，并进行处理。但是在使用wait时，没有try-catch语句，需要使用回调函数或者Promise的catch方法来处理错误。

async function foo() {
  try {
    const result = await asyncFunc();
    return result;
  } catch (error) {
    console.error(error);
    return null;
  }
}

而在ES5中，错误处理的方式如下：

function foo(callback) {
  asyncFunc(function(error, result) {
    if (error) {
      console.error(error);
      callback(null);
    } else {
      callback(result);
    }
  });
}

四、执行顺序

在使用await时，代码会按照书写的顺序执行。每个await语句会等待前一个await语句执行完毕后才会执行，保证执行的顺序。

async function foo() {
  await asyncFunc1();
  await asyncFunc2();
  await asyncFunc3();
}

而在使用wait时，需要手动控制执行顺序。例如使用setTimeout来进行延时操作。

function foo(callback) {
  asyncFunc1(function(result1) {
    setTimeout(function() {
      asyncFunc2(result1, function(result2) {
        asyncFunc3(result2, function(result3) {
          callback(result3);
        });
      });
    }, 1000);
  });
}

五、性能

在使用await时，代码的性能可能会比使用Promise略逊一筹，因为每个await语句会阻塞线程，直到异步操作完成后才会继续执行后面的代码。

而在使用wait时，由于JavaScript是单线程的，使用setTimeout等延时操作可以避免线程阻塞。但是如果多个操作需要等待前一个操作完成后才能执行，这种方法会显得麻烦和低效。

六、总结

综上所述，await和wait虽然都可以实现异步操作，但是await是ES6的语法糖，可以让异步代码看起来更加简洁易懂，并且拥有更好的错误处理和代码执行顺序控制能力。而wait则需要手动控制代码的执行顺序，并且对于错误的处理需要使用回调函数或者Promise的catch方法。