在 .then() 中向函数添加参数会破坏 JS 中承诺的行为 [重复]

Question

getPosts() 循环遍历一组帖子，构建 LI 并将它们放在 document.body 中。工作正常。

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

createPost() 返回一个等待 3 秒（模拟客户端-服务器延迟）的承诺，向数组添加一个帖子并解析。

function createPost(post){
     return new Promise((resolve, reject) => {
       setTimeout(()=>{
          posts.push(post);
          const error = false;          
          if (error){
             reject ('Error happened!');
          }else{
             resolve();
          }
       },3000);
    });
 }

以下按预期工作。返回三个 LI，分别为 (undefined):

createPost ({title: 'Post Three', body: 'Post Three'})
.then(getPosts);

但是当.then里面的getPosts有参数时，不等promise解析就被触发了：

createPost ({title: 'Post Three', body: 'Post Three'})
.then(getPosts(1));

为什么？

https://codepen.io/Marko36/pen/LJoRYN

Answer 1

在您的then 中，您提供了一个回调函数。

then(getPosts) 将使用给定的参数调用：getPosts(result)

但是getPosts(1)会立即解决。

你想要的是()=> getPosts(1)

---

编辑以阐明两种语法之间的区别：

const foo = getPosts(1)
//foo is the _Result_ of immediately calling getPosts(1)
//so in your case an array with some objects in it, or undefined
foo(); //CRASH BOOM BURN - foo is not a function

const bar = () => getPosts(1)
//bar is a lambda that can be called to execute getPosts(1)
//At some point in the future or whenever -which is what your then-Block does
const posts = bar(); //Hooray, we have posts