JSON以随机顺序获取返回的元素

2022-02-24 00:00:00 json fetch javascript

我在FETCH请求时遇到了问题,问题是由于某种原因,它以随机顺序返回元素。函数如下:

function create_post_div(element, isLogged, currentUser, isProfile) {
      console.log(element.id);
    
      fetch(`likes/${element.id}`)
        .then((response) => response.json())
        .then((like_element) => {
          console.log(like_element.user_liked, element.id);
      });
 }

为简单起见,我没有放入整个函数,但是可以通过控制台日志检测到错误。第一个控制台日志应返回整数的element.id,第二个控制台日志应返回布尔值和相同的element.id的like_element.user_like。

必须为从另一个函数(假设列表[1,2,3])接收的每个元素运行create_post_div函数。当我运行函数时,第一个console.log以正确的顺序返回数字,但是FETCH中的console.log随机返回它们。我注意到的另一件事是,不是控制台,而是类似于:

1
true, 1
2
false, 2
3
true, 3

日志如下:

1
2
3
false, 2
true, 3
true, 1

它将首先记录所有的ID,然后使用ID记录点赞。同样,第一个日志中的ID始终是有序的,而第二个日志中的ID始终是无序的。


解决方案

当您使用Fetch时,您将创建一个承诺,该操作将需要一段未定义的时间才能完成。而且Javascript不会等待承诺完成,它会一直运行,完成您已经编写的所有其他内容。

一旦提取操作完成,您放在.then中的代码就会被执行,这就是为什么它被称为异步代码,因为它是在一段未定义的时间之后执行的。

而不是像建议的那样强制代码与异步/等待同步运行,而不是像我建议的那样,重新连接您的大脑以理解和接受此模式。除非这在设计上是绝对必要的,但这应该是非常罕见的情况。

相关文章