在 JavaScript 中,我們經(jīng)常需要判斷一個變量的類型。這個需求在編程中非常常見,因?yàn)椴煌愋偷臄?shù)據(jù)會影響到我們的代碼邏輯。

JavaScript 提供了幾種方法來檢測數(shù)據(jù)類型,每種方法都有自己的優(yōu)缺點(diǎn)。

Object.prototype.toString.call()

這是最萬能的方法。它可以準(zhǔn)確識別所有的 JavaScript 內(nèi)置類型,包括基本類型和復(fù)雜類型。不管你給它傳什么數(shù)據(jù),它都能給出一個統(tǒng)一格式的字符串,告訴你這個數(shù)據(jù)到底是什么類型。

它的原理是調(diào)用對象內(nèi)部的 [[Class]] 屬性。這個屬性是只讀的,不能被改寫,所以非?？煽?。

優(yōu)點(diǎn):

• 識別范圍廣,基本類型和復(fù)雜類型都能識別

• 不會受到對象自身的 toString() 方法的影響

• 返回結(jié)果格式統(tǒng)一,方便解析

缺點(diǎn):

• 寫起來比較啰嗦

• 如果是自定義類型,只能得到 [object Object],不能進(jìn)一步區(qū)分類型

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


console.log(detectType(123)); // 'number'
console.log(detectType('abc')); // 'string'
console.log(detectType(true)); // 'boolean'
console.log(detectType(null)); // 'null'
console.log(detectType(undefined)); // 'undefined'
console.log(detectType([])); // 'array'
console.log(detectType({})); // 'object'
console.log(detectType(function () {})); // 'function'
console.log(detectType(new Date())); // 'date'
console.log(detectType(new RegExp())); // 'regexp'
console.log(detectType(new Error())); // 'error'

typeof

這個運(yùn)算符最常用,寫起來簡單。它可以識別基本類型和函數(shù),但對復(fù)雜類型的識別能力有限。

優(yōu)點(diǎn):

• 使用簡單

• 可以識別基本類型和函數(shù)

缺點(diǎn):

• 無法區(qū)分?jǐn)?shù)組和普通對象

• typeof null 的結(jié)果是 'object'

• 無法識別內(nèi)置對象類型,如 Date、RegExp 等

console.log(typeof 123); // 'number'
console.log(typeof 'abc'); // 'string'
console.log(typeof true); // 'boolean'
console.log(typeof undefined); // 'undefined'
console.log(typeof null); // 'object' (這是一個歷史遺留的 bug)
console.log(typeof []); // 'object'
console.log(typeof {}); // 'object'
console.log(typeof function () {}); // 'function'

instanceof

instanceof 運(yùn)算符用于測試構(gòu)造函數(shù)的 prototype 屬性是否出現(xiàn)在對象的原型鏈中的任何位置。

優(yōu)點(diǎn):

• 可以檢查對象是否屬于特定的類或構(gòu)造函數(shù)

缺點(diǎn):

• 只能檢查對象類型,不能檢查基本類型

• 要識別多種類型,需要多次調(diào)用

console.log([] instanceof Array); // true
console.log({} instanceof Object); // true
console.log(function () {} instanceof Function); // true
console.log(new Date() instanceof Date); // true
console.log(new RegExp() instanceof RegExp); // true
console.log(new Error() instanceof Error); // true


console.log(123 instanceof Number); // false
console.log('abc' instanceof String); // false
console.log(true instanceof Boolean); // false

constructor

constructor 是對象的一個屬性,指向創(chuàng)建該對象的構(gòu)造函數(shù)?？梢杂盟鼇砼袛鄬ο蟮念愋汀?/p>

優(yōu)點(diǎn):

• 可以識別大多數(shù)對象類型,包括自定義類型

缺點(diǎn):

• 如果對象的 constructor 屬性被修改,會得到錯誤結(jié)果

• null 和 undefined 沒有 constructor 屬性

console.log((123).constructor === Number); // true
console.log('abc'.constructor === String); // true
console.log(true.constructor === Boolean); // true
console.log([].constructor === Array); // true
console.log({}.constructor === Object); // true
console.log(function () {}.constructor === Function); // true
console.log(new Date().constructor === Date); // true
console.log(new RegExp().constructor === RegExp); // true
console.log(new Error().constructor === Error); // true

總結(jié)

如果需要全面準(zhǔn)確的類型識別,Object.prototype.toString.call() 是最佳選擇。
如果只需要簡單區(qū)分基本類型,typeof 就足夠了。
如果要檢查對象是否屬于特定類型,可以用 instanceof。

轉(zhuǎn)自https://www.cnblogs.com/leadingcode/p/18362986