'use strict' 和 underscore.js 的问题

Question

我使用 Yeoman 和backbone.js 编写了一个应用程序。在我指定的每个 js 文件的顶部 'use strict'; 并且当我运行我的 grunt 任务时，jshint 没有遇到任何错误。

我可以毫无问题地使用 grunt 构建我的应用程序，但是当我尝试运行 uglified js 时，我收到以下错误：

Uncaught SyntaxError: Strict mode code may not include a with statement

我搜索了代码库，唯一使用 with 语句的东西是下划线。

我是严格模式的新手，所以我不确定如何解决这个问题。在使用 underscorejs 函数的任何地方都不能使用严格模式吗？

谢谢。

编辑：

给定下面的代码示例（为简洁起见）。我怎样才能改变它来解决这个问题。

'use strict';

/*global, Backbone, JST*/

var MyView = Backbone.View.extend({

    template: JST['app/scripts/templates/MyView.ejs'],

    initialize: function()
    {
        this.render();
    },

    render : function()
    {
        this.$el.html(this.template(this.templateVariables()));
        return this;
    },

    templateVariables: function()
    {
        return {var1 : 'Hello', var2 : 'World'};
    }
});

在 MyView.ejs 中

<p><%= var1 %><%= var2 %>!</p> //<p>Hello World!</p>

编辑 2：

在下面使用@mu 太短的答案我发现解决对 _.template 的调用让我感到悲伤的最佳方法是将我的 grunt-JST 任务更改如下：

jst: {
        compile: {
            options:
            {
                templateSettings:
                {
                    variable: 'data'
                }
            },
            files: {
                '.tmp/scripts/templates.js': ['<%= yeoman.app %>/scripts/templates/*.ejs']
            }
        }
    },

然后将我的每个模板更改为使用<%= data.templateVariable %> 格式。

可能不适用于其他人，但我在使用带有 Grunt 和 Backbone 生成器的 Yeoman 时遇到了这个问题，所以我不能成为唯一的人。

Answer 1

Underscore 的_.template 在内部使用with 以允许将<%= pancakes %> 之类的内容解析为obj.pancakes。如果你look inside _.template，你会发现这个：

if (!settings.variable) source = 'with(obj||{}){\n' + source + '}\n';

这就是攻击性with 的来源。如果您使用的是 JST 样式的预编译模板，那么 source 将在您的 JST 对象中结束，这使得 withs 在 "use strict" 的范围内可见。注意到settings.variable 在那里吗？ The documentation 说：

默认情况下，template 通过with 语句将数据中的值放在本地范围内。但是，您可以使用 variable 设置指定单个变量名称。这可以显着提高模板的渲染速度。

_.template("Using 'with': <%= data.answer %>", {answer: 'no'}, {variable: 'data'});
=> "Using 'with': no"

因此您可以在编译模板时使用variable 选项来抑制withs；当然，这也意味着您必须重写模板的所有<%= ... %> 部分以匹配variable 选项必须说的内容（这也应该加快您的模板速度，因此可能值得这样做)。

在您的情况下，您可以将模板更改为：

<p><%= data.var1 %><%= data.var2 %>!</p> //<p>Hello World!</p>

然后您需要将用于编译模板的_.template 调用更改为如下所示：

var compiled_template = _.template(raw_template, null, { variable: 'data' });

当然，你不必使用data，你只需要在模板和_.template调用中使用相同的东西。

我不知道您将如何更改设置调用_.template 的方式，但这应该不难。我想你可以修改 _.template 为 variable 设置默认值作为最后的手段。

这是一个简单的演示，应该说明正在发生的事情：http://jsfiddle.net/ambiguous/Az8QM/

---

或者，如果我们查看"use strict" is scoped 的方式，我们会看到：

严格模式适用于整个脚本或单个函数。

所以你可以用这样的方式来本地化你的严格性：

(function() {
    "use strict";
    // All your non-JST JavaScript goes here.
})();
// Append your JST out here.

您也可以使用两个 JavaScript 文件而不是一个：

1. 一个用于您的非模板 JavaScript 并启用 "use strict"。
2. 第二个只有你的JST，这个不会 "use strict"。