Maison > interface Web > js tutoriel > le corps du texte

Introduction à la différence entre typeof et instanceof en JavaScript (exemple de code)

不言
Libérer: 2019-02-25 10:25:19
avant
2789 Les gens l'ont consulté

Cet article vous présente la différence entre typeof et instanceof en JavaScript (exemples de code). Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

Typeof et instanceof en JavaScript sont souvent utilisés pour déterminer si une variable est vide ou de quel type il s'agit. Mais il existe encore des différences entre eux :

typeof

typeof est une opération unaire, placée avant un opérande, et l'opérande peut être de n'importe quel type.

Il renvoie une chaîne décrivant le type de l'opérande. (L'opérateur typeof renvoie une chaîne utilisée pour représenter le type de données de l'expression.)

typeof est en fait une instance permettant de déterminer le type du paramètre. Un seul paramètre

typeof ne peut généralement être utilisé que. return Les résultats suivants : "numéro", "chaîne", "booléen", "objet", "fonction" et "undéfini".

L'opérande est un nombre typeof(x) = "number"

String typeof(x) = "string"

Valeur booléenne typeof(x) = "boolean"

Object, array et null typeof(x) = "object"

Function typeof(x) = "function"

console.log(typeof (123));//typeof(123)返回"number" 
console.log(typeof ("123"));//typeof("123")返回"string"
var param1 = "string";
var param2 = new Object();
var param3 = 10;
console.log(typeof(param1)+"\n"+typeof(param2)+"\n"+typeof(param3)); 
     // string object  number
Copier après la connexion

Nous pouvons utiliser typeof pour obtenir un Si la variable existe, comme if(typeof a!="undefined"){alert("ok")}, n'utilisez pas if(a) car si a n'existe pas (non déclaré), une erreur se produira, pour Array , Null, etc. Les objets spéciaux utilisant typeof renvoient toujours un objet C'est la limitation de typeof.

Les tableaux sont souvent utilisés dans js, comme plusieurs entrées portant le même nom, s'ils sont générés dynamiquement, vous devez déterminer s'il s'agit de tableaux lors de la soumission.

    if(document.mylist.length != "undefined" ) {} //这个用法有误.
    正确的是 `if( typeof(document.mylist.length) != "undefined" ) {}` 

     或 `if( !isNaN(document.mylist.length) ) {}`
Copier après la connexion

Fonctionnement de. typeof Le nombre n'est pas défini et la valeur renvoyée est "indéfinie".

En JavaScript, vous essaierez d'utiliser l'opérateur typeof pour déterminer le type d'une variable. Lors de l'utilisation de l'opérateur typeof, un problème surviendra. lors de l'utilisation de types de référence pour stocker des valeurs. Il renvoie "objet" quel que soit le type d'objet référencé. Cela nécessite instanceof pour détecter si un objet est une instance d'un autre objet.

instanceof

L'opérateur instanceof est utilisé pour tester si un objet a l'attribut prototype d'un constructeur dans sa chaîne de prototypes.

Syntaxe : objet instanceof constructor
Paramètres : objet (objet à détecter.) constructeur (un constructeur)
Description : l'opérateur instanceof est utilisé pour détecter si constructor.prototype existe dans l'objet paramètre sur la chaîne prototype.

instance : instance, exemple

une instance de b?alert("true"):alert("false"); //a est une instance de b? Vrai : Faux

instanceof est utilisé pour déterminer si une variable est une instance d'un objet,

如 :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) 会返回true

alert(a==b);  //flase
Copier après la connexion

Cas :

另外,更重的一点是 `instanceof` 可以在继承关系中用来判断一个实例是否属于它的父类型。

例如:

function Foo(){} 
Foo.prototype = new Aoo();//JavaScript 原型继承 
var foo = new Foo(); 
console.log(foo instanceof Foo)//true 
console.log(foo instanceof Aoo)//true

上面的代码中是判断了一层继承关系中的父类,在多层继承关系中,instanceof 运算符同样适用。


又如:

console.log(Object instanceof Object);//true 
console.log(Function instanceof Function);//true 
console.log(Number instanceof Number);//false 
console.log(String instanceof String);//false  
console.log(Function instanceof Object);//true  
console.log(Foo instanceof Function);//true 
console.log(Foo instanceof Foo);//false
Copier après la connexion
// 定义构造函数
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
Copier après la connexion

Quand il s'agit à instanceof, nous voulons insérer une question supplémentaire, qui concerne les arguments de la fonction. Nous pouvons tous penser que les arguments sont un tableau, mais si vous utilisez instanceof pour tester, vous constaterez que les arguments ne sont pas un objet Array, même s'il semble similaire. .

Aussi :

Test var a=new Array();if (une instance d'objet) alert('Y');else alert('N');

Vous avez 'Y'

mais if (window instanceof Object) alert('Y');else alert('N');

a obtenu 'N'

Donc, L'objet testé par instanceof fait ici référence à l'objet dans la syntaxe js, et non à l'objet modèle dom.

Il y aura quelques différences lors de l'utilisation de typeof

alert(typeof(window)) obtiendra un objet

Il convient de noter que si l'expression obj instanceof Foo renvoie true, ce n'est pas le cas. Cela signifie que l'expression retournera toujours vrai, car la valeur de l'attribut Foo.prototype peut changer et la valeur modifiée peut ne pas exister sur la chaîne prototype d'obj. Dans ce cas, la valeur de l'expression originale sera. devenir faux. Dans un autre cas, la valeur de l'expression originale changera également, c'est-à-dire que la chaîne de prototypes de l'objet obj sera modifiée. Bien que dans la spécification ES actuelle, nous ne puissions lire que le prototype de l'objet mais ne pouvons pas le modifier, mais avec. l'aide de propriétés magiques __proto__ non standard est réalisable. Par exemple, après avoir exécuté obj.__proto__ = {}, obj instanceof Foo renverra false.

Exemple : Montrez que les objets String et Date appartiennent tous deux au type Object.
Le code suivant utilise instanceof pour prouver que les objets String et Date appartiennent également au type Object.

例子: 表明String对象和Date对象都属于Object类型

下面的代码使用了instanceof来证明:String和Date对象同时也属于Object类型。
var simpleStr = "This is a simple string"; 
var myString  = new String();
var newStr    = new String("String created with constructor");
var myDate    = new Date();
var myObj     = {};

simpleStr instanceof String; // returns false, 检查原型链会找到 undefined
myString  instanceof String; // returns true
newStr    instanceof String; // returns true
myString  instanceof Object; // returns true

myObj instanceof Object;    // returns true, despite an undefined prototype
({})  instanceof Object;    // returns true, 同上

myString instanceof Date;   // returns false

myDate instanceof Date;     // returns true
myDate instanceof Object;   // returns true
myDate instanceof String;   // returns false
Copier après la connexion

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!

Étiquettes associées:
source:segmentfault.com
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal