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

判斷值是否是對象

1.toString 方式【常用】

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

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

2.constructor 方式

val?.constructor === Object // true 代表為對象

這里使用了 null 傳導符(?.) 以防止出錯

3.typeof 與 instanceof

typeof 與 instanceof 并不能完全判斷一個值為對象

typeof 的取值有：

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

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

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

4.__proto__ 方式【不推薦】

 __proto__屬性，用來讀取或設置當前對象的 prototype 對象，此屬性未納入標準，不建議使用。

val.__proto__ === Object.prototype // true 代表為對象

5.Object.getPrototypeOf 方式

Object.getPrototypeOf()，用來讀取對象的 prototype 對象。

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

判斷值是否為數(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 方法用來判斷值是否為數(shù)組

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

3.instanceof 方式

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

為什么 instanceof 可以用來判斷數(shù)組而不可以判斷對象呢？因為數(shù)組本身就是一個類似于列表的高階對象。

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() 方法用于測試一個對象是否存在于另一個對象的原型鏈上。

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

該方式不能用來判斷對象！

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

先上代碼

      let shuzu=[];
      shuzu.push(1,2,3,43);      //向數(shù)組里添加幾項
      console.log(shuzu);        //打印這個數(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é)果：

四種方法我簡稱方法1，方法2，方法3，方法4。

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

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

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

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

總結(jié)

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

最新評論