jQuery olmadan javascript eklentisi nasıl yazılır

Question

jQuery ile yazma eklentileri nispeten kolaydır, sadece $ .fn'yi kullanın ve yolunuza devam edin. Öyleyse:

$.fn.analyse = function() { 
... 
} 

Peki ya jQuery'yi kullanamıyorsanız? Ben hoş karşılanmaz anladığım kadarıyla Ama

Object.prototype.analyse = function() { 
... 
} 

:

document.querySelector("#mydiv").analyse(); 

böyle bu konuda gidebiliriz:

ı aşağıdaki kodu kullanmak mümkün istiyorum diyelim!

var proto_methods = { 
    analyse: function() { 
     var node = this.node; 

     // ... 
    } 
}, wrap, _wrap; 

_wrap = function(selector) { this.node = document.querySelector(selector); }; 
_wrap.prototype = proto_methods; 

wrap = function(selector) { 
    return new _wrap(selector); 
}; 

böyle kullanın:

Answer 1

İşte başlangıç ​​için bir şey

wrap("#mydiv").analyse(); 

kullanın daha eklentileri eklemek istiyorsanız bu (ve bu kadar biraz daha nesne yönelimli):

var pack = { 
    binder: [{}] 
}; 

pack.query_bind = function(bound) { 
    if (bound) pack.binder[1] = bound; 
}; 

pack.fn = function(attributes) { 
    for (var i in attributes) pack.binder[0][i] = attributes[i]; 
}; 

var _wrap = function(selector) { 
    this.node = /^(#|.)\w+/.test(selector) ? pack.binder[1](selector) : {}; 
}; 

_wrap.prototype = pack.binder[0]; 

var wrap = function(selector) { 
    pack.query_bind(document.querySelector.bind(document)); 
    return new _wrap(selector); 
}; 

wrap.fn = pack.fn; 

wrap.fn({ 
    cool: function() {}, 
    nice: function() {} 
}); 

wrap('#mydiv').cool(); 

istediğiniz zaman wrap.fn arayabilir ve prototip güncellenecektir. Ancak, bu kodda yer almadığım birçok şey olduğundan, jQuery için bunun gerçek bir yerine geçmediğini unutmayın. wrap işlevi, jQuery'nin $ kadar gelişmiş ve kullanışlı değildir.

Umarım bu yardımcı olur.

Answer 2

Sadece boilerplate yazdı. Kendi seçici mantığına sahip değildir, çünkü zaten kendi seçici motoru olan D3.js'nin üstünde kütüphane için tasarlanmıştır. https://gist.github.com/turboMaCk/34bde8e744f5921be0c4