2

我正在使用 jquery 在 javascript 中编写幻灯片时，遇到了一些正在做我的几行代码在几行中所做的事情。

问题是，我不明白它是如何工作的，所以我可以修改它。

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

等等等等..但它不应该重置。但是，如果我放 aalert(imgs.length % cnt);它只返回 0, 1, 2 而不是重置。

为什么？

4

6 回答 6

3

的返回值为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++调用它都会将一项添加到数组中。所以不是一个很好的代码但很短:)

编辑：为什么很容易回答，一开始它包含cnt许多元素，所以代码会踩到每张图片，并从它的开头开始。因此，如果imgs数组包含5项目，它将逐步遍历5项目并从头开始。

这段代码的唯一问题是，数组每次都会增加，内存会被浏览器吃掉。

于 2010-01-19T14:50:19.710 回答
2

我敢肯定您知道imgs.length++，如果将其应用于任何其他变量，则会对其添加一个，从而修改原始变量。

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

果然，就是这么回事。

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

于 2010-01-19T14:47:07.190 回答
0

如果您希望您的代码将来更具可读性，我个人建议您将代码更改为以下内容：

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-19T15:25:57.567 回答
0

(imgs.length++)%cnt

将导致图像一遍又一遍地循环遍历每个图像。

JavaScript 中的百分号 (%) 表示它使用模数（除法余数）运算符。

例子：

  • 0 % 3 = 0
  • 1 % 3 = 1
  • 2 % 3 = 2
  • 3 % 3 = 0
  • 4 % 3 = 1
  • 5 % 3 = 2 等等...
于 2010-01-19T14:55:03.843 回答
0

我不是 100% 确定使用 javascript，但我知道的所有其他语言都imgs.length++与所说的相同，imgs.length = imgs.length + 1因此应该对其进行修改。

我认为这是一个“聪明的把戏”，如果使用的话，应该记录在案。它有点打破了长度意味着什么的语义，所以虽然在逻辑上对计算机来说是正确的，但它与属性名称的关系并不完全有意义

所以我猜它实际上确实改变了长度，但我仍然不建议在没有记录的情况下使用它。一个更明确的方法是声明一个新的 vari = 0并替换imgs.length++为i++，因为虽然在这种情况下它可能并不重要，但如果你对数组做任何其他事情，现在的长度可能不是你期望的那样.

关于编辑：
6 % 3 是 0 而不是 3。
模（在编程中，在纯数学术语中略有不同）意味着除法并取余数。
6 / 3 = 2，余数为 0。
7 / 3 = 2，余数为 1。
8 / 3 = 2，余数为 2。
9 / 3 = 3，余数为 0，

于 2010-01-19T14:43:39.143 回答
0

好吧，函数 Slider 运行的每 4:th 秒都会扩展数组，所以你得到：

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

等等 ：）

于 2010-01-19T15:04:27.443 回答