jQuery如何使用$ object构造函数和与$相关联的方法？
怎么jQuery可以做$("#foo").addClass("bar")和$.ajax() ？
我正在创建一个微型JavaScript框架，并希望创建一个对象的新实例，例如$("#hello") 。 对于这个对象，有一些相关的方法，比如addClass ， css等，就像jQuery一样。 所以我可以做点什么
$("#foo").addClass("remove").css("color", "red");
我成功地创造了这个。 但是，当我想从这个对象调用一个方法，比如$.ajax ，构造函数被覆盖，我可以调用$ .ajax，但不能调用$（“＃foo”）。
基本上，jQuery如何做到这两点？
好的， $ function不仅是一个函数，而且是一个对象，就像所有函数一样。 所以它可以有方法。 这就是ajax ， $函数的一种方法。 所以我们可以从这开始：
$ = function(obj) { // some code }; $.ajax = function (arg1, arg2) { // some ajax-y code };
到现在为止还挺好。 现在，我们究竟在$函数中添加了什么？ 好吧，它必须返回一个对象，该对象必须在其上定义一些很好的方法。 所以我们需要一个构造函数（给我们新的对象）和一个原型（为这些对象提供漂亮的方法）。
$ = function(obj) { var myConstructor = function (obj) { this.wrappedObj = obj; }; myConstructor.prototype = { niftyMethod: function () { // do something with this.wrappedObj return this; // so we can chain method calls }, anotherNiftyMethod: function (options) { // do something with this.wrappedObj and options return this; } }; return new myConstructor(obj); };
因此，我们有它。 我们做得到：
var mySnazzObject = $("whatever"); mySnazzObject.niftyMethod().anotherNiftyMethod(true);
我们可以这样做：
$.ajax("overthere.html", data);
很明显，jQuery做的远不止于此，它以一些非常令人印象深刻的方式做到了，但这是一般的想法。
更新 ：AS @Raynos非常友好地观察而没有提供建设性的答案，我的原始代码将无限制地创建原型。 因此，我们使用匿名自动执行函数分别声明构造函数和原型：
(function () { var myConstructor = function (obj) { this.wrappedObj = obj; }; myConstructor.prototype = { niftyMethod: function () { // do something with this.wrappedObj return this; // so we can chain method calls }, anotherNiftyMethod: function (options) { // do something with this.wrappedObj and options return this; } }; var $ = function(obj) { return new myConstructor(obj); }; $.ajax = function (arg1, arg2) { // some ajax-y code }; window.$ = $; }());
$ = function(arg) { console.log("$ function called with " + arg); } $.ajax = function(arg) {console.log("$.ajax called with " + arg);} $('foo'); $.ajax('bar');
我不认为这里有任何魔力。 $只是全局函数的名称。 请记住，在javascript中，函数是可以拥有自己属性的第一类对象，包括子函数，这就是$.ajax 。
既然你提到了构造函数，我应该注意这里没有使用OO对象，只是常规函数（没有new关键字），所以构造函数不会发挥作用。 如果您使用的是new关键字，那可能就是您感到困惑的地方。 如果你想让$('#foo')返回一个新对象，那么在$ function的代码中你应该使用new创建一个新对象并返回它，这就是jQuery所做的，但$ function本身不是构造函数，不应该用new来调用。 或者在类似$('#someID') ，在该函数内部，jQuery从DOM获取一个元素对象然后返回该对象，但是$只是一个常规函数，其返回值是一个对象，而不是构造函数。
两件事：
$.ajax是jQuery的原型函数，叫做ajax。
虽然$ （’foo’）是对jQuery函数的调用 ，并且根据foo的类型，它以不同的方式作出反应。 在http://api.jquery.com/jQuery中，您可以看到jQuery（几乎与$相同）可以对三种不同类型做出反应：选择器，html或回调。
您可以模仿神奇的jQuery行为，如下所示：
//define var _$ = {}; var $ = function(selector) { _$.html = function(args) { alert("Doing the method 'html' with arguments " + args + " for selector " + selector); return _$; //needed for pipeline }; return _$; }; $.ajax = function(args){alert("Doing the method 'ajax' "); } //and try $("selector1").html("args1").html("args2"); $.ajax("args2");