Ausführliche Erläuterung vergleichender Anwendungsbeispiele von typeof und instanceof in JavaScript

typeof

Lassen Sie uns zuerst über typeof sprechen. Als Erstes ist zu beachten, dass die Methode „typeof“ eine Zeichenfolge zurückgibt, die den Datentyp darstellt.

typeof ist eine unäre Operation, die vor einem Operanden platziert wird, und der Operand kann von jedem beliebigen Typ sein.

Es wird eine Zeichenfolge zurückgegeben, die den Typ des Operanden beschreibt. typeof kann im Allgemeinen nur die folgenden Ergebnisse zurückgeben:
Zahl, Boolescher Wert, Zeichenfolge, Funktion, Objekt, undefiniert. Wir können typeof verwenden, um zu ermitteln, ob eine Variable existiert, z. B. if(typeof a!="undefiniert"){alert("ok")}, anstatt if(a) zu verwenden, denn wenn a nicht existiert (nicht deklariert), wird es Wenn ein Fehler auftritt, wird bei Verwendung von typeof für spezielle Objekte wie Array und Null immer ein Objekt zurückgegeben. Dies ist die Einschränkung von typeof.

Grammatikerklärung

Sehen wir uns zunächst den Wert von typeof an, der jedem Datentyp entspricht:

typeof 37 === 'number';
typeof 3.14 === 'number';
typeof Math.LN2 === 'number';
typeof Infinity === 'number';
typeof NaN === 'number'; // 尽管NaN是"Not-A-Number"的缩写,意思是"不是一个数字"
typeof Number(1) === 'number'; // 不要这样使用!
// Strings
typeof "" === 'string';
typeof "bla" === 'string';
typeof (typeof 1) === 'string'; // typeof返回的肯定是一个字符串
typeof String("abc") === 'string'; // 不要这样使用!
// Booleans
typeof true === 'boolean';
typeof false === 'boolean';
typeof Boolean(true) === 'boolean'; // 不要这样使用!
// Symbols
typeof Symbol() === 'symbol';
typeof Symbol('foo') === 'symbol';
typeof Symbol.iterator === 'symbol';
// Undefined
typeof undefined === 'undefined';
typeof blabla === 'undefined'; // 一个未定义的变量,或者一个定义了却未赋初值的变量
// Objects
typeof {a:1} === 'object';
// 使用Array.isArray或者Object.prototype.toString.call方法可以从基本的对象中区分出数组类型
typeof [1, 2, 4] === 'object';
typeof new Date() === 'object';
// 下面的容易令人迷惑，不要这样使用！
typeof new Boolean(true) === 'object';
typeof new Number(1) ==== 'object';
typeof new String("abc") === 'object';
// 函数
typeof function(){} === 'function';
typeof Math.sin === 'function';

Wir werden ein Problem finden, das ist, typeof Die Bestimmung des Datentyps ist tatsächlich nicht genau. Beispielsweise ist der Rückgabewerttyp von Arrays, regulären Ausdrücken, Datumsangaben und Objekten ausschließlich ein Objekt, was zu einigen Fehlern führen kann.

Auf der Grundlage der Typbeurteilung müssen wir also auch die Methode Object.prototype.toString verwenden, um den Datentyp weiter zu beurteilen.

Sehen wir uns den Unterschied zwischen den Rückgabewerten der toString-Methode und der typeof-Methode bei demselben Datentyp an:

可以看到利用toString方法可以正确区分出Array、Error、RegExp、Date等类型。

所以我们一般通过该方法来进行数据类型的验证

instanceof

接下来该说说instanceof方法了。instanceof运算符可以用来判断某个构造函数的prototype属性是否存在于另外一个要检测对象的原型链上。

instanceof 用于判断一个变量是否某个对象的实例，如 var a=new Array();alert(a instanceof Array); 会返回 true，同时 alert(a instanceof Object) 也会返回 true;这是因为 Array 是 object 的子类。再如：function test(){};var a=new test();alert(a instanceof test) 会返回

谈到 instanceof 我们要多插入一个问题，就是 function 的 arguments，我们大家也许都认为 arguments 是一个 Array，但如果使用 instaceof 去测试会发现 arguments 不是一个 Array 对象，尽管看起来很像。

如果对原型不太了解，可以看看深入理解原型。

下面我们看看instanceof的实例：

// 定义构造函数
function C(){} 
function D(){} 
var o = new C();
// true，因为 Object.getPrototypeOf(o) === C.prototype
o instanceof C; 
// false，因为 D.prototype不在o的原型链上
o instanceof D; 
o instanceof Object; // true,因为Object.prototype.isPrototypeOf(o)返回true
C.prototype instanceof Object // true,同上
C.prototype = {};
var o2 = new C();
o2 instanceof C; // true
o instanceof C; // false,C.prototype指向了一个空对象,这个空对象不在o的原型链上.
D.prototype = new C(); // 继承
var o3 = new D();
o3 instanceof D; // true
o3 instanceof C; // true

但是这里我们需要注意一个问题：

function f(){ return f; }
document.write(new f() instanceof f);//false
function g(){}
document.write(new g() instanceof g);//true

第一个为什么返回false呢？因为构造函数的原型被覆盖了。

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung vergleichender Anwendungsbeispiele von typeof und instanceof in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!