Heim > Web-Frontend > js-Tutorial > So verwenden Sie Tools in jquery $.isFunction, $.isArray(), $.isWindow()_jquery

So verwenden Sie Tools in jquery $.isFunction, $.isArray(), $.isWindow()_jquery

WBOY
Freigeben: 2016-05-16 15:46:06
Original
1005 Leute haben es durchsucht

In Beurteilung des Variablentyps in JavaScript haben wir das Prinzip der $.type()-Implementierung in jquery erklärt. Zusätzlich zu den Tool-Methoden vom Typ $.type bietet jquery natürlich auch mehrere andere Tool-Methoden: $.isFunction(), $.isArray(), $.isWindow(), $.isNumeric() usw. Der Zweck dieser Methoden ist aus den Methodennamen ersichtlich. Lassen Sie uns nacheinander die internen Details dieser in jQuery (2.1.2) implementierten Methoden erläutern.

1. $.isFunction()

$.isFunction() wird verwendet, um zu bestimmen, ob eine Variable vom Funktionstyp ist. Schauen wir uns einige Beispiele an:

1

2

3

4

5

6

7

8

9

10

11

12

13

$.isFunction(123); // false

$.isFunction(true);// false

$.isFunction([1, 2]);// false

$.isFunction(function(){});// true

 

function func(){

 

}

var sfunc = function(){

 

}

$.isFunction(func); // true

$.isFunction(sfunc);// true

Nach dem Login kopieren

Wie Sie dem obigen Beispiel entnehmen können, gibt der eingehende Parameter in $.isFunction(param) „true“ zurück, wenn es sich bei anderen Typen um „false“ handelt.
Wenn wir uns den Quellcode von jquery ansehen, können wir sehen, dass $.isFunction() auch über $.type() implementiert wird:

1

2

3

isFunction: function( obj ) {

    return jQuery.type(obj) === "function";

}

Nach dem Login kopieren

2. $.isArray()

$.isArray() wird verwendet, um zu bestimmen, ob die Variable vom Array-Typ ist. In ähnlicher Weise betrachten wir auch die Verwendung von $.isArray anhand mehrerer Beispiele:

1

2

3

4

$.isArray(123);  // false

$.isArray(true); // false

$.isArray([1, 2]);// true

$.isArray(new Array(3, 4)); // true

Nach dem Login kopieren

Unabhängig davon, ob es sich um ein Array-Literal oder eine mit dem Schlüsselwort new erstellte Variable handelt, können Sie mit $.isArray() ermitteln, ob es sich um einen Array-Typ handelt. Im JQuery-Quellcode ruft $.isArray die von nativem Array bereitgestellte isArray-Methode auf. Denn in höheren Browserversionen wurde natives JavaScript mit einer isArray-Methode ausgestattet, um zu bestimmen, ob die Variable vom Array-Typ ist.
isArray: Array.isArray
3. $.isWindow()

$.isWindow() wird verwendet, um zu bestimmen, ob die aktuelle Variable ein Fenster ist, wie zum Beispiel:

1

2

3

$.isWindow(window); // true

$.isWindow([]);     // false

$.isWindow(null);   // false

Nach dem Login kopieren

Im jQuery-Quellcode:

1

2

3

isWindow: function( obj ) {

    return obj != null && obj === obj.window;

}

Nach dem Login kopieren

Er bestimmt, ob obj ein Fensterobjekt ist, indem er bestimmt, ob obj ein Fensterattribut hat. Da es im Fensterobjekt ein Attributfenster gibt, das selbst ist, lautet daher: window.window===window, dasselbe:

window.window.window.window === window;

Sie können die Schleife fortsetzen.

Warum müssen wir zuerst feststellen, ob obj im Code null ist? Denn bei der Beurteilung, ob null oder undefiniert eine Fenstereigenschaft hat, löst der Code eine Ausnahme aus: Uncaught TypeError: Cannot read property 'window' of null. Um Codefehler zu vermeiden, stellen Sie daher zunächst fest, ob die Variable null ist, es ist definitiv kein Fensterobjekt und gibt andernfalls direkt false zurück.

4. $.isNumeric()

$.isNumeric() wird verwendet, um zu bestimmen, ob die aktuelle Variable einen numerischen Typ hat, aber warum verwende ich nicht $.type()=="number" zur Bestimmung? Schauen wir uns zunächst einige offizielle Beispiele an:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

$.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

Nach dem Login kopieren

Mit $.isNumeric() können String-Typ-Nummern wie „-10“ und „0xFF“ ermittelt werden, während $.type() sie in String-Typen analysiert.
Im JQuery-Quellcode wird der Variablentyp wie folgt bestimmt:

1

2

3

4

5

6

7

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;

}

Nach dem Login kopieren

Bestimmen Sie zunächst, ob die Variable vom Array-Typ ist, und geben Sie in diesem Fall direkt false zurück. Aber warum müssen wir zuerst feststellen, ob die Variable vom Array-Typ ist? Weil Arrays vom Typ [123] direkt subtrahiert und auch über parseFloat(["123"]):

in Zahlen umgewandelt werden können

1

2

3

4

[100] - 60      // 40

[100] - [60]        // 40

parseFloat([123])   // 123

parseFloat(["345"]) // 345

Nach dem Login kopieren

Daher kann es nicht direkt über parseFloat() konvertiert und dann beurteilt werden. Zuerst müssen Sie feststellen, ob es sich bei der Variablen um ein Array handelt. Wenn nicht, fahren Sie mit dem nächsten Schritt fort:

(obj - parseFloat( obj ) 1) >= 0

Reine Zahlen, Zahlen vom Typ String, Zahlen beginnend mit 0 (oktal), Arrays beginnend mit 0x (hexadezimal) usw. können durch parseFloat() in Dezimalzahlen konvertiert werden. Nach der Operation des obigen Ausdrucks muss dieser größer als 0 sein. Aber warum 1 hinzufügen? Im Code wird auch erklärt, dass die Konvertierung über parseFloat() das Problem eines Präzisionsverlusts verursacht, sodass das Operationsergebnis nach 1 genauer ist.

Für andere Typen wird NaN nach der Konvertierung durch parseFloat() erhalten, egal welche Operation ausgeführt wird, NaN kann nicht mit 0 verglichen werden und gibt false zurück.

In früheren Versionen von jquery (z. B. 2.0.2):

1

2

3

isNumeric: function( obj ) {

    return !isNaN( parseFloat(obj) ) && isFinite( obj );

}

Nach dem Login kopieren

Wir können feststellen, dass wir nach dem Ausführen des Codes $.isNumeric([123]) true erhalten, es sich jedoch tatsächlich um einen Array-Typ handelt. Glücklicherweise wurde es in nachfolgenden Versionen behoben.

5. $.isEmptyObject()

$.isEmptyObject() wird nicht verwendet, um den Typ einer Variablen zu bestimmen, sondern um festzustellen, ob ein Objekttyp leer ist und keine Attribute enthält.
Ab jQuery 1.4 erkennt diese Methode sowohl Eigenschaften des Objekts selbst als auch vom Prototyp geerbte Eigenschaften (hasOwnProperty wird daher nicht verwendet). Das Argument sollte ein einfaches JavaScript-Objekt sein. Andere Objekttypen (DOM-Elemente, Rohzeichenfolgen/-zahlen, Hostobjekte) liefern möglicherweise keine konsistenten Ergebnisse in allen Browsern.

1

2

3

4

5

6

7

8

9

10

11

12

13

$.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

Nach dem Login kopieren

我们能够看到,不论是对象本身的属性,还是prototype上的属性,只要存在,都会返回false。

1

2

3

4

5

6

7

isEmptyObject: function( obj ) {

    var name;

    for ( name in obj ) {

        return false;

    }

    return true;

}

Nach dem Login kopieren

在jquery中,是通过for~in进行检测的。因为for~in也是能循环到prototype上的属性的,若进入到循环中,则说明obj存在属性,发挥false;否则返回true。
6. 总结

jquery中还提供了很多各种各样的工具方法,让我们在编写js代码时更加的方便。以后有机会时再总结其他的工具方法。

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage