前言
ECMAScript 2016 中的 "async" 和 "await" 是 JavaScript 中非常重要的两个新特性，它们可以让异步编程更加简单和易读。但是，由于 IE 浏览器的兼容性问题，这两个特性在 IE 中的使用会有一些限制。本文将详细介绍这些限制，并提供一些解决方案。
async 和 await 简介
在介绍 IE 浏览器中的兼容性问题之前，我们先来简单介绍一下 async 和 await。
async 和 await 是 ECMAScript 2016 中引入的两个新关键字，它们可以让异步编程更加简单和易读。在使用 async 和 await 时，我们可以像同步代码一样编写异步代码，避免了回调函数的嵌套和错误处理的繁琐。
下面是一个使用 async 和 await 的示例代码：
-- -------------------- ---- ------- ----- -------- ------------- - ----- -------- - ----- -------------------------------------- ----- ---- - ----- ---------------- ------ ----- - ----------------------- -- - ------------------ -------------- -- - --------------------- ---
在上面的代码中，我们使用 async 和 await 来获取用户信息。使用 async 关键字定义一个异步函数 getUserInfo，然后使用 await 关键字等待 fetch 和 response.json 方法的返回结果，最后返回获取到的数据。
IE 中的兼容性问题
虽然 async 和 await 是 ECMAScript 2016 中的新特性，但是它们在现代浏览器中已经得到了广泛的支持。但是，在 IE 浏览器中，它们的支持情况并不是很好。
在 IE 中，async 和 await 并不是原生支持的，需要使用 Babel 等工具进行编译。但是，即使使用了编译工具，也会存在一些兼容性问题：
1. 不支持箭头函数
在 IE 中，箭头函数和 async/await 一样也是 ECMAScript 2015 中引入的新特性。但是，在 IE 中，箭头函数的支持情况也并不是很好。如果我们在 async 函数中使用箭头函数，就会出现语法错误。
下面是一个在 IE 中会出现语法错误的示例代码：
async function getUserInfo() {
const response = await fetch('https://api.example.com/user');
const data = await response.json();
return data.map(item => item.name);
}在上面的代码中，我们使用了箭头函数来处理返回的数据，但是在 IE 中会出现语法错误。
解决方案：在 IE 中，我们可以使用普通的函数来代替箭头函数：
async function getUserInfo() {
const response = await fetch('https://api.example.com/user');
const data = await response.json();
return data.map(function(item) {
return item.name;
});
}2. 不支持 Promise
在现代浏览器中，Promise 已经成为了异步编程的标准。而在 IE 中，Promise 的支持情况也不是很好。如果我们在 async 函数中使用 Promise，就会出现异常。
下面是一个在 IE 中会出现异常的示例代码：
async function getUserInfo() {
const response = await fetch('https://api.example.com/user');
const data = await response.json();
return new Promise((resolve, reject) => {
resolve(data);
});
}在上面的代码中，我们使用了 Promise 来处理返回的数据，但是在 IE 中会出现异常。
解决方案：在 IE 中，我们可以使用回调函数来代替 Promise：
-- -------------------- ---- ------- ----- -------- --------------------- - ----- -------- - ----- -------------------------------------- ----- ---- - ----- ---------------- --------------- - ---------------- -- - ------------------ ---
3. 不支持 async 和 await
最大的问题是，IE 中并不原生支持 async 和 await。即使我们使用了 Babel 等工具进行编译，也会出现一些兼容性问题。
解决方案：在 IE 中，我们可以使用回调函数来代替 async 和 await：
-- -------------------- ---- -------
-------- --------------------- -
--------------------------------------------------- -- -
------ ----------------
------------ -- -
---------------
-------------- -- -
---------------------
---
-
---------------- -- -
------------------
---在上面的代码中，我们使用了 Promise 和回调函数来代替 async 和 await。虽然这样会使代码变得更加冗长，但是可以解决在 IE 中的兼容性问题。
总结
async 和 await 是 ECMAScript 2016 中引入的两个新特性，它们可以让异步编程更加简单和易读。但是，在 IE 浏览器中，它们的支持情况并不是很好。在 IE 中，我们需要注意箭头函数、Promise 和 async/await 的兼容性问题，并使用回调函数来代替这些新特性。虽然这样会使代码变得更加冗长，但是可以解决在 IE 中的兼容性问题。
参考链接
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/662c41f5d3423812e49b8a14