爲什麼這個循環無法停止？

我嘗試使用jquery（jquery-2.1.1）和構造函數來構建html。但是當我在for循環中嘗試這種方法時，循環無法停止。誰能告訴我爲什麼會發生？爲什麼這個循環無法停止？

下面是代碼。非常感謝。

function tag() { 
    this.addClass = function(...theArgs) { 
     for (index in theArgs) { 
      this.$html.addClass(theArgs[index]); 
     }  
    } 

    this.setAttr = function(attr, value) { 
     this.$html.attr(attr, value); 
    } 

    this.append = function(...theArgs) { 
     for (index in theArgs) { 
      this.$html.append(theArgs[index]); 
     } 
    } 

    this.find = function(value) { 
     return this.$html.find(value); 
    } 

    this.empty = function() { 
     this.$html.empty(); 
    } 

    this.remove = function(value) { 
     this.find(value).remove(); 
    } 

    this.clone = function() { 
     return jQuery.extend(true, {}, this); 
    } 

    this.show = function() { 
     return this.$html[0]; 
    } 
} 

function label(text) { 
    tag.call(this); 

    this.$html = $("<label></label>"); 
    this.append(text); 
} 


for(var index = 0; index < 2; index++) { 
     var fieldLabel = new label(1); 
     console.log(index); 
}

來源

2017-04-06 Charles Zhou

在'.append（）'中有一個undeclard'index'，它們有衝突：'for（index中的Args）{'。一定要聲明你的變量：'for（varArgs在Args中）{' – 2017-04-06 14:21:40

...同樣在'addClass（）'中。使用類似ESLint的linter來查找這些常見錯誤。它會爲你節省很多很多時間。 – 2017-04-06 14:22:48

...並且在數組中使用'for-in'在JS中並不是一個好主意。既然你使用'...'語法，你必須使用ES6的東西，所以我建議使用'for-for'循環。 – 2017-04-06 14:25:27

這裏的問題是，你使用index（不var）作爲運行變量在您tag功能全部循環。該index變量在末尾for-loop的外部範圍內仍然有效（應該在條件爲>=2時停止）。

在循環開始時，index是0。下一個循環應該是1。但是當進入內部方法append時，由於循環for-in（傳入的參數僅爲1，因此擴展表示法使數組長度爲1，並且for-in停止，並且index設置爲0），它重置爲0。所以在第二個循環結束時，它仍然是0。這意味着它永遠不會變得更大的值1（僅在for-loop開始時增加）。條件< 2將始終得到滿足，for-loop將永遠運行。

您可以在運行變量for-in中使用其他名稱。或者只是聲明另一個局部範圍的使用var，這樣index：

this.append = function(...theArgs) { 
    for (var index in theArgs) { 
     this.$html.append(theArgs[index]); 
    } 
}

或者更好的使用for-of有人建議。

來源

2017-04-06 14:49:18

我收到了你，謝謝 –

@CharlesZhou如果有幫助，請花時間接受答案。否則，你應該刪除你的問題，因爲看起來只是一個簡單的錯誤，並沒有被別人利用。 –

爲什麼這個循環無法停止？

回答

相關問題