了解 React Native 程序流程 - 循环答案

【问题标题】：Understanding React Native Program Flow - Loops了解 React Native 程序流程 - 循环
【发布时间】：2017-07-19 16:49:59
【问题描述】：

[在下面编辑]

这是当前代码：

for(toy of toys) {
    fetch(url, {headers: headers})
       .then((response) => response.json)
       .then((responseJson) => {
           <insert toy to database>
       })
}

上面的代码没有正确地发布玩具，因为循环在里面的 fetch 之前完成。如何正确实现这一点，以便可以将具有 responseJson 属性的玩具正确插入数据库？换句话说，在继续循环之前如何等待获取完成？

[以前的帖子]

我有以下代码：

function hello(callback1) {
   for(var i = 0; i <= 100; i++){
       console.log(i)
   }

   callback1()
}

function callback1() {
   console.log("hello")
}

我的问题是，callback1 会等待循环完成吗？

这是第二种情况：

function hello() {
   for(var i = 0; i < 100; i++){
      console.log("apples")
   }

   for(var i = 0; i < 100; i++){
      console.log("peaches")
   }
}

输出会是：

apples
apples
apples
apples
...
peaches
peaches
peaches
...

或

apples
apples
peaches
apples
peaches
...(in any order since they execute at the same time)

由于我习惯于代码的线性执行，因此很难理解 React Native 程序的流程。如果您还可以为假人推荐阅读材料，那就太好了。

【问题讨论】：

是什么阻止您只测试这段代码？或者，如果您已经测试过它，结果与您的预期有何不同？（还有什么让你觉得这些函数不会按顺序执行？）
是的，为什么不试试这个呢？网络上有 Javascript 工作台，可以立即在浏览器中测试这种代码。您在此处展示的所有内容都非常简单，没有任何异步内容。一些更复杂的例子，例如这里stackoverflow.com/questions/16336367/…
感谢您的回答！我正在执行一些类似的代码，但没有得到我期望的结果。代码似乎同时执行循环。我认为这些函数不会按顺序执行，因为 javascript 是异步的。从来没有真正完全理解过这个概念。
那么异步只适用于函数？例如： function1() function2() function3() 可能会产生顺序可能不同的结果，具体取决于哪个先完成？谢谢！
嗨！我发现了我真正的问题。请参阅帖子上的编辑。谢谢！

标签： javascript reactjs asynchronous react-native ecmascript-6

【解决方案1】：

正如MDN documentation 中提到的，for 循环的语法是：

for ([initialization]; [condition]; [final-expression])
    statement

statement 在哪里：

只要条件评估为真，就会执行的语句。要在循环中执行多个语句，请使用块语句 ({ ... }) 对这些语句进行分组。要在循环中不执行任何语句，请使用空语句 (;)。

这意味着for循环中的所有内容都将在执行以下代码之前执行。

function hello(callback1) {
   for(var i = 0; i <= 10; i++){
       console.log(i)
   }

   callback1()
}

function callback1() {
   console.log("hello")
}

hello(callback1);

【讨论】：

感谢您的澄清。执行类似代码时，我似乎得到了奇怪的结果。这可能是一个实现问题。
嗨！我发现了我的问题。请参阅帖子上的编辑。谢谢！
我建议你再问一个问题，因为它与第一个问题完全不同。
这仍然是一个循环问题，与问题的标题有关。无论如何，我已经找到了解决方案。谢谢。

【解决方案2】：

我在这篇文章中找到了答案：

How to make a javascript FOR LOOP wait for certain conditions before looping

在这些情况下，递归更适合使用。

【讨论】：