jquery slide show - 为什么这段代码有效？

我当时正在使用jquery编写javascript中的幻灯片代码，当时我碰到几行代码正在做几行代码。jquery slide show - 为什么这段代码有效？

问题是，我不理解它是如何工作，所以我可以修改它。

var imgs = [ 
     'image1.jpg', 
     'image2.jpg', 
     'image3.jpg']; 
     var cnt = imgs.length; 

    $(function() { 
     setInterval(Slider, 4000); 
    }); 

    function Slider() { 
    $('#imageSlide').fadeOut("slow", function() { 
     $(this).attr('src', imgs[(imgs.length++) % cnt]).fadeIn("slow"); 
    }); 
    }

这是一个让我行：

[(imgs.length++) % cnt]

我读的是作为

3+1 % 3 = 1

现在每次执行时，没有代码的似乎任何修改的变量。 cnt永远等于imgs.length（3），imgs.length++实际上并没有修改它，它只是增加了一个用于单个执行，是否正确？

所以不管执行多少次，它总是会imgs[1]然而，当我执行的代码，它通过所有的数组对象正常运行。

编辑：

我只是简单地添加alert(imgs.length);并确认++不会真正改变的变量，但它仍然没有道理给我。

第一次运行，imgs.length = 4 ++之后。 4 % 3 = 1所以它应该运行数组对象[1]而不是[0]？

第二轮，5 % 3 = 2

第三轮，6 % 3 = 0

等等等等。但也不宜过重。但是，如果我把alert(imgs.length % cnt);它只返回0,1,2比重置。

为什么？

来源

2010-01-19 Jared

关于您的编辑，请参阅我的代码示例。在运行x ++时，x的值在*返回其原始值后被修改*。要返回修改后的值，可以使用++ x。 – Matchu 2010-01-19 15:06:28

另外，6％3 = 0。它不是减法运算符;它是模数 - 参见http://en.wikipedia.org/wiki/Modulo_operation – Matchu 2010-01-19 15:07:35

@Matchu是正确的，'6％3 = 0'不是'3'（将'6'除以'3'后的剩余部分是'0' '） – 2010-01-19 15:09:54

的imgs.length++返回值是3，因此3％3 = 0，但imgs.length将4和imgs数组将包含4项目。

尝试在控制台：

var x = [ 1, 2, 3 ] 
x.length++ 
=> 3 
x.length++ 
=> 4 
x.length++ 
=> 5 
x 
[1, 2, 3, undefined, undefined, undefined]

所以每次imgs.length++被称为ITT将一个项目追加到数组中。所以不是一个很好的代码，但短期:)

编辑：在为什么容易回答，在启动它含有cnt元素的数量，因此该代码将每一步的图像上，并从它开始的开始。所以如果imgs数组包含5项目将逐步通过5项目，并开始从一开始。

这个代码的唯一问题是，数组每次都会增加，内存将被浏览器占用。

来源

2010-01-19 14:50:19

容易修复的代码应该是在开始时创建一个计数器并增加该计数器。 'var cnt = counter = imgs.length;' 然后'imgs.length ++'可以替换为'counter ++' – 2010-01-19 15:06:07

，所以它实际上是将更多的对象添加到数组中？我现在知道了。 cnt缓存原始的imgs.length，并且永远不会随着imgs.length的改变而改变。现在有意义... – Jared 2010-01-19 15:06:19

不是一个很好的解决方案，我同意 – 2010-01-19 15:06:46

我不是100％确定的JavaScript，但我知道的其他语言imgs.length++与说imgs.length = imgs.length + 1相同，因此应该进行修改。

我认为这是一个“巧招”，如果在所有使用的应记录在案。 ~~它有点打破什么长度手段的语义，而逻辑上是正确的计算机它并不完全意义相对于属性名~~

所以我想，实际上并更改长度，但我还是止跌不建议在没有记录的情况下使用它。更清晰的方法是宣布一个新的变种i = 0与i++取代imgs.length++，因为虽然它并不可能在这种情况下无所谓，如果你正在做什么都与阵列，长度是现在大概不是您所期望它是。

关于编辑：
6％3是0不3.
模（在编程中，在纯粹数学术语稍微不同的）指分而取余数。
6/3 = 2 0
7/3 = 2的1
8/3 = 2的2
9/3 = 3与其余部分的其余部分的其余部分的其余部分0，

来源

2010-01-19 14:43:39 Davy8

这样实际上会修改它吗？我认为它正在使用'imgs.length'并加1，实际上并没有通过加1来改变'imgs.length'本身。 – Jared 2010-01-19 14:46:41

As @Matchu指出，长度是javascript中数组的可写属性，所以是它确实改变了长度。如果它不可写（不确定是否有像JS中的只读属性这样的事情），它可能会给出错误。 x ++只是说x = x + 1的快捷方式 – Davy8 2010-01-19 14:51:29

我确定你知道imgs.length++，如果它被应用到任何其他变量，将添加一个，修改原始变量。

var x = 1; 
alert(x++); // alerts 1 
alert(x); // alerts 2

果然，这就是发生了什么事。

该脚本在每次运行时递增imgs数组的长度，因此它从3移动到4到5到6等。我不是Javascript内部专家，所以我不确定这是否具有对性能有任何影响，但如果你明白length实际上是一个可写属性，那么这一切都是有道理的。

来源

2010-01-19 14:47:07 Matchu

指出可能不明显的微妙情况的好处在于，第一个警报将显示1而不是2，因为增量发生在返回值后 – Davy8 2010-01-19 14:57:23

（imgs.length ++）％CNT

将通过每个图像使映像循环，反复。

JavaScript中的百分比符号（％）表示它使用Modulus（除法余数）运算符。

实例：

0％3 = 0
1％3 = 1
2％3 = 2
3％3 = 0
4％3 = 1
5％3 = 2 等等

来源

2010-01-19 14:55:03 Fini

我认为OP理解的很多，并且对*为什么* imgs.length ++甚至更加困惑。 – Matchu 2010-01-19 14:58:37

其实他正朝着正确的方向......我编辑了我的OP – Jared 2010-01-19 15:02:55

不错，每4：第二个是滑块运行它扩展阵列功能，使你：

3+1 % 3 = 1 
4+1 % 3 = 2 
5+1 % 3 = 0

等等:)

来源

2010-01-19 15:04:27 nekman

如果你希望你的代码在将来更具可读性，我个人建议你将代码更改为如下所示：

var imgs = [ 
    'image1.jpg', 
    'image2.jpg', 
    'image3.jpg']; 
var i = 0; 

$(function() { // This is a shortcut for $(document).ready(); 
    setInterval(Slider, 4000); 
}); 

function Slider() { 
    $('#imageSlide').fadeOut("slow", function() { 
     i = (i+1) % imgs.length; 
     $(this).attr('src', imgs[i]).fadeIn("slow"); 
    }); 
}

来源

2010-01-19 15:25:57 bradlis7

jquery slide show - 为什么这段代码有效？

回答

相关问题