Javascript 類(lèi)型檢查

LdhAndroid 發(fā)布于2019-08-21 10:53 / 676人閱讀

摘要：在中常見(jiàn)的類(lèi)型檢查手段主要有和。與方法不同的是，方法要求開(kāi)發(fā)者明確地確認(rèn)對(duì)象為某特定類(lèi)型。操作符用于檢測(cè)某個(gè)對(duì)象的原型鏈?zhǔn)欠癜硞€(gè)構(gòu)造函數(shù)的屬性。例如在上面的例子中，原型中的屬性被修改指向到了，導(dǎo)致檢測(cè)不出實(shí)例對(duì)象真實(shí)的構(gòu)造函數(shù)。

在 Javascript 中常見(jiàn)的類(lèi)型檢查手段主要有：typeof,instanceof,constructor和Object.prototype.toString。

typeof 運(yùn)算符

typeof操作符返回的是類(lèi)型字符串.

typeof 12   // "number"
typeof "hello" // "string"
typeof true   // "boolean"
typeof function(){}   // "function"
typeof undefined   // "undefined"
typeof [1,2] // "object"
typeof {}   // "object"
typeof NaN // "number"
typeof null // "object"

從上面的輸出結(jié)果可以得出結(jié)論：typeof只能用來(lái)檢測(cè)基本數(shù)據(jù)類(lèi)型。在實(shí)際的生產(chǎn)環(huán)境中，typeof常常用來(lái)判斷變量是否為undefined。

instanceof 運(yùn)算符

在 JavaScript 中，判斷一個(gè)變量的類(lèi)型嘗嘗會(huì)用 typeof 運(yùn)算符，在使用 typeof 運(yùn)算符時(shí)采用引用類(lèi)型存儲(chǔ)值會(huì)出現(xiàn)一個(gè)問(wèn)題，無(wú)論引用的是什么類(lèi)型的對(duì)象，它都返回 “object”。ECMAScript 引入了另一個(gè) Java 運(yùn)算符 instanceof 來(lái)解決這個(gè)問(wèn)題。instanceof 運(yùn)算符與 typeof 運(yùn)算符相似，用于識(shí)別正在處理的對(duì)象的類(lèi)型。與 typeof 方法不同的是，instanceof 方法要求開(kāi)發(fā)者明確地確認(rèn)對(duì)象為某特定類(lèi)型。

instanceof操作符用于檢測(cè)某個(gè)對(duì)象的原型鏈?zhǔn)欠癜硞€(gè)構(gòu)造函數(shù)的prototype屬性。

123 instanceof Number               //false
"123" instanceof String             //false
true instanceof Boolean,            //false
[] instanceof Array                 //true
{} instanceof Object                //true
(function(){}) instanceof Function  //true
undefined instanceof Object         //true
null instanceof Object              //true
new Date() instanceof Date          //true
new RegExp() instanceof RegExp      //true
new Error() instanceof Error        //true

從輸出結(jié)果來(lái)看, undefined和null是檢測(cè)不成Object類(lèi)型的，要使用 instanceof 進(jìn)行變量檢測(cè)時(shí)，需要首先判斷是否是 undefined 和 null

constructor屬性

在使用instanceof檢測(cè)變量類(lèi)型時(shí)，我們檢測(cè)不到number, ‘string’, bool的類(lèi)型的。因此，我們需要換一種方式來(lái)解決這個(gè)問(wèn)題。

constructor本來(lái)是原型對(duì)象上的屬性，指向構(gòu)造函數(shù)。但是根據(jù)實(shí)例對(duì)象尋找屬性的順序，若實(shí)例對(duì)象上沒(méi)有實(shí)例屬性或方法時(shí)，就去原型鏈上尋找，因此，實(shí)例對(duì)象也是能使用constructor屬性的。但是undefinded 和 null是沒(méi)有 constructor 屬性的。

function Person(){}
var Tom = new Person();
console.log(Tom.constructor == Person);  //true
(123).constructor == Number;  //true
("hello").constructor == String ;  //true
(true).constructor == Boolean;  //true
[].constructor == Array;  //true
{}.constructor == Object;  //true
(function(){}).constructor == Function  //true

從上面的輸出結(jié)果可以看出，除了undefined 和 null，其他類(lèi)型的變量均能使用constructor判斷出來(lái)。

但是constructor也不是萬(wàn)無(wú)一失的，它是能被修改的，會(huì)導(dǎo)致輸出的結(jié)果不正確。例如：

function Person(){}
function Student(){}
Student.prototype = new Person();
var Jack = new Student();
console.log( Jack.constructor == Student ); //false
console.log( Jack.constructor == Person ); //true

在上面的例子中， Student原型中的constructor屬性被修改指向到了Person，導(dǎo)致檢測(cè)不出實(shí)例對(duì)象Jack真實(shí)的構(gòu)造函數(shù)。

Object.prototype.toString

Object.prototype.toString.call(變量)輸出的是一個(gè)字符串，字符串里有一個(gè)數(shù)組，第一個(gè)參數(shù)是Object，第二個(gè)參數(shù)就是這個(gè)變量的類(lèi)型，而且，所有變量的類(lèi)型都檢測(cè)出來(lái)了，我們只需要取出第二個(gè)參數(shù)即可。或者可以使用Object.prototype.toString.call(arr)=="object Array"來(lái)檢測(cè)變量arr是不是數(shù)組。

Object.prototype.toString.call(123);
//"[object Number]"
Object.prototype.toString.call("hello");
//"[object String]"
Object.prototype.toString.call(false);
//"[object Boolean]"
Object.prototype.toString.call([]);
//"[object Array]"
Object.prototype.toString.call({});
//"[object Object]"
Object.prototype.toString.call(function(){});
//"[object Function]"
Object.prototype.toString.call(null)
//"[object Null]"
Object.prototype.toString.call(undefined)
//"[object Undefined]"

ECMA里是這樣定義Object.prototype.toString.call的：

Object.prototype.toString( ) When the toString method is called, the following steps are taken:

Get the [[Class]] property of this object.

Compute a string value by concatenating the three strings “[object “, Result (1), and “]”.

Return Result (2)

上面的規(guī)范定義了Object.prototype.toString的行為：首先，取得對(duì)象的一個(gè)內(nèi)部屬性[[Class]]，然后依據(jù)這個(gè)屬性，返回一個(gè)類(lèi)似于”[object Array]”的字符串作為結(jié)果（看過(guò)ECMA標(biāo)準(zhǔn)的應(yīng)該都知道，[[]]用來(lái)表示語(yǔ)言內(nèi)部用到的、外部不可直接訪問(wèn)的屬性，稱為“內(nèi)部屬性”）。利用這個(gè)方法，再配合call，我們可以取得任何對(duì)象的內(nèi)部屬性[[Class]]，然后把類(lèi)型檢測(cè)轉(zhuǎn)化為字符串比較，以達(dá)到我們的目的。