ホームページ  >  記事  >  ウェブフロントエンド  >  JS でのデータ型検出の 4 つの方法の簡単な紹介

JS でのデータ型検出の 4 つの方法の簡単な紹介

php是最好的语言
php是最好的语言オリジナル
2018-08-06 17:09:061482ブラウズ

JSでは1つのvarであらゆる型の変数を定義できるのでとても便利ですが、関数の戻り値が何型なのか、入力情報が何型なのかを知りたい場合には面倒な事もあります。このとき、データを検出する必要がありますが、データの種類をどのように検出するのでしょうか。

データ型検出メソッド:

  • typeof: データ型を検出するために使用される演算子

  • instanceof: インスタンスが特定のクラスに属しているかどうかを検出するために使用されます

  • constructor: コンストラクター関数とinstanceofは非常に似ています

  • Object.prototype.toString.call(); 最も正確で一般的に使用されるメソッド

typeof
typeof: データ型を検出するために使用される演算子、使用方法は typeof + 検出されたコンテンツです。

typeof を使用してデータ型を検出します。まず、文字列が返され、その文字列には対応するデータ型が含まれます。 1. typeof null の結果は「object」です

2. オブジェクト内の左右の値のデータ型を検出するために typeof が使用されるため、オブジェクト内の値が配列であるか、正規表現であるか、その他の値であるかを具体的に分解することはできません。データ型、最終的に返される結果は「object」です


instanceof
instanceof:インスタンスが特定のクラスに属しているかどうかを検出するために使用されます。使用方法:instanceinstanceofクラス名

インスタンスオブの制限事項
1. リテラルの処理には使用できません 作成された基本型の値: 基本的なデータ型の場合、リテラルによって作成された結果とインスタンスによって作成された結果の間には一定の違いがあります。インスタンスによって作成される値は、標準のオブジェクト データ型の値であり、標準の Number クラスのインスタンスです。リテラル メソッドによって作成される結果は、厳密なインスタンスではなく、基本的なデータ型の値です。 , Number.prototype が使用可能

var num  = 2;
console.log(typeof num); // ->控制台输出字符串numberconsole.log(typeof typeof typeof typeof function () {}); 
 // 输出的结果为字符串String,因为第一次使用typeof检测后结果为一个字符串数据类型的数据,以后每次检测都是String

    instanceof
    instanceof:用来检测某个实例是不是属于某个类;使用方法:  实例  instanceof 类名

    instanceof的局限性
    1. 不能用来处理字面量创建出来的基本类型值:对于基本的数据类型来说,字面量方式创建出来的结果和实例方式创建出来的结果是有一定的区别的,从严格的意义上来讲,只有实例创建出来的结果才是标准对象数据类型的值,也是标准的Number这一个类的实例;对于字面量方式创建的结果是基本的数据类型值,不是严谨的实例,但是由于JS的松散性,导致可以使用Number.prototype上提供的方法

     console.log(1 instanceof Number);//->控制台输出false
     console.log(new Number(1) instanceof Number);//-> 控制台输出true
    1. instanceof只要在当前实例的原型链上,我们检测出来的结果都为true

    2. 在类的原型链继承当中,我们最后检测出来的结果未必正确

     function Fn() {
     }  
     var  ary = new Array;
     Fn.prototype = ary;//原型继承:让子类的原型等于父类的一个实例
     var  f =new Fn; // f->Fn.prototype->Array.prototype->Object.prototype
     console.log(f instanceof Array); //-> true

    constructor:构造函数
    constructor:构造函数  这种方法与instanceof非常相似

    var obj = [];
    console.log(obj.constructor === Array ); //->trueconsole.log(obj.constructor === RegExp); //->false//console还可以出来基本的数据类型var num = 1;
    console.log(num.constructor === Number);//->true// constructor检测和instanceof一同,一般情况下是检测不了的var  reg = /^$/;
    console.log(reg.constructor === RegExp);//-> trueconsole.log(reg.constructor === RegExp);//-> false

    局限性:我们可以把类的原型进行重写,在重写的过程中很有可能出现把之前的constructor覆盖了,这样检测出来的结果就是不准确的;对于特殊的数据类型null和undefined,它们的所属类是Null和Undefined,但是浏览器吧这两个类保护起来了,不允许我们进行访问使用

    function Fn() {}  
    Fn.prototype = new Array;var  f =new Fn;
    console.log(f.constructor);//-> Array

    Object.prototype.toString.call()
    这种方法是我们真是项目中最长用的也是现在最准确的一种方式
    首先获取Object原型上的toString方法,让方法执行,并且改变方法中的this关键字的指向
    在了解这种方式之前我们先了解下toString这个方法
    toString:从字面上来看是转化成字符串,但是某些toString方法不仅仅是转化成字符串;对于Number、String、Boolean、Array、RegExp、Date、Function原型上的toString方法都是①把当前的数据类型转化为字符串的类型(它们的作用仅仅只是用来转成字符串);但是在Object原型上的toString方法不同于这些,②它的作用是返回当前方法的执行主体(方法中的this)所属的类的详细信息。
    第一中类型转成字符串

            //Number.prototype.toString方法是转化为字符串  
            console.log((1).toString()); //->这里的toString是Number.prototype.toString用法是转成字符串-> '1'
            console.log((1).__proto__.__proto__.toString());//[object Object]
            console.log((128).toString(2/8/10));//把数字转化为二进制、八进制、十进制

    Object原型上的

    instanceof で提供されるメソッドが現在のインスタンスのプロトタイプチェーン上にある限り、検出した結果は true になります


    クラスのプロトタイプチェーン継承では、最終的に検出した結果は正しくない可能性があります

 ({name:'编程'}).toString();
 console.log(obj.toString());//-> toString中的this是Obj,返回的是obj所属类的信息->[Object Object]第一个Object代表当前实例是对象数据类型的(这个是固定死的),第二个Object代表的是obj所属的类是ObjectMath.toString();//->toString中的this是Math,返回的是Math所属类的信息 ->  [Object Math]console.log(Object.prototype.toString.call([]));                //->[object Array]console.log(Object.prototype.toString.call(/^$/));               //->[object Array]console.log(({}).toString.call(new  Date));                      //->[object Date]console.log(Object.prototype.toString.call(1));                  //->[object Number]console.log(Object.prototype.toString.call('编程'));             //->[object String]console.log(Object.prototype.toString.call(null));               //->[object Null]console.log(Object.prototype.toString.call(undefined));          //->[object Undefined]console.log(Object.prototype.toString.call(function () {}));     //->[object Function]
constructor:constructorconstructor:constructor このメソッドはinstanceof

と非常によく似ていますrrreee制限: クラスのプロトタイプを書き換えるプロセス中に、前のコンストラクターが上書きされる可能性が非常に高いため、特殊なデータ型については検出された結果が不正確になります。 null と未定義、それらが属するクラスは Null と Unknown ですが、ブラウザーはこれら 2 つのクラスを保護しており、アクセスを許可しませんrrreee

🎜Object.prototype.toString.call() 🎜このメソッドは、プロジェクトで最も一般的に使用されており、現在最も正確です。 まず、オブジェクト プロトタイプの toString メソッドを取得し、メソッドを実行して、メソッド内の this キーワードのポインティングを変更します。このメソッドを理解するには、まず toString メソッドについて学びます🎜toString: 文字通り文字列に変換されますが、一部の toString メソッドは文字列に変換されるだけではありません。文字列に変換されます。Number、String、Boolean、Array、RegExp、Date、および Function プロトタイプの場合、toString メソッドは、①現在のデータ型を文字列型に変換します (これらの関数は文字列に変換するためにのみ使用されます)。 ObjectプロトタイプのtoStringメソッドはこれらとは異なります。 ② 現在のメソッドの実行本体(メソッド内のthis)が属するクラスの詳細情報を返す機能です。 🎜最初の型は文字列に変換されます🎜rrreee🎜オブジェクトのプロトタイプ上🎜rrreee🎜 比較すると、4番目の方法の精度が最も高いため、私たちのプロジェクトでよく使われます。分かりましたか!!!🎜🎜関連する推奨事項:🎜🎜🎜🎜JavaScript でデータ型を検出するいくつかの方法の詳細な説明概要🎜🎜🎜🎜js データ型を判別するいくつかの方法🎜🎜

以上がJS でのデータ型検出の 4 つの方法の簡単な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。