Maison >interface Web >js tutoriel >Qu'est-ce que jQuery.fn et comment ça marche ?

Qu'est-ce que jQuery.fn et comment ça marche ?

DDD
DDDoriginal
2024-11-05 03:57:02353parcourir

What is jQuery.fn and How Does It Work?

jQuery.fn : Aliasing de prototype dans jQuery

Dans jQuery, le terme "fn" rencontré dans jQuery.fn.jquery fait référence à un alias pour la propriété prototype de la fonction constructeur jQuery ($). Pour comprendre cela, il est crucial de saisir le concept de fonctions constructeur en JavaScript.

Une fonction constructeur est utilisée pour créer des instances d'objets, dont chacune hérite des propriétés et des méthodes du prototype du constructeur. Dans le cas de jQuery, l'identifiant $ sert de fonction constructeur.

Par exemple, considérons la fonction constructeur suivante :

<code class="javascript">function Test() {
  this.a = 'a';
}
Test.prototype.b = 'b';

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

La fonction constructeur Test crée une instance de test qui hérite de son prototype . L'instance de test a sa propre propriété a, tandis que b est héritée du prototype.

De même, jQuery suit une approche similaire :

<code class="javascript">(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"</code>

Ici, l'alias fn pointe vers le prototype de la fonction constructeur foo. L'extension de la propriété fn permet d'ajouter de nouvelles méthodes (telles que myPlugin dans l'exemple) à toutes les instances du constructeur foo.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn