實現每個vanila JS類似的jQuery

我已經實現each功能像這樣的JS：實現每個vanila JS類似的jQuery

Object.prototype.each = function(fn){ 
    for (var x in this){ 
    if (this.hasOwnProperty(x)){ 
     fn(x); 
    } 
    } 
    return this; 
}; 


var o = {'a' : 'apple', 'b' : 'bat', 'c' : 'cat'}; 
o.each(function(i){ 
    alert(i); 
});

雖然這工作得很好。它有什麼問題嗎？詢問是因爲我在學習JS。

而且它爲什麼會產生錯誤，如果我做的：

{'a' : 'apple', 'b' : 'bat', 'c' : 'cat'}.each(function(i){ 
    alert(i); 
});

來源

2012-01-30 Dev555

您需要在對象周圍放置圓括號，或者由於打開和關閉大括號將它解釋爲塊。

({'a' : 'apple', 'b' : 'bat', 'c' : 'cat'}).each(function(i){ 
    alert(i); 
});

當你這樣做沒有括號，解釋器將「看見」這樣的：

{ // open block statement 
    'a' : 'apple', 'b' : 'bat', 'c' : 'cat' // not a valid expression! 
}.each(function(i){ // there's no dot property access notation for statements! 
    alert(i); 
});

這是一個塊有一個表達式。但是，由於這不是一個有效的表達式，它將返回一個語法錯誤。即使它是一個有效的表達式，它仍然會給你一個錯誤，因爲塊不具有屬性，因此，點屬性訪問標記並不適用：

{ console.log("hello world"); }.each(function(){})

因此，你需要告訴翻譯，對象是一個表達式，通過將它包裝在括號中以消除歧義（因爲您不能將語句放在括號內 - 僅表達式）。

來源

2012-01-30 19:20:50

我的每個實現都可以通過它的方式或任何錯誤嗎？ – Dev555 2012-01-30 19:57:51

@ Dev555我認爲如果你這樣做了：'fn.call（this，x，this [x]）'而不是'fn（x）'，它可能會更有用。否則，我沒有看到任何明顯的錯誤。 – 2012-01-30 20:15:44

@ Dev555您還應該閱讀https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/defineProperty，以便您可以瞭解如何定義非枚舉屬性，以便您的方法不會以'for在'循環中。 – 2012-01-30 20:25:09

你的實現看起來不錯。

{'a' : 'apple', 'b' : 'bat', 'c' : 'cat'}.each...產生錯誤，因爲它在語法上不正確。包含在()裏面就行了。

試試這個。

({'a' : 'apple', 'b' : 'bat', 'c' : 'cat'}).each(function(i){ 
    alert(i); 
});

來源

2012-01-30 19:20:49 ShankarSangoli

我也注意到了，但你能解釋爲什麼它在語法上不正確嗎？ – ori 2012-01-30 19:28:37

因爲當有開啓和關閉的Cur括號時，JavaScript引擎將它視爲一個塊，並且您不能在腳本塊上調用方法。 'function（）{}。something（）'不會以相同的方式工作。但是'（function（）{}）。something（）'會起作用。 – ShankarSangoli 2012-01-30 19:38:57

實現每個vanila JS類似的jQuery

回答

相關問題