jquery slide show - 爲什麼這段代碼有效？

Question

我當時正在使用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

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

爲什麼？

Answer 1

的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項目，並開始從一開始。

這個代碼的唯一問題是，數組每次都會增加，內存將被瀏覽器佔用。

Answer 2

我不是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，

Answer 3

我確定你知道imgs.length++，如果它被應用到任何其他變量，將添加一個，修改原始變量。

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

果然，這就是發生了什麼事。

該腳本在每次運行時遞增imgs數組的長度，因此它從3移動到4到5到6等。我不是Javascript內部專家，所以我不確定這是否具有對性能有任何影響，但如果你明白length實際上是一個可寫屬性，那麼這一切都是有道理的。

Answer 4

（imgs.length ++）％CNT

將通過每個圖像使映像循環，反覆。

JavaScript中的百分比符號（％）表示它使用Modulus（除法餘數）運算符。

實例：

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

Answer 5

不錯，每4：第二個是滑塊運行它擴展陣列功能，使 你：

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

等等:)

Answer 6

如果你希望你的代碼在將來更具可讀性，我個人建議你將代碼更改爲如下所示：

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"); 
    }); 
}