jQuery。fn的意思吗?

这里的fn是什么意思?

jQuery.fn.jquery
304557 次浏览
小开

jQuery.fn是定义为jQuery.prototype的简写。源代码:

jQuery.fn = jQuery.prototype = {
// ...
}

这意味着jQuery.fn.jquery是jQuery.prototype.jquery的别名，后者返回当前jQuery版本。还是来自源代码:

// The current version of jQuery being used
jquery: "@VERSION",
小开
最佳答案

在jQuery中，fn属性只是prototype属性的别名。

jQuery标识符(或$)只是一个构造函数，用它创建的所有实例都继承自构造函数的原型。

简单的构造函数:

function Test() {
this.a = 'a';
}
Test.prototype.b = 'b';


var test = new Test();
test.a; // "a", own property
test.b; // "b", inherited property

一个类似于jQuery架构的简单结构:

(function() {
var foo = function(arg) { // core constructor
// ensure to use the `new` operator
if (!(this instanceof foo))
return new foo(arg);
// store an argument for this example
this.myArg = arg;
//..
};


// create `fn` alias to `prototype` property
foo.fn = foo.prototype = {
init: function () {/*...*/}
//...
};


// expose the library
window.foo = foo;
})();


// Extension:


foo.fn.myPlugin = function () {
alert(this.myArg);
return this; // return `this` for chainability
};


foo("bar").myPlugin(); // alerts "bar"
小开

fn字面上指的是jquery的prototype。

这行代码在源代码中:

jQuery.fn = jQuery.prototype = {
//list of functions available to the jQuery api
}

但是，fn背后的真正工具是它可以将您自己的功能钩子到jQuery中。记住jquery将是函数的父作用域，因此this将引用jquery对象。

$.fn.myExtension = function(){
var currentjQueryObject = this;
//work with currentObject
return this;//you can include this if you would like to support chaining
};

这里有一个简单的例子。假设我想做两个扩展，一个是蓝色边框，一个是蓝色文本，我想把它们链接起来。

< em > < a href = " http://jsfiddle.net/CVrFU/ " rel = " noreferrer " > # EYZ0 < / > < / em >

$.fn.blueBorder = function(){
this.each(function(){
$(this).css("border","solid blue 2px");
});
return this;
};
$.fn.blueText = function(){
this.each(function(){
$(this).css("color","blue");
});
return this;
};

现在你可以像这样对一个类使用它们:

$('.blue').blueBorder().blueText();

(我知道这是最好的css，如应用不同的类名，但请记住，这只是一个演示的概念)

这个答案是一个成熟的扩展的好例子。

小开

在jQuery源代码中，我们有jQuery.fn = jQuery.prototype = {...}，因为jQuery.prototype是一个对象，jQuery.fn的值将简单地引用同一个对象，jQuery.prototype已经引用。

为了确认这一点，你可以检查jQuery.fn === jQuery.prototype，如果它评估true(它做)，然后它们引用相同的对象

小开

.fn美元是jQuery.prototype的别名，它允许你用自己的函数来扩展jQuery。

例如:

 $.fn.something = function{}

会允许你使用吗

$("#element").something()

.fn美元也是jQuery.fn。的同义词


提交答案