关于for循环的问题……

rexuegg123

先看方法例子：

Game_Party.prototype.Collection_Action = function () {
    for （var i=1;i<=5;i++）{

    -------------------------------------
    图片或特效处理代码（完成需要更多的时间）…………
    --------------------------------------
    --------------------------------------
    纯数据运算代码（完成极快）………
    --------------------------------------   
    -------------------------------------
    图片或特效处理代码（完成需要更多的时间）…………
    --------------------------------------
  };
};

遇到的问题：
for循环运行时，如果里面同时包含“纯数据运算代码”和“图片或特效代码”，循环语句会在“图片或特效代码”处理之前快速地把“纯数据运算代码”按照循环次数处理完。造成循环完毕了，而特效部分只处理了一次就结束的问题……

但我的目的是：各行代码依次执行，然后循环重来。现在这个问题怎么破？

rexuegg123

ekmomo 发表于 2019-2-23 12:20
第一、你说的完成需要更多时间，实际上应该表述为在多少毫秒后执行代码(setTimeout)。所以要同步执行的话， ...

谢谢你的提示，已经搞定了。

ekmomo

第一、你说的完成需要更多时间，实际上应该表述为在多少毫秒后执行代码(setTimeout)。所以要同步执行的话，首先把你的数据处理代码也放到setTimeout里。第二、请一定仔细理解在多少毫秒后执行代码和完成需要更多时间的区别。在多少秒后执行一段代码在for循环里其实是很短的就完成了。
在你的例子中是for是在很短时间内下达了5次在7000毫秒后执行一段代码。所以这5次代码都是在约等于7000毫秒后执行的。

要做你说的那种循环(其实这不叫循环)我在之前有给过两个方式。即在多少毫秒后执行代码的代码调用自己，重复五次。

1. var count = 0;
   
2. function sto(){
   
3.         if (count < 5){
   
4.         setTimeout(function() {
   
5.             console.log(1);
   
6.             sto();
   
7.         }, 1000);
   
8.         count++;
   
9.     }
   
10. }
    
11. sto();

复制代码

以我的能力没法更简单的表达了……仔细看看并试着理解吧吧。

if216

rexuegg123 发表于 2019-2-22 22:26
图片处理在前，也会先执行数据运算啊

图片处理更新有一个update，隔多久刷一次，难道刷新的间隔就什么也不做吗？这时候处理数据，数据没有需要update刷新的内容，一下就搞定了。

rexuegg123

if216 发表于 2019-2-22 16:17
呵呵，这是生命周期的问题……数据在前循环，自然是循环完了才做下面的显示的循环 ...

图片处理在前，也会先执行数据运算啊

rexuegg123

ekmomo 发表于 2019-2-22 18:19
说实话……没看懂……既然大for循环里都没用到i，干嘛要循环呢？
你如果是想要setTimeout完了以后 ...

也许就像你说的那样，MV里图片、动画效果等属于前端，代码优先执行纯数据的运算…所以循环类语法不能囊括视觉效果？

rexuegg123

ekmomo 发表于 2019-2-22 18:19
说实话……没看懂……既然大for循环里都没用到i，干嘛要循环呢？
你如果是想要setTimeout完了以后 ...

for循环的目的在于：采集活动要消耗采集工具的耐久，采集工具耐久没有用完时，采集活动不会自动停止……for循环里，通过获得随机数判定采集到了什么物品，再用图片显示出来。
再我的代码里，for循环是有用的，只是他先多次循环得出多个随机数后，图片显示代码才开始运行，然而循环已经结束了，所以图片显示只执行了一次……

ekmomo

说实话……没看懂……既然大for循环里都没用到i，干嘛要循环呢？
你如果是想要setTimeout完了以后继续执行一段代码的话的话要把回调写在setTimeout里。
如

1.    
   
2.         var cb = function (){
   
3.                 console.log(2);
   
4.         }
   
5.         setTimeout(function() {
   
6.                 console.log(1);
   
7.                 cb();
   
8.     }, 1000);
   
9. //输出 1
   
10. //输出 2
    

复制代码

如果要循环执行多次的话，应当用setinterval，并给setinterval设置一个计数器。当计数器等于n时清除这个setinterval。
当然你也可以进行如下操作

1. var count = 0;
   
2. function sto(){
   
3.         if (count < 5){
   
4.         setTimeout(function() {
   
5.             console.log(1);
   
6.             sto();
   
7.         }, 1000);
   
8.         count++;
   
9.     }
   
10. }
    
11. sto();
    
12. //输出1
    
13. //输出1
    
14. //输出1
    
15. //输出1
    
16. //输出1
    

复制代码

然而，这两个方法对于一个MV游戏来说基本等于字面意义上的没用……要延时执行只需要用到requestAnimationFrame。

rexuegg123

ekmomo 发表于 2019-2-22 15:25
上代码。

Game_Party.prototype.Collection_Action = function (wy_PictureID) {
  var x1  = WY_Collection_getCar[0];  //采集类型
  var x2  = WY_Collection_getCar[1];  //随机数上限
  var x3  = WY_Collection_getCar[2];  //采集失败
  var x4  = WY_Collection_getCar[3];  //1
  var x5  = WY_Collection_getCar[4];
  var x6  = WY_Collection_getCar[5];
  var x7  = WY_Collection_getCar[6];
  var x8  = WY_Collection_getCar[7];  //7
  var x9  = WY_Collection_getCar[8];  //6
  var x10 = WY_Collection_getCar[9];  //获得装备
  var x11 = WY_Collection_getCar[10]; //获得潜能属性
  var x12 = WY_Collection_getCar[11]; //属性类型

  switch (x1) {
    case "lingxiu": var wy_name = ['红色碎片','蓝色碎片','绿色碎片','紫色碎片','白色碎片','未知','智慧'];break;
    case "famu":var wy_name = ['桃树原木','枫香树干','柳树干','桂树原木','花梨原木','未知','体质'];break;
    case "wakuang":break;
    case "nonggeng":break;
    case "xumu":break;
    case "diaoyu":break;
  };
  WY_got_0 = 0;
  WY_got_1 = [0,0,0],WY_got_2 = [0,0,0],WY_got_3 = [0,0,0],WY_got_4 = [0,0,0];
  WY_got_5 = [0,0,0],WY_got_6 = [0,0,0],WY_got_7 = [0,0,0],WY_got_8 = [0,0,0];
   
  for (var i = 1; i <= 5;i++ ) {
    $gameScreen.showPicture(wy_PictureID+1 ,'caiji/采集中',1,640,360,100,100,255,0);   
    $gameScreen.showPicture(wy_PictureID+2 ,'caiji/jindu_dt',0,580,378,100,100,255,0);
    $gameScreen.showPicture(wy_PictureID+3 ,'caiji/jindu_mt',0,581,380,1,100,255,0);
    $gameScreen.movePicture(wy_PictureID+3,0,581,380,100,100,255,0,360);   
    var a = Math.ceil(Math.random()*100);
    var b = Math.ceil(Math.random()*x2-100);
    var c = a + b;
    if (c>x10 && c<=x11) {WY_got_8[0] = wy_name[7], WY_got_8[2] +=1;};   //115-120
    if (c>x9  && c<=x10) {WY_got_7[0] = wy_name[6], WY_got_7[2] +=1;};    //110-115
    if (c>x8  && c<=x9)  {WY_got_6[0] = wy_name[5], WY_got_6[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[5];};
    if (c>x7  && c<=x8)  {WY_got_5[0] = wy_name[4], WY_got_5[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[4];};
    if (c>x6  && c<=x7)  {WY_got_4[0] = wy_name[3], WY_got_4[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[3];};
    if (c>x5  && c<=x6)  {WY_got_3[0] = wy_name[2], WY_got_3[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[2];};
    if (c>x4  && c<=x5)  {WY_got_2[0] = wy_name[1], WY_got_2[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[1];};
    if (c>x3  && c<=x4)  {WY_got_1[0] = wy_name[0], WY_got_1[2] +=1; WY_get_url = 'caiji/' + x1 + '/' + wy_name[0];};    //10-60
    if (c<=x3) {WY_got_0 = 1;WY_get_url = 'caiji/' + x1 + '/' + wy_name[5];};                                                       //0-10

    setTimeout(function() {
      $gameScreen.erasePicture(wy_PictureID+2);
      $gameScreen.erasePicture(wy_PictureID+3);
      $gameScreen.showPicture(wy_PictureID+4 ,WY_get_url,1,670,360,100,100,255,0);
      $gameScreen.movePicture(wy_PictureID+4,1,670,240,100,100,255,0,60);
    },7000);
    setTimeout(function() {for (var i=401;i<=404;i++){$gameScreen.erasePicture(i);};},8000);   
  };   
};


去掉for循环，可以正常运行。

KB.Driver

这个是代码并行执行的问题吧。
数据是一口气算完就可以的，但是图片/特效依赖于图像更新（取决于FPS）
所以必须每次更新变一下，而不是用循环一次性算完。

为此必须为图像的循环写一个状态机，然后状态机自己在状态之间循环。
比如一个图片用50帧从x坐标0移动到x坐标100，就要用状态机。
一开始是不变的状态，接受到要移动的数据后，进入每帧x坐标+2的状态，移动完成后判断一下再回到不变的状态。
最后，这个过程要加入总的图像更新（update）之中。