typeof和instanceof間有哪些區(qū)別

今天小編給大家分享一下typeof和instanceof間有哪些區(qū)別的相關(guān)知識點，內(nèi)容詳細，邏輯清晰，相信大部分人都還太了解這方面的知識，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。

typeof

typeof是一個一元運算符，放在一個運算數(shù)前面，這個運算數(shù)可以是任何類型。它返回一個字符串，說明運算數(shù)的類型。請看栗子：

const type =  typeof '中國萬歲'; // string
typeof 666; // number
typeof true; // boolean
typeof undefined; // undefined
typeof Symbol(); // symbol
typeof 1n; // bigint
typeof () => {}; // function

typeof []; // object
typeof {}; // object
typeof new String('xxx'); // object

typeof null; // object

通過以上例子可以看出，typeof只能準確判斷基本數(shù)據(jù)類型和函數(shù)（函數(shù)其實是對象，并不屬于另一種數(shù)據(jù)類型，但也能夠使用 typeof 進行區(qū)分），無法精確判斷出引用數(shù)據(jù)類型（統(tǒng)統(tǒng)返回 object）。

有一點需要注意，調(diào)用typeof null返回的是object，這是因為特殊值null被認為是一個對空對象的引用（也叫空對象指針）。

如果想準確判斷引用數(shù)據(jù)類型，可以用instanceof運算符。

instanceof

instanceof運算符放在一個運算數(shù)的后面，給定對象的前面。它返回一個布爾值，說明運算數(shù)是否是給定對象的實例：

const result = [] instanceof Array; // true

const Person = function() {};
const p = new Person();
p instanceof Person; // true

const message = new String('xxx');
message instanceof String; // true

區(qū)別

• typeof 會返回一個運算數(shù)的基本類型，instanceof 返回的是布爾值

• instanceof 可以準確判斷引用數(shù)據(jù)類型，但是不能正確判斷基本數(shù)據(jù)類型

• typeof 雖然可以判斷基本數(shù)據(jù)類型（null 除外），但是無法判斷引用數(shù)據(jù)類型（function 除外）

擴展

Object.prototype.toString.call()

typeof和instanceof都有一定的弊端，并不能滿足所有場景的需求。如果需要通用檢測數(shù)據(jù)類型，可以使用Object.prototype.toString.call()方法：

Object.prototype.toString.call({}); // "[object Object]"
Object.prototype.toString.call([]); // "[object Array]"
Object.prototype.toString.call(666); // "[object Number]"
Object.prototype.toString.call('xxx'); // "[object String]"

注意，該方法返回的是一個格式為"[object Object]"的字符串。

封裝函數(shù)

為了更方便的使用，我們可以將這個方法進行封裝：

function getType(value) {
    let type = typeof value;
    if (type !== 'object') { // 如果是基本數(shù)據(jù)類型，直接返回
        return type;
    }
    // 如果是引用數(shù)據(jù)類型，再進一步判斷，正則返回結(jié)果
    return Object.prototype.toString.call(value).replace(/^\[object (\S+)\]$/, '$1');
}

getType(123); // number
getType('xxx'); // string
getType(() => {}); // function
getType([]); // Array
getType({}); // Object
getType(null); // Null

以上就是“typeof和instanceof間有哪些區(qū)別”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會為大家更新不同的知識，如果還想學習更多的知識，請關(guān)注億速云行業(yè)資訊頻道。