用普通的javascript或coffeescript模仿jQuery插件

Question

不使用jQuery，我想知道如何模仿jQuery插件

例如，也許$（'div.x'）。plugin（）將onclick附加到div，然后遞增並顯示內部值。

jQuery實際上將對象與內部變量一起存儲在哪里？

是否在某個位置顯式創建了對象並與每個節點相關聯？

我迷路於向我自己解釋為什么在主應用程序列表中沒有顯式的對象創建....必須以某種方式在插件內發生嗎？

（PS：我不太關心查詢引擎方面……只是插件方面：）

謝謝

Answer 1

通常，您可以通過編寫以下內容來定義類似plugin()的函數

$.fn.plugin = ...

作為討論在這里 ， $.fn實際上只是一個快捷方式jQuery.prototype 。 當您將方法附加到構造函數的原型時，JavaScript會使用new關鍵字將其自動附加到從該構造函數創建的所有實例，當您編寫類似$('li')類的內容時，jQuery會在內部執行。 參見http://javascriptweblog.wordpress.com/2010/06/07/understanding-javascript-prototypes/ 。

因此，這是一個在CoffeeScript中創建名為kQuery的庫的簡單示例，它允許您1）創建命名實例和2）添加插件：

instances = {}
kQuery = (name) ->
K = (name) ->
  return instances[name] if instances[name]
  instances[name] = new kQuery name
K.fn = kQuery.prototype

而已！ 現在如果有人要寫

K.fn.plugin = -> console.log 'foo'
K('whatev').plugin()

他們會在控制台上看到foo 。 請注意，使用單獨的kQuery和K函數的原因是，如果從K函數中調用new K ，則會得到一個無限循環（這將解決錯誤）。