Was ist der Unterschied zwischen typeof und instanceof und wann sollte das eine im Gegensatz zum anderen verwendet werden?

Question

In meinem speziellen Fall:

callback instanceof Function

または

typeof callback == "function"

Spielt das überhaupt eine Rolle, was ist der Unterschied?

Zusätzliche Ressource:

JavaScript-Garten typeof gegen instanceof

Answer 1

Wenn man nach einer Funktion sucht, muss man immer typeof .

Hier ist der Unterschied:

var f = Object.create(Function);

console.log(f instanceof Function); //=> true
console.log(typeof f === 'function'); //=> false

f(); // throws TypeError: f is not a function

Aus diesem Grund darf man niemals instanceof um nach einer Funktion zu suchen.

Answer 2

Ich würde empfehlen, den Prototyp zu verwenden callback.isFunction() .

Sie haben den Unterschied erkannt und Sie können sich auf ihre Vernunft verlassen.

Ich vermute, andere JS-Frameworks haben solche Dinge auch.

instanceOf würde bei Funktionen, die in anderen Windows definiert sind, nicht funktionieren, glaube ich. Deren Funktion ist anders als Ihre window.Function .

Answer 3

Es ist nicht nötig, Sie mit unzähligen Beispielen zu überhäufen, Sie sollten sich nur zwei Gesichtspunkte vor Augen halten:

1. typeof var; ist ein unärer Operator, der den ursprünglichen Typ oder den Wurzeltyp von var. zurückgibt, so dass er primitive Typen( string , number , bigint , boolean , undefined und symbol ) oder object Typ.

2. im Falle von Objekten höherer Ebene, wie integrierten Objekten (String, Number, Boolean, Array ) oder komplexen oder benutzerdefinierten Objekten, sind alle diese Objekte object Wurzeltyp, aber der darauf aufbauende Instanztyp ist unterschiedlich (wie das OOP-Klassenvererbungskonzept), hier a instanceof A - ein binärer Operator - wird Ihnen helfen, er wird die Prototypenkette durchlaufen, um zu prüfen, ob der Konstruktor des rechten Operanden (A) erscheint oder nicht.

Wenn Sie also den "Root-Typ" überprüfen oder mit primitiven Variablen arbeiten wollen, verwenden Sie "typeof", ansonsten "instanceof".

null ist ein Sonderfall, der scheinbar primitiv ist, aber in der Tat ein Sonderfall für Objekt ist. Verwendung von a === null um stattdessen null zu prüfen.

auf der anderen Seite, function ist auch ein Sonderfall, der ein eingebautes Objekt ist, aber typeof return function

wie Sie sehen können instanceof muss inzwischen die Prototypenkette durchlaufen typeof Prüfen Sie nur einmal den Typ Root, damit Sie verstehen, warum typeof ist schneller als instanceof

Answer 4

Leistung

typeof ist schneller als instanceof in Situationen, in denen beides zutrifft.

Abhängig von Ihrem Motor ist der Leistungsunterschied zu Gunsten von typeof könnte etwa 20% . ( Ihr Kilometerstand kann variieren )

Hier ist ein Benchmark-Test für Array :

var subject = new Array();
var iterations = 10000000;

var goBenchmark = function(callback, iterations) {
    var start = Date.now();
    for (i=0; i < iterations; i++) { var foo = callback(); }
    var end = Date.now();
    var seconds = parseFloat((end-start)/1000).toFixed(2);
    console.log(callback.name+" took: "+ seconds +" seconds.");
    return seconds;
}

// Testing instanceof
var iot = goBenchmark(function instanceofTest(){
     (subject instanceof Array);
}, iterations);

// Testing typeof
var tot = goBenchmark(function typeofTest(){
     (typeof subject == "object");
}, iterations);

var r = new Array(iot,tot).sort();
console.log("Performance ratio is: "+ parseFloat(r[1]/r[0]).toFixed(3));

Ergebnis

instanceofTest took: 9.98 seconds.
typeofTest took: 8.33 seconds.
Performance ratio is: 1.198

Answer 5

instanceof funktioniert nicht bei Primitiven wie "foo" instanceof String wird zurückgegeben false während typeof "foo" == "string" wird zurückgegeben true .

Andererseits typeof wird wahrscheinlich nicht das tun, was Sie wollen, wenn es um benutzerdefinierte Objekte (oder Klassen, wie auch immer Sie sie nennen wollen) geht. Zum Beispiel:

function Dog() {}
var obj = new Dog;
typeof obj == 'Dog' // false, typeof obj is actually "object"
obj instanceof Dog  // true, what we want in this case

Es ist einfach so, dass Funktionen sowohl 'Funktions'-Primitive als auch Instanzen von 'Funktion' sind, was ein wenig seltsam ist, da es für andere primitive Typen nicht so funktioniert, z. B..

(typeof function(){} == 'function') == (function(){} instanceof Function)

sondern

(typeof 'foo' == 'string') != ('foo' instanceof String)