0

我们如何await使用外部 javascript 库在浏览器中使用 javascript 运算符？

例如，如果我们有以下 html 代码：

<!DOCTYPE html>
<html>
    <head>
        <script type='text/javascript' src='awesome.lib.js'></script>
        <script type='text/javascript'>
            async function slow() {
                return new Promise(function(resolve, reject) {
                  setTimeout(function() {
                      console.log("slow finished");
                      resolve();
                  }, 3000);
                });
            }

            function fast() {
                console.log("fast");
            }

            async function run() {
                await slow();
                fast();
            }

            run();
        </script>
    </head>
    <body>
    </body>
</html>

我们可以使用哪些库（awesome.lib.js这些库在哪里）将 await 运算符带到浏览器？我们如何编写一个工作示例？

我知道我们可以转换代码，但我正在寻找一个聪明的解决方案，我们可以添加一个第三方库，瞧，它可以工作！

如果我们使用 Google Traceur Transpiler，我们可以转译代码 ( http://jsfiddle.net/msfrisbie/yk6r7gxr/ ) 并获得如下所示的代码。但问题是我们需要先转译代码。另一件事是我想避免使用一些不是 javascript 之类的东西<script type='text/whatevernotjavascript'>...code...code</script>。我们应该怎么做？这将是非常棒的，实用和救世主。

<script type="text/javscript">
    $traceurRuntime.ModuleStore.getAnonymousModule(function(require) {
      "use strict";
      var $__1 = $traceurRuntime.initTailRecursiveFunction(slow),
          $__3 = $traceurRuntime.initTailRecursiveFunction(run);
      function slow() {
        return $traceurRuntime.call(function() {
          return $traceurRuntime.continuation($traceurRuntime.asyncWrap, $traceurRuntime, [$traceurRuntime.initTailRecursiveFunction(function($ctx) {
            return $traceurRuntime.call(function($ctx) {
              while (true)
                switch ($ctx.state) {
                  case 0:
                    $ctx.returnValue = new Promise(function(resolve, reject) {
                      setTimeout(function() {
                        console.log("slow finished");
                        resolve();
                      }, 3000);
                    });
                    $ctx.state = 2;
                    break;
                  case 2:
                    $ctx.state = -2;
                    break;
                  default:
                    return $traceurRuntime.continuation($ctx.end, $ctx, []);
                }
            }, this, arguments);
          }), this]);
        }, this, arguments);
      }
      function fast() {
        console.log("fast");
      }
      function run() {
        return $traceurRuntime.call(function() {
          return $traceurRuntime.continuation($traceurRuntime.asyncWrap, $traceurRuntime, [$traceurRuntime.initTailRecursiveFunction(function($ctx) {
            return $traceurRuntime.call(function($ctx) {
              while (true)
                switch ($ctx.state) {
                  case 0:
                    Promise.resolve(slow()).then($ctx.createCallback(2), $ctx.errback);
                    return;
                  case 2:
                    fast();
                    $ctx.state = -2;
                    break;
                  default:
                    return $traceurRuntime.continuation($ctx.end, $ctx, []);
                }
            }, this, arguments);
          }), this]);
        }, this, arguments);
      }
      run();
      return {};
    });
    //# sourceURL=traceured.js

4

0 回答 0