jquery javascript停止在嵌套数组迭代中计算未定义的对象

Question

我有一个数组数组，一些内部数组还有另一个嵌套的数组。有些不需要，我遍历顶层数组元素，如果有内部数组，我就遍历它们。如果没有，我也不会。或者我是这么认为的。

由于某些原因，当我的迭代发现一个没有嵌套数组的数组时，我的控制台显示"type error“undefined...这在技术上是正确的，因为没有定义嵌套数组。然而，我认为我嵌套的if语句不允许对此进行求值。有什么想法吗？

例如，动画是一个数组，但animations1是未定义的。所以在我的if循环中，我有一个嵌套的

var a = animations.shift();

if ( a[3] )
{
  console.log( 'a[3] is: ' + a[3] )
}
else
{
  return;
}

我认为，如果a3存在，则将其记录到控制台，如果不存在，则在不打印到控制台的情况下退出...然而，我的控制台继续产生一个未定义的评估。这是因为简单地测试它的存在会返回一个未定义的错误吗？如何在每次遇到没有嵌套数组的数组时停止弹出此错误？

谢谢。

var animations = [
    ['.pcba','fadeIn', [1000], [
        ['.pcb_cad', 'fadeIn', [1000] ]
        ]
     ],
    ['.pcba', 'delay', [2000] ],
    ['.pcba','fadeOut', [1000], [
        ['.heatGenComps', 'fadeIn', [1000] ],
        ['.arrows', 'fadeIn', [1000] ]
        ]
    ],
    ['.heatGenComps', 'delay', [2000] ],
    ['.heatGenComps', 'fadeOut', [1000], [
        ['.arrows', 'fadeOut', [1000] ],
        ['.pcb_cad_cfd', 'fadeIn', [1000] ],
        ['.wePredOpTemps', 'fadeIn', [1000] ]
        ]
    ],

 ]; 

我像这样遍历它们：

iter();
function iter(){

if (!animating) return;

 var a = animations.shift();

if (a) {
     var el = a[0];
     var fn = a[1];
     var args = a[2];

     $.fn[ a[1] ].apply( $( a[0] ), a[2] ).promise().done(iter);
     if ( a[3] )
     {
        var secondary = a[3];
        console.log( 'a[3] is: ' + a[3] );
        secondaryAnime();
        function secondaryAnime(){
            b = secondary.shift();
            console.log('secondary is: ' + b );
            $.fn[ b[1] ].apply( $( b[0] ), b[2] );
            secondaryAnime();
         };

     }
     else
     {
        return;
     }


}
else
{

}

};

Answer 1

异常的原因是你如何迭代你的嵌套数组b。当你停止获取secondary.shift()时，你没有结束条件；

在赋值secondary.shift()之后测试"if (b) {…}“就可以了。

顺便说一句:你不需要写所有空的"else“代码块。

Answer 2

事实上，对于一个简单的动画链，你有很多代码。你所要做的就是在每一步的同一时间都有一些动画。

你听说过plugin jquery-timing吗？它允许在几乎没有代码的情况下连接任何异步内容。我将给出完整的代码，它准确地完成了您的动画链，具有相同的计时，以jquery-timing风格编写：

$('.pcb_cad').fadeIn(1000)
    .$('.pcba').fadeIn(1000,$).wait(2000).fadeOut(1000)
    .$('.heatGenComps, .arrows').fadeIn(1000,$).wait(2000).fadeOut(1000)
    .$('.pcb_cad_cfd, .wePredOpTemps').fadeIn(1000);

如您所见，它只是一个很长的jQuery链。

这里只需要该插件中的两个计时方法。首先编写.fadeIn(…，$)，当您想要在方法链中使用以下jQuery命令等待完成淡入淡出动画时。在给定的超时之后，方法.wait(超时)将继续方法链中的所有以下方法。

这个插件有很多更直观的方式来延迟和连接你的操作。