把手在辅助输出上附加'undefined'

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 = "";