Javascript 为什么我的函数返回这个奇怪的输出？

我正在尝试编写一个函数，它接受一个整数作为输入，并确定在第n次迭代中围绕一个中心点的五边形中存在多少个点。我能够解决这个挑战，但在测试我的代码时，我从谷歌chrome控制台收到了一个奇怪的输出，我不明白为什么

这是最初的代码，一直给我一个错误，错误显示在下面的图片链接

function sides(num) {
    total = 1;
    for (let i = 2; i <= num; i++) {
        top = 1;
        sides = (i - 1) * 4;
        bottom = i - 2;
        total += top + sides + bottom;
    }
    return total;
}

然后我把它改成这样，效果很好：

function pentagon(num) {
    total = 1;
    for (let i = 2; i <= num; i++) {
        answer = (((i - 1) * 4) + 1) + (i - 2);
        total += answer

    }
    return total;
}

但我不明白他们为什么不同。我所做的只是将顶部、底部和侧面的数学合并成一行，称为答案。我不明白为什么第一个函数起作用，但第二个没有，我也不明白第一个函数给我的输出。如果有人能向我解释这两件事，我将不胜感激，谢谢

您应该使用var、const或let关键字，否则您的变量将与全局设置的变量（如top）相混淆

function sides(num) {
    let total = 1;
    for (let i = 2; i <= num; i++) {
        const top = 1;
        const sides = (i - 1) * 4;
        const bottom = i - 2;
        total += top + sides + bottom;
    }
    return total;
}

编辑：正如@Matthias指出的：

---

window.top MDN是指嵌套iFrame中最顶层的窗口。如果没有关键字，变量只是设置为window的一个属性。而且它是只读的

似乎是运行代码的环境的一个怪癖。尝试通过将变量放在变量前面来定义变量顶部、侧面和底部。请将错误显示为文本，而不是图像。从Google Chrome控制台复制和粘贴非常容易。。。请同时显示输入和预期输出。比我快几秒钟。window.top是指适用于嵌套iFrame的最顶层窗口。如果没有关键字，变量只是设置为window的一个属性。它是只读的。酷，我会把它添加到答案中。