Résumé des méthodes de détection de types de données en JavaScript

Cet article décrit la méthode de détection du type de données en JavaScript Si vous ne connaissez pas la méthode de détection du type de données en JavaScript ou si vous n'êtes pas familier avec la méthode de. détection du type de données en JavaScript, Si la méthode vous intéresse, regardons ensemble cet article. Bon, sans plus tarder, entrons dans le vif du sujet !

Avant cela, parlons des types de js. js a 5 types de base et un type complexe
5 types de base : indéfini, nul, nombre, chaîne, bolléen
Un type complexe : object

1.typeof

Type de valeur de retour : string

est détecté comme suit :

                      /*5大基本类型*/

var a = 123;
console.log(typeof a == "number");      //true

var a = '123';
console.log(typeof a == "string");      //true

var a = true;
console.log(typeof a == "boolean");     //true

var a = undefined;
console.log(typeof a == "undefined");   //true

var a = null;
console.log(a == null);                 //true

            /*复杂类型*/

var a = function(){};
console.log(typeof a == "function");    //true

Pour les autres objets de type référence, typeof ne peut pas détecter et distinguer, et renverra un objet, tel que le type de date, le type expression régulière , etc., nous ne pouvons donc pas distinguer ce qui est détecté . (Utilisez d'autres méthodes ci-dessous pour détecter)

typeof encapsulation de fonction de méthode

function typeOf(obj){
    return (obj === 'null') ? 'null' : (typeof obj)
}

À la fin, ajoutez un NaN spécial

console.log(typeof NaN === "number");       //true

2.instanceof

L'opérateur instanceof peut être utilisé pour détecter si un objet est une instance d'un autre objet

Syntaxe : object1 instanceof object2
Paramètres : object1-un objet, constructeur-un autre objet

Type de valeur de retour : valeur booléenne Booléenne

Comment comprendre les mots abstraits ci-dessus ?

En d'autres termes, l'objet prototype de l'objet constructeur est accessible via la chaîne prototype de l'objet instance. C'est ainsi que fonctionne instanceof. Cela montre également que instanceof ne se soucie pas. l'objet. La structure elle-même ne se soucie que de la relation entre les objets et les constructeurs.

var a = new Date();
console.log(a instanceof Date);         //true
console.log(a instanceof Object);       //true

var a = new RegExp('123');
console.log(a instanceof RegExp);       //true
console.log(a instanceof Object);       //true

var a = function(){};
console.log(a instanceof Function);     //true
console.log(a instanceof Object);       //true

var a = [];
console.log(a instanceof Array);        //true
console.log(a instanceof Object);       //true

var a = {};
console.log(a instanceof Object);       //true

Ici, j'ai répertorié les exemples les plus couramment utilisés. Si vous êtes vraiment préoccupé par instanceof, cliquez ici Document MDN

Attribut 3.constructor

La propriété constructeur renvoie. une référence au constructeur qui a créé cet objet.

Type de valeur de retour : Objet

Le point à noter ici est que nous créons habituellement, tels que : var a = 1, var b = '123'.. ., En fait, ils se réfèrent à leurs constructeurs correspondants pour créer leurs types correspondants, plutôt que de les créer directement comme nous le voyons en surface.

Les méthodes de test pour chaque type sont les suivantes :

         /*5大基本类型*/

var a = 123;
console.log(a.constructor == Number);   //true

var a = '123';
console.log(a.constructor == String);   //true

var a = true;
console.log(a.constructor == Boolean);  //true

var a = undefined;
console.log(a && a.constructor);        //undefined

var a = null;
console.log(a && a.constructor);        //null

            /*复杂类型*/

var a = function(){};
console.log(a.constructor == Function); //true

var a = new Date();
console.log(a.constructor == Date);     //true

var a = new Object();
console.log(a.constructor == Object);   //true
var a = {};
console.log(a.constructor == Object);   //true

var a = new Array();
console.log(a.constructor == Array);    //true
var a = [];
console.log(a.constructor == Array);    //true

var a = new RegExp('abc');
console.log(a.constructor == RegExp);   //true
var a = /^abc$/;
console.log(a.constructor == RegExp);   //true

4. Méthode toString()

Cette méthode est le moyen le plus sûr et le plus précis de détecter l'objet. taper.

Type de valeur de retour : Chaîne

/*toString 检测类型函数*/
function toStringType(obj){
    return Object.prototype.toString.call(obj).slice(8, -1);
}
            /*5大基本类型*/

var a = 123;
console.log(toStringType(a));       //"Number"

var a = '123';
console.log(toStringType(a));       //"String"

var a = true;
console.log(toStringType(a));       //"Boolean"

var a = undefined;
console.log(toStringType(a));       //"Undefined"

var a = null;
console.log(toStringType(a));       //"Null"

            /*复杂类型*/

var a = function(){};
console.log(toStringType(a));       //"Function"

var a = new Date();
console.log(toStringType(a));       //"Date"

var a = new Object();
console.log(toStringType(a));       //"Object"
var a = {};
console.log(toStringType(a));       //"Object"

var a = new Array();
console.log(toStringType(a));       //"Array"
var a = [];
console.log(toStringType(a));       //"Array"

var a = new RegExp('abc');
console.log(toStringType(a));       //"RegExp"
var a = /^abc$/;
console.log(toStringType(a));       //"RegExp"

Si vous pensez que la casse de la chaîne renvoyée est gênante, vous pouvez tout convertir en minuscules

Le code est le suivant :

function toStringType(obj){
    return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
}

À ce stade, vous pouvez avoir des doutes.

var a = 123;
console.log(a.toString()); //"123"

1. Pourquoi "123" est-il renvoyé lorsqu'il est écrit ainsi ?
Réponse : Parce que chaque objet dans js a sa propre méthode toString prédéfinie, ce qui est similaire à la réécriture de toString

2 Pourquoi la méthode d'appel est-elle utilisée dans l'article ? Quelle est la fonction ?
Réponse : La fonction de call est de changer la portée en la portée actuelle. En prenant l'article comme exemple, il change l'environnement d'exécution de la portée de l'objet en

3. tranche?

var a = 123;
console.log(Object.prototype.toString.call(a));  //"[Object Number]"

A travers cet exemple, vous comprendrez la comparaison, c'est pour l'intuitivité des résultats.

Ce qui précède représente tout le contenu de cet article. Si vous n’y connaissez pas grand-chose, vous pouvez facilement maîtriser les deux côtés par vous-même !

Recommandations associées :

Explication détaillée des exemples de détection de type de données PHP

Résumé JavaScript des méthodes de détection des types de données

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!