jQuery的$ a函数和对象如何?
我的意思是{} [object Object]
。 它如何同时执行$(selector)
和$.fn.init
?
你能给我一个简单的例子吗?
这不是jQuery独有的,而是javascript的一个方面。 所有function都是对象。 例如:
var f = function() { alert('yo'); } f.foo = "bar"; alert(f.foo); // alerts "bar" f(); // alerts "yo"
Javascript是一种面向对象的语言,因此function是ARE对象,只是你可以调用的花哨的对象。
foo = function() { console.log("foo") } foo.bar = function() { console.log("bar") } foo() //=> prints "foo" foo.bar() //=> prints "bar"
$
是一个function。 $的方法可以返回任何东西。
例如:
$ = function() { return { foo : function() { return 'baa'; }, r1: 1, r2 : 'string' } }; typeof $ <- function typeof $() <- object typeof $().foo <- function typeof $().foo() <- string typeof $().r1; <- number typeof $().r2 <- string
jQuery
或$
是一个函数(你知道$
是jQuery
的别名)。
// Define a local copy of jQuery jQuery = function( selector, context ) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init( selector, context, rootjQuery ); },
在Javascript中,一切都是对象甚至function
。 因此,您可以直接向function添加属性。
jQuery.find = function () { }
这是一个对象。
$
拥有不同的function。
您可以通过制作自己的对象来自行测试:
var $ = { select: function(id){return document.getElementById(id);} } function $(id){ return $.select(id); }
var s = function(){}; s.test = function(){console.log('inside s');} s.test();
是完全合法的代码。
人们玩javascript函数,它会导致有趣的设计模式.Jquery使用了许多这些模式,并围绕许多函数创建了一个很好的包装器。所以最终jquery就像一个静态类,使用它可以做一些非常整洁的东西..
像所有类一样,它有一个名称,默认名称是jQuery。 $是没有什么可以购买绑定到jQuery库的标识符,并且不必输入“jQuery”作为标识符。
它是$符号的事实是任意的。 在某些时候,决定使用$符号,但事实是它几乎可以是任何类型的ECMAScript可接受的标识符。
我们使用$作为标识符的主要原因是,在键入一个字符而不是字符串时,您不太可能犯到简单的拼写错误。
希望能让事情变得清晰..如果我出错了,请纠正我们
一个简单的例子说我自己的图书馆会说一个计算器类
var Calculator= (function() { function add(a,b) { return a+b; } function subtract(a,b) { return ab; } function multiply() { return a*b; } function log() { console.log("log 123") } return { add: add, subtract: subtract, multiply: multiply } }());
现在我可以使用Calculator类执行操作,如下所示:
Calculator.multiply(Calculator.add(2,3),5);
添加我的本地函数是私有的,不会暴露在外面使用。 在这种情况下,我无法使用Calculator.log访问我的日志function,它会说在对象上找不到方法。
现在回到你的问题,你可以做这样的事情:
var _ =计算器;
现在使用calc函数
_.multiply(_.add(2,3),5);
有趣的是,有一个名为下划线的库..
var q=function(){}; var s = function(){ alert("base"); window.s = s; return new q()}; q.fn = q.prototype = {}; q.fn.x = sx = function(){alert("x");return this;}; q.fn.y = sy = function(){alert("y");return this;}; q.fn.z = sz = function(){alert("z");return this;}; s().y().z().x(); sz().x().y();