jQuery.fn은 무슨 뜻입니까?

jQuery.fn은 무슨 뜻입니까?

의 개요fn여기서요?

jQuery.fn.jquery

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는 함수의 상위 스코프가 되기 때문에thisjquery 객체를 참조합니다.

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

여기 간단한 예가 있습니다.예를 들어, 두 개의 확장자를 만들겠습니다. 하나는 파란색 테두리를 두르고, 다른 하나는 파란색 테두리를 두르고, 다른 하나는 파란색으로 칠하고, 두 개의 확장자를 연결하려고 합니다.

jsFiddle Demo

$.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.fn의 약자로 정의되어 있습니다.jQuery.prototype. 소스 코드:

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

즉,jQuery.fn.jquery의 에일리어스입니다.jQuery.prototype.jquery현재 jQuery 버전을 반환합니다.소스코드에서 다시:

// The current version of jQuery being used
jquery: "@VERSION",

$.fn은 jQuery.protype의 별칭으로, jQuery를 자신의 함수로 확장할 수 있습니다.

예:

 $.fn.something = function{}

를 사용할 수 있습니다.

$("#element").something()

$.fn은 jQuery.fn과 동의어이기도 합니다.

jQuery 소스 코드에는jQuery.fn = jQuery.prototype = {...}부터jQuery.prototype가치가 있는 객체입니다.jQuery.fn단순히 같은 대상을 언급하는 것이 될 것이다.jQuery.prototype이미 참조하고 있습니다.

이것을 확인하려면 , 다음의 항목을 확인해 주세요.jQuery.fn === jQuery.prototype그것이 평가된다면true(그것은) 그리고 그들은 같은 대상을 참조한다.

언급URL : https://stackoverflow.com/questions/4083351/what-does-jquery-fn-mean