基于JS判斷對象是否是數(shù)組
這篇文章主要介紹了基于JS判斷對象是否是數(shù)組,文中通過示例代碼介紹的非常詳細,對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下
1、通過instanceof判斷
instanceof運算符用于檢驗構(gòu)造函數(shù)的prototype屬性是否出現(xiàn)在對象的原型鏈中的任何位置,返回一個布爾值。
let a = [];
a instanceof Array; //true
let b = {};
b instanceof Array; //false
在上方代碼中,instanceof運算符檢測Array.prototype屬性是否存在于變量a的原型鏈上,顯然a是一個數(shù)組,擁有Array.prototype屬性,所以為true。
需要注意的是,prototype屬性是可以修改的,所以并不是最初判斷為true就一定永遠為真。
其次,當(dāng)我們的腳本擁有多個全局環(huán)境,例如html中擁有多個iframe對象,instanceof的驗證結(jié)果可能不會符合預(yù)期,例如:
//為body創(chuàng)建并添加一個iframe對象
var iframe = document.createElement('iframe');
document.body.appendChild(iframe);
//取得iframe對象的構(gòu)造數(shù)組方法
xArray = window.frames[0].Array;
//通過構(gòu)造函數(shù)獲取一個實例
var arr = new xArray(1,2,3);
arr instanceof Array;//false
導(dǎo)致這種問題是因為iframe會產(chǎn)生新的全局環(huán)境,它也會擁有自己的Array.prototype屬性,讓不同環(huán)境下的屬性相同很明顯是不安全的做法,所以Array.prototype !== window.frames[0].Array.prototype,想要arr instanceof Array為true,你得保證arr是由原始Array構(gòu)造函數(shù)創(chuàng)建時才可行。
2、通過constructor判斷
我們知道,實例的構(gòu)造函數(shù)屬性constructor指向構(gòu)造函數(shù),那么通過constructor屬性也可以判斷是否為一個數(shù)組。
let a = [1,3,4]; a.constructor === Array;//true
同樣,這種判斷也會存在多個全局環(huán)境的問題,導(dǎo)致的問題與instanceof相同。
3、通過Object.prototype.toString.call()判斷
Object.prototype.toString().call()可以獲取到對象的不同類型,多個全局環(huán)境也適用
// 檢驗是否是數(shù)組
let a = [1,2,3]
Object.prototype.toString.call(a) === '[object Array]';//true
//檢驗是否是函數(shù)
let b = function () {};
Object.prototype.toString.call(b) === '[object Function]';//true
//檢驗是否是數(shù)字
let c = 1;
Object.prototype.toString.call(c) === '[object Number]';//true
4、通過Array.isArray()判斷
簡單好用,而且對于多全局環(huán)境,Array.isArray() 同樣能準(zhǔn)確判斷,但有個問題,Array.isArray() 是在ES5中提出,也就是說在ES5之前可能會存在不支持此方法的情況。
let a = [1,2,3] Array.isArray(a);//true
最終推薦方法
if (!Array.isArray) {
Array.isArray = function(arg) {
return Object.prototype.toString.call(arg) === '[object Array]';
};
}
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
JavaScript實現(xiàn)經(jīng)典貪吃蛇游戲
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)經(jīng)典貪吃蛇游戲,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2021-09-09
javascript宿主對象之window.navigator詳解
這篇文章主要為大家詳細介紹了javascript宿主對象之window.navigator,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-09-09
JavaScript閉包原理與用法學(xué)習(xí)筆記
這篇文章主要介紹了JavaScript閉包原理與用法,結(jié)合實例形式詳細分析了JavaScript閉包相關(guān)概念、原理、用法及操作注意事項,需要的朋友可以參考下2020-05-05

