基于JS判斷對(duì)象是否是數(shù)組
這篇文章主要介紹了基于JS判斷對(duì)象是否是數(shù)組,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
1、通過(guò)instanceof判斷
instanceof運(yùn)算符用于檢驗(yàn)構(gòu)造函數(shù)的prototype屬性是否出現(xiàn)在對(duì)象的原型鏈中的任何位置,返回一個(gè)布爾值。
let a = []; a instanceof Array; //true let b = {}; b instanceof Array; //false
在上方代碼中,instanceof運(yùn)算符檢測(cè)Array.prototype屬性是否存在于變量a的原型鏈上,顯然a是一個(gè)數(shù)組,擁有Array.prototype屬性,所以為true。
需要注意的是,prototype屬性是可以修改的,所以并不是最初判斷為true就一定永遠(yuǎn)為真。
其次,當(dāng)我們的腳本擁有多個(gè)全局環(huán)境,例如html中擁有多個(gè)iframe對(duì)象,instanceof的驗(yàn)證結(jié)果可能不會(huì)符合預(yù)期,例如:
//為body創(chuàng)建并添加一個(gè)iframe對(duì)象 var iframe = document.createElement('iframe'); document.body.appendChild(iframe); //取得iframe對(duì)象的構(gòu)造數(shù)組方法 xArray = window.frames[0].Array; //通過(guò)構(gòu)造函數(shù)獲取一個(gè)實(shí)例 var arr = new xArray(1,2,3); arr instanceof Array;//false
導(dǎo)致這種問(wèn)題是因?yàn)閕frame會(huì)產(chǎn)生新的全局環(huán)境,它也會(huì)擁有自己的Array.prototype屬性,讓不同環(huán)境下的屬性相同很明顯是不安全的做法,所以Array.prototype !== window.frames[0].Array.prototype,想要arr instanceof Array為true,你得保證arr是由原始Array構(gòu)造函數(shù)創(chuàng)建時(shí)才可行。
2、通過(guò)constructor判斷
我們知道,實(shí)例的構(gòu)造函數(shù)屬性constructor指向構(gòu)造函數(shù),那么通過(guò)constructor屬性也可以判斷是否為一個(gè)數(shù)組。
let a = [1,3,4]; a.constructor === Array;//true
同樣,這種判斷也會(huì)存在多個(gè)全局環(huán)境的問(wèn)題,導(dǎo)致的問(wèn)題與instanceof相同。
3、通過(guò)Object.prototype.toString.call()判斷
Object.prototype.toString().call()可以獲取到對(duì)象的不同類(lèi)型,多個(gè)全局環(huán)境也適用
// 檢驗(yàn)是否是數(shù)組 let a = [1,2,3] Object.prototype.toString.call(a) === '[object Array]';//true //檢驗(yàn)是否是函數(shù) let b = function () {}; Object.prototype.toString.call(b) === '[object Function]';//true //檢驗(yàn)是否是數(shù)字 let c = 1; Object.prototype.toString.call(c) === '[object Number]';//true
4、通過(guò)Array.isArray()判斷
簡(jiǎn)單好用,而且對(duì)于多全局環(huán)境,Array.isArray() 同樣能準(zhǔn)確判斷,但有個(gè)問(wèn)題,Array.isArray() 是在ES5中提出,也就是說(shuō)在ES5之前可能會(huì)存在不支持此方法的情況。
let a = [1,2,3] Array.isArray(a);//true
最終推薦方法
if (!Array.isArray) { Array.isArray = function(arg) { return Object.prototype.toString.call(arg) === '[object Array]'; }; }
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
javascript函數(shù)中的3個(gè)高級(jí)技巧
這篇文章主要為大家詳細(xì)介紹了javascript函數(shù)中的3個(gè)高級(jí)技巧,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-09-09一文概述ES7~12的語(yǔ)法及其相關(guān)使用規(guī)則
隨著JavaScript這門(mén)語(yǔ)言越來(lái)越流行,使得JavaScript這門(mén)語(yǔ)言越來(lái)越完善,這篇文章主要介紹了一文概述ES7~12的語(yǔ)法及其相關(guān)使用規(guī)則,需要的朋友可以參考下2023-01-01js+ajax實(shí)現(xiàn)的A*游戲路徑算法整理
js+ajax實(shí)現(xiàn)的A*游戲路徑算法整理...2007-05-05firefox瀏覽器下javascript 拖動(dòng)層效果與原理分析代碼
這篇文章主要給大家介紹了關(guān)于在firefox瀏覽器下如何利用javascript實(shí)現(xiàn)拖動(dòng)層效果,以及其中的原理分析,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,下面來(lái)一起看看吧2007-12-12B/S開(kāi)發(fā)中常用javaScript技術(shù)與代碼
B/S開(kāi)發(fā)中常用javaScript技術(shù)與代碼...2007-03-03JS實(shí)現(xiàn)回到頁(yè)面頂部動(dòng)畫(huà)效果的簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇JS實(shí)現(xiàn)回到頁(yè)面頂部動(dòng)畫(huà)效果的簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05