3

我正在使用以下代码来创建基本的图像旋转功能，并且我想更好地了解它的工作原理。我得到了大部分内容，但是旋转函数中使用“严格”等于&三元运算符的行，即 (i === (imgs.length -1) ) ？i=0 : i++ ;) 有点令人困惑。我知道它正在增加计数器，但在那之前它在做什么？ 

var i, imgs, pic;

function rotate()
{
    pic.src = imgs[i] ;
    (i === (imgs.length -1) ) ? i=0 : i++ ;
    setTimeout( rotate, 2500 );
}

function init()
{
    pic = document.getElementById("pic");

    imgs = [ 'images/shimano_offer.jpg', 'images/kids_bikes1.jpg', 'images/cycle_to_work.jpg' ] ;

    var preload= new Array();
    for( i=0; i< imgs.length; i++ )
    {
        preload[ i ] = new Image();
        preload[ i ].src = imgs[ i ];
    }

    i=0;

    rotate();
}

代码来自http://ineasysteps.com/products-page/all_books/javascript-in-easy-steps-4th-edition/

4

2 回答 2

3

线

(i === (imgs.length -1) ) ? i=0 : i++ ;

可以（并且应该）写成：

if (i === (imgs.length - 1)) {
    i = 0;
} else {
    i += 1;
}

是的，前者字节数更少，但更难理解和调试。

编辑： Norguard 指出了一种使用三元形式的有效方法。我使用三元组，但在这种情况下我不会，因为我可能想在调试时在“i = 0”条件上放置一个断点。如果您预计不需要断点，他的方法更加紧凑和简洁，并且可能更可取。

于 2012-08-16T23:22:37.157 回答
1

我不同意 Ares 的观点——这是推理i.

对那个特定的三元语句（就是它的本质）感到困惑的部分是三元应该设置ONE VALUE。

这是设置单个变量的理想情况。

一个有意义且易于推理的三元语句将类似于：

var mood = (bank_account_balance > 0) ? "happy" : "unhappy";
console.log(mood);

这是一种非常干净的方式，mood如果平衡是积极的，那就是“快乐”，否则就是“不快乐”。这很好，简洁，不需要完整的：

if (....) {
    this_one_var = "one_thing";
} else if (...) {
    this_one_var = "something_else";
} else {
    this_one_var = "another_thing";
}

this_one_var = (...) ? "one_thing" : (...) ? "something_else" : "another_thing";
this_other_var = (...) ? "one_thing2" : (...) ? "something_else2" : "another_thing2";

你能想象根据不同的条件以第一种形式而不是第二种形式分配 6 个不同的变量吗？

我经常使用第二个，它使得赋值非常非常整洁。

问题是在示例中，他们没有这样做。他们使用三元作为 if 语句来触发代码... ...这就是 if 的用途。

请参阅 Ares 的答案，了解如何将其视为假设。

但作为三元赋值：

var length = imgs.length;
i = (i === length - 1) ? 0 : i + 1;

如果i是数组的最后一个索引，则设置i为 0，否则设置i为自身加一。不再有任何疯狂的逻辑可以跳过来弄清楚你是如何到达那里的。

于 2012-08-17T00:07:11.190 回答