Javascript 为什么我的var返回NaN而不是html结构？

我试图让我的var向我显示一个html结构，但它显示了NaN 为什么?

我尝试了很多类似console.log（rankinU）的东西，效果很好。不知为什么html2没有

var i = 0;
var html2 = '';
const listaRanking = document.querySelector('#lista');
db.collection("usuarios").orderBy("puntos", "desc").limit(10)
    .get().then(function(querySnapshot) {
        querySnapshot.forEach(function(doc) {
            data                = doc.data();

            const rankinU  = `
        <div class="containerFlex">
            <div class="rank">#${i+1}</div>
            <div class="usuario">${data.usuario}</div>
            <div class="puntosr">${data.puntos}</div>
        </div>
        `;
            html2 =+ rankinU;

            console.log(html2);
            listaRanking.innerHTML = html2;
            i++;
    });
});

var i=0；
var html2=''；
const listaRanking=document.querySelector（'#lista'）；
数据库收集（“usuarios”）。订购人（“puntos”、“desc”）。限额（10）
.get（）.then（函数（querySnapshot）{
querySnapshot.forEach（函数（doc）{
data=doc.data（）；
常数rankinU=`
#${i+1}
${data.usuario}
${data.puntos}
`;
html2=+rankinU；
console.log（html2）；
listaRanking.innerHTML=html2；
i++；
});
});

我希望它在这里显示除Nan以外的任何内容：

html2 =+ rankinU;

您正在尝试使用复合赋值运算符，即

+=

。您的上述代码相当于：

html2 = +rankinU;

一元

+

运算符尝试将其参数转换为数字。这不能发生在HTML字符串中，因此您将得到

NaN

。只需更换操作员即可：

html2 += rankinU;

或者使用详细表示法-任何一种方法都可以：

html2 = html2 + rankinU;

---

html2=+rankinU

应该是

html2+=rankinU


a+=b
转换为
a=a+b
，对字符串有效
a=+b
转换为
a=+b
，这对字符串无效，然后它将假定
b
是一个数字，并尝试将其解析为一个数字（它不是，因此当分配给
a
时，
NaN
）
因为您将其设置为尝试将HTML字符串转换为数字。谢谢。真有趣。我已经在这上面工作了8个多小时了，现在我都生锈了。非常感谢：）没问题@JoaquinROMERO，总是很乐意帮忙。