Maison > Article > interface Web > Comment utiliser les outils dans jquery $.isFunction, $.isArray(), $.isWindow()_jquery
Dans Jugement du type de variable en JavaScript, nous avons expliqué le principe de l'implémentation de $.type() en jquery. Bien sûr, en plus de fournir des méthodes outils $.type, jquery fournit également plusieurs autres méthodes outils : $.isFunction(), $.isArray(), $.isWindow(), $.isNumeric(), etc. Le but de ces méthodes peut être vu à partir des noms de méthodes. Expliquons un par un les détails internes de ces méthodes implémentées dans jQuery (2.1.2).
1. $.isFunction()
$.isFunction() est utilisé pour déterminer si une variable est de type fonction. Jetons un coup d'œil à quelques exemples :
$.isFunction(123); // false $.isFunction(true);// false $.isFunction([1, 2]);// false $.isFunction(function(){});// true function func(){ } var sfunc = function(){ } $.isFunction(func); // true $.isFunction(sfunc);// true
Comme vous pouvez le voir dans l'exemple ci-dessus, dans $.isFunction(param), si le paramètre entrant est un type de fonction, il renverra true ; pour les autres types, il renverra false.
En regardant le code source de jquery, nous pouvons voir que $.isFunction() est également implémenté via $.type() :
isFunction: function( obj ) { return jQuery.type(obj) === "function"; }
2. $.isArray()
$.isArray() est utilisé pour déterminer si la variable est de type tableau. De même, nous examinons également l'utilisation de $.isArray à travers plusieurs exemples :
$.isArray(123); // false $.isArray(true); // false $.isArray([1, 2]);// true $.isArray(new Array(3, 4)); // true
Qu'il s'agisse d'un littéral de tableau ou d'une variable créée à l'aide du nouveau mot-clé, vous pouvez utiliser $.isArray() pour déterminer s'il s'agit d'un type de tableau. Dans le code source de jquery, $.isArray appelle la méthode isArray fournie par Array natif. Car dans les versions supérieures des navigateurs, JavaScript natif a été fourni avec une méthode isArray pour déterminer si la variable est de type tableau.
isArray : Array.isArray
3. $.isWindow()
$.isWindow() est utilisé pour déterminer si la variable actuelle est une fenêtre, telle que :
$.isWindow(window); // true $.isWindow([]); // false $.isWindow(null); // false
Dans le code source jQuery :
isWindow: function( obj ) { return obj != null && obj === obj.window; }
Il détermine si obj est un objet window en déterminant si obj a un attribut window. Parce qu'il y a un attribut window dans l'objet window, qui est lui-même donc : window.window===window, pareil :
window.window.window.window === window;
Vous pouvez continuer à faire une boucle.
Pourquoi devons-nous d'abord déterminer si obj est nul dans le code ? Parce que lorsqu'il juge si null ou undefined a une propriété window, le code lèvera une exception : Uncaught TypeError : Impossible de lire la propriété 'window' de null. Par conséquent, afin d'éviter les erreurs de code, déterminez d'abord si la variable est nulle. Si elle est nulle, ce n'est certainement pas un objet window et renvoie directement false, sinon, il est ensuite déterminé si la variable a un attribut window.
4. $.isNumeric()
$.isNumeric() est utilisé pour déterminer si la variable actuelle est de type numérique, mais pourquoi n'utilise-je pas $.type()=="number" pour le déterminer. Jetons d'abord un coup d'œil à quelques exemples officiels :
$.isNumeric("-10"); // true $.isNumeric(16); // true $.isNumeric(0xFF); // true $.isNumeric("0xFF"); // true $.isNumeric("8e5"); // true (exponential notation string) $.isNumeric(3.1415); // true $.isNumeric(+10); // true $.isNumeric(0144); // true (octal integer literal) $.isNumeric(""); // false $.isNumeric({}); // false (empty object) $.isNumeric(NaN); // false $.isNumeric(null); // false $.isNumeric(true); // false $.isNumeric(Infinity); // false $.isNumeric(undefined); // false
L'utilisation de $.isNumeric() peut déterminer les numéros de type de chaîne tels que "-10" et "0xFF", tandis que $.type() les analysera en type de chaîne.
Dans le code source de jquery, le type de variable est déterminé comme ceci :
isNumeric: function( obj ) { // parseFloat NaNs numeric-cast false positives (null|true|false|"") // ...but misinterprets leading-number strings, particularly hex literals ("0x...") // subtraction forces infinities to NaN // adding 1 corrects loss of precision from parseFloat (#15100) return !jQuery.isArray( obj ) && (obj - parseFloat( obj ) + 1) >= 0; }
Déterminez d’abord si la variable est de type tableau, et si c’est le cas, renvoyez directement false. Mais pourquoi devons-nous d’abord déterminer si la variable est de type tableau ? Parce que les tableaux de type [123] peuvent être directement soustraits et peuvent également être convertis en nombres via parseFloat(["123"]) :
[100] - 60 // 40 [100] - [60] // 40 parseFloat([123]) // 123 parseFloat(["345"]) // 345
Par conséquent, il ne peut pas être converti directement via parseFloat() puis jugé. Tout d’abord, vous devez déterminer si la variable est un tableau ; sinon, passez à l’étape suivante :
(obj - parseFloat( obj ) 1) >= 0
Les nombres purs, les nombres de type chaîne, les nombres commençant par 0 (octal), les tableaux commençant par 0x (hexadécimal), etc. peuvent être convertis en nombres décimaux via parseFloat(). Après l’opération de l’expression ci-dessus, elle doit être supérieure à 0. Mais pourquoi en ajouter 1 ? Il est également expliqué dans le code que la conversion via parseFloat() entraînera un problème de perte de précision, donc après 1, le résultat de l'opération sera plus précis.
Pour les autres types, NaN est obtenu après conversion via parseFloat() Quelle que soit l'opération effectuée, NaN ne peut pas être comparé à 0 et renvoie false.
Dans les versions précédentes de jquery (telles que 2.0.2) :
isNumeric: function( obj ) { return !isNaN( parseFloat(obj) ) && isFinite( obj ); }
Nous pouvons constater qu'après avoir exécuté le code $.isNumeric([123]), nous obtenons vrai, mais en fait, c'est un type tableau. Heureusement, cela a été corrigé dans les versions ultérieures.
5. $.isEmptyObject()
$.isEmptyObject() n'est pas utilisé pour déterminer le type d'une variable, mais pour déterminer si un type d'objet est vide et ne contient aucun attribut.
À partir de jQuery 1.4, cette méthode détecte à la fois les propriétés de l'objet lui-même et les propriétés héritées du prototype (hasOwnProperty n'est donc pas utilisé). Le paramètre doit être un objet JavaScript simple, d'autres types d'objets (éléments DOM, chaînes/nombres bruts, objets hôtes) peuvent ne pas fournir des résultats cohérents entre les navigateurs.
$.isEmptyObject({name:"wenzi"}) // false $.isEmptyObject({}) // true function Person(){ this.name = "wenzi" } $.isEmptyObject(new Person()); // false function Student(){ } Student.prototype.name = "wenzi"; $.isEmptyObject(new Student()); // false
我们能够看到,不论是对象本身的属性,还是prototype上的属性,只要存在,都会返回false。
isEmptyObject: function( obj ) { var name; for ( name in obj ) { return false; } return true; }
在jquery中,是通过for~in进行检测的。因为for~in也是能循环到prototype上的属性的,若进入到循环中,则说明obj存在属性,发挥false;否则返回true。
6. 总结
jquery中还提供了很多各种各样的工具方法,让我们在编写js代码时更加的方便。以后有机会时再总结其他的工具方法。