车把在帮助程序输出上附加"未定义"

Question

我有这个助手

Handlebars.registerHelper('star-score', function(score, maxScore, options) {
    var output;
    for(var i = 1; i <= maxScore; i++) {
        if (score >= i) {
            output = output + '<span class="star full">&nbsp;</span>';
        } else {
            output = output + '<span class="star empty">&nbsp;</span>';
        }
    }
    return new Handlebars.SafeString(output);
});

基本上，我想做的是给这个助手传递一些数字，我希望它根据数字分数生成用户评级星

这就是我如何称呼这个助手

<div class="user-score">
    {{star-score establishment.user_score 5}}
</div>

但有趣的是，生成的代码看起来像这个

<div class="user-score">
    undefined
    <span class="star full">&nbsp;</span>
    <span class="star full">&nbsp;</span>
    <span class="star full">&nbsp;</span>
    <span class="star empty">&nbsp;</span>
    <span class="star empty">&nbsp;</span>
</div>

我不知道这个"未定义"是从哪里来的。我不知道如何解决它。开发者控制台中没有错误。我做错了什么？

Answer 1

循环第一次运行输出是undefined，因此它的计算结果如下

output = undefined + '<span class="star full">&nbsp;</span>';

只需将输出初始化为空字符串即可修复问题

var output = "";