Javascript JS 异步并等待在 Internet Explorer 中工作

JS Async and await to work in internet explorer

提问by BStill

I have already gotten my project to work on with async/await in every other browser, but apparently its not compatible in IE.

我已经让我的项目在所有其他浏览器中使用 async/await 进行处理，但显然它在 IE 中不兼容。

(async function () {
  try {
    await getLayers();
  }
  catch (err) {
    console.error(err)
  }
}());

which calls my other function:

它调用我的另一个函数：

async function getLayers() {  
try {
  $.when(
    await $.getJSON('http://' + ipAddress + '/api/Barriers/barrierGeoJSON', function (data) {
        createLayer(data[0].row_to_json, 'Barrier');
      }),
     await $.getJSON('http://' + ipAddress + '/api/DistPoints/distPointGeoJSON', function (data) {
        createLayer(data[0].row_to_json, 'Disturbance Points');
      })
  )}
  catch (err) {
    console.error(err);
  }
};

I need help getting this code to run on IE. Is there some sort of polyfill or transpiler that I have to use? I would hate to have to rewrite everything when it already runs smoothly. This is currently running client-side and I could not figure out how to use async--await. Thank you guys in advance.

我需要帮助让这段代码在 IE 上运行。我必须使用某种 polyfill 或转译器吗？当它已经顺利运行时，我不想重写所有内容。这当前正在客户端运行，我无法弄清楚如何使用async--await。提前谢谢你们。

采纳答案by BStill

I ended up using babelto convert this portion of my code to work with IE11. Also I had to import a polyfill so the regeneratorRuntime function will work.

我最终使用babel将这部分代码转换为与 IE11 一起使用。我还必须导入一个 polyfill，这样 regeneratorRuntime 函数才能工作。

It became this which works across all browsers:

它变成了适用于所有浏览器的：

_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
  return regeneratorRuntime.wrap(function _callee$(_context) {
    while (1) {
      switch (_context.prev = _context.next) {
        case 0:
          _context.prev = 0;
          _context.next = 3;
          return getLayers();

        case 3:
          _context.next = 8;
          break;

        case 5:
          _context.prev = 5;
          _context.t0 = _context['catch'](0);

          console.error(_context.t0);

        case 8:
        case 'end':
          return _context.stop();
      }
    }
  }, _callee, this, [[0, 5]]);
}))();

'use strict';

var getLayers = function () {
  var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
    return regeneratorRuntime.wrap(function _callee$(_context) {
      while (1) {
        switch (_context.prev = _context.next) {
          case 0:
            _context.prev = 0;
            _context.t0 = $;
            _context.next = 4;
            return $.getJSON('http://' + ipAddress + '/api/Barriers/barrierGeoJSON', function (data) {
              createLayer(data[0].row_to_json, 'Barrier');
            });

          case 4:
            _context.t1 = _context.sent;
            _context.next = 7;
            return $.getJSON('http://' + ipAddress + '/api/DistPoints/distPointGeoJSON', function (data) {
              createLayer(data[0].row_to_json, 'Disturbance Points');
            });

          case 7:
            _context.t2 = _context.sent;

            _context.t0.when.call(_context.t0, _context.t1, _context.t2);

            _context.next = 14;
            break;

          case 11:
            _context.prev = 11;
            _context.t3 = _context['catch'](0);

            console.error(_context.t3);

          case 14:
          case 'end':
            return _context.stop();
        }
      }
    }, _callee, this, [[0, 11]]);
  }));

  return function getLayers() {
    return _ref.apply(this, arguments);
  };
}();

function _asyncToGenerator(fn) { return function () { var gen = fn.apply(this, arguments); return new Promise(function (resolve, reject) { function step(key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { return Promise.resolve(value).then(function (value) { step("next", value); }, function (err) { step("throw", err); }); } } return step("next"); }); }; }

;