JS判斷是否為對(duì)象或數(shù)組的幾種方式

判斷值是否是對(duì)象

1.toString 方式【常用】

Object.prototype.toString.call(val) === '[object Object]' // true 代表為對(duì)象

注意：這里要使用 call 方法改變作用域

2.constructor 方式

val?.constructor === Object // true 代表為對(duì)象

這里使用了 null 傳導(dǎo)符(?.) 以防止出錯(cuò)

3.typeof 與 instanceof

typeof 與 instanceof 并不能完全判斷一個(gè)值為對(duì)象

typeof 的取值有：

• "undefined"——如果這個(gè)值未定義；
• "boolean"——如果這個(gè)值是布爾值；
• "string"——如果這個(gè)值是字符串；
• "number"——如果這個(gè)值是數(shù)值；
• "object"——如果這個(gè)值是對(duì)象（包括數(shù)組）或null；
• "function"——如果這個(gè)值是函數(shù)；
• "symbol"——如果這個(gè)值是Symbol

instanceof 操作符對(duì)于數(shù)組和對(duì)象都返回 true

[] instanceof Object // true
new Object instanceof Object // true

4.__proto__ 方式【不推薦】

 __proto__屬性，用來(lái)讀取或設(shè)置當(dāng)前對(duì)象的 prototype 對(duì)象，此屬性未納入標(biāo)準(zhǔn)，不建議使用。

val.__proto__ === Object.prototype // true 代表為對(duì)象

5.Object.getPrototypeOf 方式

Object.getPrototypeOf()，用來(lái)讀取對(duì)象的 prototype 對(duì)象。

Object.getPrototypeOf(val) === Object.prototype // true 代表為對(duì)象

判斷值是否為數(shù)組

1.toString 方式

Object.prototype.toString.call(val) === '[object Array]' // true 代表為數(shù)組

注意：這里要用 Object 的 toString 方法，Array 的 toString 返回的是拼接的字符串

var colors = ['red', 'blue', 'green'];
console.log(colors.toString()); ?// red,blue,green

2.Array.isArray 方法【推薦】

ES5中提供了 isArray 方法用來(lái)判斷值是否為數(shù)組

Array.isArray(val) // true 代表為數(shù)組

3.instanceof 方式

val instanceof Array // true 代表為數(shù)組

為什么 instanceof 可以用來(lái)判斷數(shù)組而不可以判斷對(duì)象呢？因?yàn)閿?shù)組本身就是一個(gè)類似于列表的高階對(duì)象。

4.constructor 方式

val?.constructor === Array // true 代表為數(shù)組

5. __proto__ 方式【不推薦】

val.__proto__ === Array.prototype // true 代表為數(shù)組

6.Object.getPrototypeOf 方式 

Object.getPrototypeOf(val) === Array.prototype // true 代表為數(shù)組

7.isPrototypeOf 方式

isPrototypeOf() 方法用于測(cè)試一個(gè)對(duì)象是否存在于另一個(gè)對(duì)象的原型鏈上。

Array.prototype.isPrototypeOf(val) // true 代表為數(shù)組

該方式不能用來(lái)判斷對(duì)象！

如何判斷一個(gè)對(duì)象是不是數(shù)組（例子解釋）

先上代碼

      let shuzu=[];
      shuzu.push(1,2,3,43);      //向數(shù)組里添加幾項(xiàng)
      console.log(shuzu);        //打印這個(gè)數(shù)組
      console.log(Array.isArray(shuzu));                  //方法1
      console.log(shuzu instanceof Array);                //方法2
      console.log(Array.prototype.isPrototypeOf(shuzu));  //方法3
      console.log(Object.prototype.toString.call(shuzu)); //方法4

結(jié)果：

四種方法我簡(jiǎn)稱方法1，方法2，方法3，方法4。

方法1：Array.isArray(…),這是JS已經(jīng)提供的判斷一個(gè)對(duì)象是不是數(shù)組的方法

方法2: … instanceof Array,instanceof是用來(lái)判斷引用類型的方法，而type則是用來(lái)判斷基本類型的方法，instanceof 運(yùn)算符用來(lái)測(cè)試一個(gè)對(duì)象在其原型鏈中是否存在一個(gè)構(gòu)造函數(shù)的 prototype 屬性，返回一個(gè)布爾值。

方法3：Array.prototype.isPrototypeOf(…),利用isPrototypeOf()方法，判定Array是不是在obj的原型鏈中，如果是，則返回true,否則false。

方法4：Object.prototype.toString.call(…),根據(jù)對(duì)象的class屬性(類屬性)，跨原型鏈調(diào)用toString()方法，在js中一個(gè)對(duì)象一旦被創(chuàng)建，在內(nèi)部會(huì)攜帶創(chuàng)建對(duì)象的類型名，js中提供了調(diào)用對(duì)象原型中的toString方法，也就是其中call可以這么理解，相當(dāng)于對(duì)象去借用這個(gè) Object.prototype.toString();

總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論