データ型の判断における js typeof と instanceof の違いと、その開発と使用について

日常の開発では、変数のデータ型や変数が null かどうかを判別する必要がある状況によく遭遇します。型を判別するための演算子はどのように選択しますか?この記事では、開発者が習得しなければならないtypeofとinstanceofに関する知識のポイントと、開発での使用に関する提案をまとめ、記録します。同時に、面接中にこのような問題に遭遇することがよくあります。

1. typeof演算子

typeof演算子は、変数のデータ型を決定します。具体的には、変数が文字列、数値、ブール値、または未定義であるかどうかを判断するのに最適な方法です。戻り値は文字列型で、使用方法は次のとおりです。typeof typeof関数ではなく演算子ですが、変数をパラメータとして渡すために使用できます。
a、typeof operand b、typeof (operand)

（1）戻り値は文字列型であり、

戻り値	意味価値
"未定義"	未定義
「ブール値」	ブール
"弦"	弦
"番号"	数値
"物体"	オブジェクト（関数ではない）またはnull
"関数"	関数
"シンボル"	シンボル

（２）一般的な使用方法

        console.log(typeof undefined); //'未定義'
        console.log(typeof true);//'bpplean'
        console.log(typeof ("number")); //'文字列'
        console.log(typeof "number"); //'文字列' 
        console.log(typeof 1);//'数値'
        console.log(typeof Symbol());//'シンボル'
        //Array や Null などの特殊なオブジェクトの場合、typeof は常に object を返します。これが typeof の制限です。console.log(typeof null); //'object'
        console.log(typeof [1, 2, 3]);//'オブジェクト'
        console.log(typeof undefined); //'未定義'
        //typeof演算子を使用して関数を他のオブジェクトと区別します function f1() { console.log(111); }
        console.log(typeof f1); //'関数'  
        console.log(typeof f1()); // 111 '未定義'

（３）typeofを使って変数が存在するかどうかを調べることはできない

        var a;
        (a === 未定義)の場合{
            console.log("変数が存在しません")
        } それ以外 {
            console.log("変数が存在します")
        }
     // 変数が存在しません

2. インスタンスオブ演算子

typeofプリミティブ値には便利ですが、参照値にはあまり役立ちません。通常、値がオブジェクトであるかどうかではなく、それがどのようなタイプのオブジェクトであるかが重要になります。この問題を解決するために、 ECMAScript instanceof演算子を提供します。次のように使用します。

        関数 f1() { console.log(111);
        console.log(f1 インスタンスオブオブジェクト);//true
        console.log(f1 関数のインスタンス);//true
        console.log(f1 instanceof RegExp); //false

すべての参照値はObjectのインスタンスであるため、 instanceof演算子とObjectコンストラクターを使用して参照値をテストするとtrueが返されます。

同様に、プリミティブ値に対してinstanceofを使用すると、プリミティブ値はオブジェクトではないため、常にfalseが返されます。

instanceof演算子は、コンストラクター関数のprototypeプロパティがオブジェクトのプロトタイプチェーンのどこかに出現するかどうかを判断するために使用されます。実装原則は次のとおりです。

  関数 myInstanceof(left, right) {
    let proto = Object.getPrototypeOf(left), // オブジェクトのプロトタイプを取得します prototype = right.prototype; // コンストラクター関数のプロトタイプオブジェクトを取得します // コンストラクター関数のプロトタイプオブジェクトがオブジェクトのプロトタイプチェーン上にあるかどうかを判断します while (true) {
      if (!proto) が false を返す;
      if (proto === prototype) が true を返す。
      proto = Object.getPrototypeOf(proto);
    }
 }

3. typeof と instanceof の違いと開発での使用に関する提案

typeofとinstanceどちらもデータ型を決定するメソッドです。違いは次のとおりです。

typeof変数の基本型を返し、 instanceofブール値を返します。
instanceof複雑な参照データ型を正確に判別できますが、基本データ型を正しく判別することはできません。
typeofにも欠点があります。基本データ型 ( nullを除く) は判別できますが、 function型以外の参照データ型は判別できません。

上記の 2 つの方法には欠点があり、すべてのシナリオのニーズを満たすことができないことがわかります。

一般的にデータ型を検出する必要がある場合は、 Object.prototype.toStringを使用し、このメソッドを呼び出して“[object Xxx]”の形式で文字列を一様に返すことをお勧めします。次のように使用します。

        console.log(Object.prototype.toString.call(undefined)) //"[オブジェクトは未定義です]"
        console.log(Object.prototype.toString.call(true)) // "[オブジェクト ブール値]"
        console.log(Object.prototype.toString.call('1')) // "[オブジェクト 文字列]"
        console.log(Object.prototype.toString.call(1)) // "[オブジェクト番号]"
        console.log(Object.prototype.toString.call(Symbol())) // "[オブジェクト シンボル]"
        console.log(Object.prototype.toString.call({})) // "[オブジェクト Object]"
        console.log(Object.prototype.toString.call(function () { })) // "[オブジェクト Function]"
        console.log(Object.prototype.toString.call([])) //"[オブジェクト配列]"
        console.log(Object.prototype.toString.call(null)) //"[オブジェクト Null]"
        console.log(Object.prototype.toString.call(/123/g)) //"[オブジェクト正規表現]"
        console.log(Object.prototype.toString.call(new Date())) //"[オブジェクト Date]"

要約:

データ型の判断におけるjs typeofとinstanceofの違いと、その開発と使用に関するこの記事はこれで終わりです。より関連性の高いjs typeofとinstanceofコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: