Maison interface Web js tutoriel Introduction à la différence entre typeof et instanceof en JavaScript (exemple de code)

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

Feb 25, 2019 am 10:25 AM
javascript 原理

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!

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

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

Video Face Swap

Video Face Swap

Échangez les visages dans n'importe quelle vidéo sans effort grâce à notre outil d'échange de visage AI entièrement gratuit !

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Analyse de la fonction et du principe de nohup Analyse de la fonction et du principe de nohup Mar 25, 2024 pm 03:24 PM

Analyse du rôle et du principe de nohup Dans les systèmes d'exploitation Unix et de type Unix, nohup est une commande couramment utilisée pour exécuter des commandes en arrière-plan. Même si l'utilisateur quitte la session en cours ou ferme la fenêtre du terminal, la commande peut. continuent toujours à être exécutés. Dans cet article, nous analyserons en détail la fonction et le principe de la commande nohup. 1. Le rôle de nohup : Exécuter des commandes en arrière-plan : Grâce à la commande nohup, nous pouvons laisser les commandes de longue durée continuer à s'exécuter en arrière-plan sans être affectées par la sortie de l'utilisateur de la session du terminal. Cela doit être exécuté

Discussion approfondie sur les principes et les pratiques du cadre Struts Discussion approfondie sur les principes et les pratiques du cadre Struts Feb 18, 2024 pm 06:10 PM

Analyse des principes et exploration pratique du framework Struts. En tant que framework MVC couramment utilisé dans le développement JavaWeb, le framework Struts a de bons modèles de conception et une bonne évolutivité et est largement utilisé dans le développement d'applications au niveau de l'entreprise. Cet article analysera les principes du framework Struts et l'explorera avec des exemples de code réels pour aider les lecteurs à mieux comprendre et appliquer le framework. 1. Analyse des principes du framework Struts 1. Architecture MVC Le framework Struts est basé sur MVC (Model-View-Con

Compréhension approfondie du principe d'implémentation de l'insertion par lots dans MyBatis Compréhension approfondie du principe d'implémentation de l'insertion par lots dans MyBatis Feb 21, 2024 pm 04:42 PM

MyBatis est un framework de couche de persistance Java populaire qui est largement utilisé dans divers projets Java. Parmi elles, l'insertion par lots est une opération courante qui peut améliorer efficacement les performances des opérations de base de données. Cet article explorera en profondeur le principe de mise en œuvre de l'insertion par lots dans MyBatis et l'analysera en détail avec des exemples de code spécifiques. Insertion par lots dans MyBatis Dans MyBatis, les opérations d'insertion par lots sont généralement implémentées à l'aide de SQL dynamique. En construisant un S contenant plusieurs valeurs insérées

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript : Comment obtenir le code d'état HTTP, des exemples de code spécifiques sont requis Préface : Dans le développement Web, l'interaction des données avec le serveur est souvent impliquée. Lors de la communication avec le serveur, nous devons souvent obtenir le code d'état HTTP renvoyé pour déterminer si l'opération a réussi et effectuer le traitement correspondant en fonction de différents codes d'état. Cet article vous apprendra comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournira quelques exemples de codes pratiques. Utilisation de XMLHttpRequest

Une discussion approfondie sur les fonctions et les principes des outils Linux RPM Une discussion approfondie sur les fonctions et les principes des outils Linux RPM Feb 23, 2024 pm 03:00 PM

L'outil RPM (RedHatPackageManager) dans les systèmes Linux est un outil puissant pour installer, mettre à niveau, désinstaller et gérer les packages logiciels système. Il s'agit d'un outil de gestion de progiciels couramment utilisé dans les systèmes RedHatLinux et est également utilisé par de nombreuses autres distributions Linux. Le rôle de l'outil RPM est très important. Il permet aux administrateurs système et aux utilisateurs de gérer facilement les progiciels sur le système. Grâce à RPM, les utilisateurs peuvent facilement installer de nouveaux progiciels et mettre à niveau les logiciels existants.

Explication détaillée du principe du plug-in de pagination MyBatis Explication détaillée du principe du plug-in de pagination MyBatis Feb 22, 2024 pm 03:42 PM

MyBatis est un excellent framework de couche de persistance. Il prend en charge les opérations de base de données basées sur XML et les annotations. Il est simple et facile à utiliser. Il fournit également un mécanisme de plug-in riche. Parmi eux, le plug-in de pagination est l'un des plug-ins les plus fréquemment utilisés. Cet article approfondira les principes du plug-in de pagination MyBatis et l'illustrera avec des exemples de code spécifiques. 1. Principe du plug-in de pagination MyBatis lui-même ne fournit pas de fonction de pagination native, mais vous pouvez utiliser des plug-ins pour implémenter des requêtes de pagination. Le principe du plug-in de pagination est principalement d'intercepter MyBatis

Une analyse approfondie des fonctions et des principes de fonctionnement de la commande Linux chage Une analyse approfondie des fonctions et des principes de fonctionnement de la commande Linux chage Feb 24, 2024 pm 03:48 PM

La commande chage dans le système Linux est une commande utilisée pour modifier la date d'expiration du mot de passe d'un compte utilisateur. Elle peut également être utilisée pour modifier la date d'utilisation la plus longue et la plus courte du compte. Cette commande joue un rôle très important dans la gestion de la sécurité des comptes utilisateur. Elle peut contrôler efficacement la période d'utilisation des mots de passe utilisateur et améliorer la sécurité du système. Comment utiliser la commande chage : La syntaxe de base de la commande chage est : chage [option] nom d'utilisateur Par exemple, pour modifier la date d'expiration du mot de passe de l'utilisateur "testuser", vous pouvez utiliser la commande suivante.

Les principes de base et les méthodes de mise en œuvre des méthodes d'héritage dans Golang Les principes de base et les méthodes de mise en œuvre des méthodes d'héritage dans Golang Jan 20, 2024 am 09:11 AM

Les principes de base et les méthodes d'implémentation des méthodes d'héritage Golang Dans Golang, l'héritage est l'une des caractéristiques importantes de la programmation orientée objet. Grâce à l'héritage, nous pouvons utiliser les propriétés et les méthodes de la classe parent pour obtenir la réutilisation et l'extensibilité du code. Cet article présentera les principes de base et les méthodes d'implémentation des méthodes d'héritage Golang, et fournira des exemples de code spécifiques. Le principe de base des méthodes d'héritage Dans Golang, l'héritage est implémenté en intégrant des structures. Lorsqu'une structure est incorporée dans une autre structure, la structure incorporée a été incorporée

See all articles