javascript - 空变量和初始化变量的区别

Question

我认为我的问题是错误的或没有意义的，所以我正在获得更好的提问方式......

我正在学习javascript中的回调函数

const posts = [
    {title: 'A', body: 'This is Body Of A'},
    {title: 'B', body: 'This is Body Of B'},
    {title: 'C', body: 'This is Body Of C'},
]

我正在创建这些帖子:-

function createPosts(post){
    setTimeout(function(){
        posts.push(post);
    },2000);
}

获取它们并在 html 上显示:

function getPosts(){
    setTimeout(function(){
        let output = ''
        posts.forEach(function(post){
            output += `<li>${post.title}</li>`
        });
        document.body.innerHTML = output;
    }, 1000);
}

在我设置为清空的获取帖子中，它列出了所有帖子标题， 如果我正在初始化输出，它只列出一个。

function getPosts(){
    setTimeout(function(){
        let output;
        posts.forEach(function(post){
            output = `<li>${post.title}</li>`
        });
        document.body.innerHTML = output;
    }, 1000);
}

那么创建空变量和初始化变量有什么区别。

谢谢

Answer 1

区别在于字符串连接+=:参见字符串运算符部分here

以下行会将新的 li 项附加到 output

output += `<li>${post.title}</li>`

在另一个示例中，您使用赋值运算符 =:
这会将 li 元素分配给 output - 之前存储在 output 中的任何内容都将丢失:

output = `<li>${post.title}</li>`