javascript - Grunt Uglify 生成浏览器不同意的代码

Question

我是 Grunt 和 grunt-contrib-uglify 的新手。我创建了一个测试 JavaScript 文件:

function global(window) {
  window.test = alert("Test");
  test();
})(window);

当它被丑化时，它显示为

!function(a){a.test=alert("Test"),test()}(window);

jsfiddle

我对两件事感到困惑:

• 为什么 ("Test") 和 test 之间使用逗号而不是分号？
• 这段代码实际上是如何产生预期结果的？

当我在 Chrome 中运行它时，会适时出现警报，但控制台会提示 Uncaught TypeError: test is not a function。当我通过 JSHint 运行它时，它报告:“预期有一个赋值或函数调用，但却看到了一个表达式。”

grunt-contrib-uglify 是否利用了 Chrome 和我都不完全理解的 JavaScript 方面的优势？

Answer 1

这会导致 Chrome 出现错误，因为您的原始代码无效。您实际上所做的是将 alert("Test") 的结果分配给 window.test。 alert 返回 undefined，因此当您稍后尝试调用 test 时，它会引用 undefined 而不是函数。您还缺少一个左括号，但这并没有导致这里的问题。

看起来您想要做的是创建一个代理alert函数，该函数将使用预定义的输入参数调用它。您可以使用 bind() 来执行此操作函数，像这样:

(function (window) {
    window.test = alert.bind(undefined, 'Test');
    test();
})(window);

以上应该会产生您预期的结果。

至于为什么使用逗号而不是分号，可能是因为缩小的代码验证了表达式(请参阅 expressions vs statements )，并且表达式中不允许使用分号，而逗号则可以。