javascript - 模板中的下划线条件

Question

这是我的模板:

var tmpl = _.template('<<%= elementTag %> <% if (_.has(elementClass)) { %> class="<%= elementClass %>" <% } %> <%= elementExtra %>><%= template(elementContent) %></<%= elementTag %>>');

我将使用此模板呈现的一些对象没有设置 elementClass 属性。我尝试使用 _.has 以便模板仅尝试打印定义了 elementClass 的对象的属性，但我没有成功。控制台错误仅指出 elementClass 未设置，大概是因为条件语句未能按我的预期工作。

我知道这是一个简单的问题，但我似乎无法解决它 - 我如何在这样的语句中使用条件来检测没有设置某些属性的对象？

Answer 1

一般来说，您不能为此使用 _.isDefined。考虑这个模板:

<script id="t" type="text/x-underscore-template">
    <% if(!_.isUndefined(elementClass)) { %>
        <%= elementClass %>
    <% } else { %>
        No such thing.
    <% } %>
</script>

和这段代码:

var t = _.template($('#t').html());
console.log(t({ }));

对 t 的调用应该会给您一个 ReferenceError，因为编译模板函数的范围内没有 elementClass。因此，如果您的对象根本没有 elementClass 属性，那么当您尝试获取模板时模板函数将失败。

演示:http://jsfiddle.net/ambiguous/H22D2/

问题是 _.isUndefined 函数只能检查表达式的 value，它不能检查变量(或属性，因为模板的内部 with用法)你传递给它已经被声明。

如果对象将有一个 elementClass 属性，但它可能有一个未定义的值，那么你可以使用 _.isDefined 和这个:

t({ elementClass: undefined })

会好的。

演示:http://jsfiddle.net/ambiguous/LUakg/

如果对象可能有也可能没有 elementClass 属性，那么您将无法使用 typeof，因为 typeof 不会尝试计算其操作数。像这样:

<script id="t" type="text/x-underscore-template">
    <% if(typeof elementClass !== 'undefined') { %>
        <%= elementClass %>
    <% } else { %>
        No such thing.
    <% } %>
</script>

在所有三种感兴趣的情况下都可以正常工作:

var t = _.template($('#t').html());
console.log(t({ }));
console.log(t({ elementClass: undefined }));
console.log(t({ elementClass: 'pancakes' }));

演示:http://jsfiddle.net/ambiguous/H5xC7/