JavaScript判斷數(shù)組的方法總結(jié)與推薦
前言
無論在工作還是面試中，我們都會遇到判斷一個數(shù)據(jù)是否為數(shù)組的需求，今天我們就來總結(jié)一下，到底有多少方法可以判斷數(shù)組，看看哪種方法是最好用、最靠譜的。
我們從媽媽、爸爸、祖先三個角度來進行判斷。
根據(jù)構(gòu)造函數(shù)判斷（媽媽）
instanceof
判斷一個實例是否屬于某構(gòu)造函數(shù)
let arr = [] console.log(arr instanceof Array) // true
缺點： instanceof 底層原理是檢測構(gòu)造函數(shù)的 prototype 屬性是否出現(xiàn)在某個實例的原型鏈上，如果實例的原型鏈發(fā)生變化，則無法做出正確判斷。
let arr = []
arr.__proto__ = function() {}
console.log(arr instanceof Array) // falseconstructor
實例的構(gòu)造函數(shù)屬性 constructor 指向構(gòu)造函數(shù)本身。
let arr = [] console.log(arr.constructor === Array) // true
缺點： 如果 arr 的 constructor 被修改，則無法做出正確判斷。
let arr = []
arr.constructor = function() {}
console.log(arr.constructor === Array) // false根據(jù)原型對象判斷（爸爸）
__ proto __
實例的 __ proto __ 指向構(gòu)造函數(shù)的原型對象
let arr = [] console.log(arr.__proto__ === Array.prototype) // true
缺點： 如果實例的原型鏈的被修改，則無法做出正確判斷。
let arr = []
arr.__proto__ = function() {}
console.log(arr.__proto__ === Array.prototype) // falseObject.getPrototypeOf()
Object 自帶的方法，獲取某個對象所屬的原型對象
let arr = [] console.log(Object.getPrototypeOf(arr) === Array.prototype) // true
缺點： 同上
Array.prototype.isPrototypeOf()
Array 原型對象的方法，判斷其是不是某個對象的原型對象
let arr = [] console.log(Array.prototype.isPrototypeOf(arr)) // true
缺點： 同上
根據(jù) Object 的原型對象判斷（祖先）
Object.prototype.toString.call()
Object 的原型對象上有一個 toString 方法，toString 方法默認(rèn)被所有對象繼承，返回 "[object type]" 字符串。但此方法經(jīng)常被原型鏈上的同名方法覆蓋，需要通過 Object.prototype.toString.call() 強行調(diào)用。
let arr = [] console.log(Object.prototype.toString.call(arr) === '[object Array]') // true
這個類型就像胎記，一出生就刻在了身上，因此修改原型鏈不會對它造成任何影響。
let arr = []
arr.__proto__ = function() {}
console.log(Object.prototype.toString.call(arr) === '[object Array]') // trueArray.isArray()
Array.isArray() 是 ES6 新增的方法，專門用于數(shù)組類型判斷，原理同上。
let arr = [] console.log(Array.isArray(arr)) // true
修改原型鏈不會對它造成任何影響。
let arr = []
arr.__proto__ = function() {}
console.log(Array.isArray(arr)) // true總結(jié)
以上就是判斷是否為數(shù)組的常用方法，相信不用說大家也看出來 Array.isArray 最好用、最靠譜了吧，還是ES6香！
到此這篇關(guān)于JavaScript判斷數(shù)組方法的文章就介紹到這了,更多相關(guān)JavaScript判斷數(shù)組方法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
JS this關(guān)鍵字在ajax中使用出現(xiàn)問題解決方案
這篇文章主要介紹了JS this關(guān)鍵字在ajax中使用出現(xiàn)問題解決方案,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-07-07
JavaScript 常見安全漏洞和自動化檢測技術(shù)
js安全漏洞目前存在較大的技術(shù)難題，本文結(jié)合案例給大家詳解JavaScript 常見安全漏洞和自動化檢測技術(shù)，需要的朋友可以參考下2015-08-08
這篇文章主要為大家詳細(xì)介紹了bootstrap實現(xiàn)圖片自動輪播，具有一定的參考價值，感興趣的小伙伴們可以參考一下2016-12-12
pdf.js是一款Nozilla開發(fā)的、用于網(wǎng)頁上顯示pdf文檔的Javascript庫,提供pdf文件的在線閱讀,這篇文章主要給大家介紹了關(guān)于PDF.js前端開發(fā)使用實用技巧的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-04-04
svg是基于XML，由World?Wide?Web?Consortium?（W3C）聯(lián)盟開發(fā)的一種開放標(biāo)準(zhǔn)的矢量圖形語言，可讓你設(shè)計激動人心的、高分辨率的Web圖形頁面。本文將使用svg實現(xiàn)一個帶加載進度的loading，需要的可以參考一下2022-11-11
微信小程序?qū)崿F(xiàn)列表滾動頭部吸頂?shù)氖纠a
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)列表滾動頭部吸頂?shù)氖纠a，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
觀察者模式有時也稱為發(fā)布--訂閱模式，在觀察者模式中，有一個觀察者可以管理所有的目標(biāo)，等到有狀態(tài)發(fā)生改變的時候發(fā)出通知2016-03-03
利用location.hash實現(xiàn)跨域iframe自適應(yīng)
其他一些類似js跨域操作問題也可以按這個思路去解決，需要的朋友可以測試下。2010-05-05
Javascript節(jié)流函數(shù)throttle和防抖函數(shù)debounce
這篇文章主要介紹了Javascript節(jié)流函數(shù)throttle和防抖函數(shù)debounce,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-12-12
千萬不要錯過的JavaScript高效對比數(shù)組差異方法
前端開發(fā)中，我們通常需要對比兩個數(shù)組對象的差異。這其中有很多種方法，但是有些方法會帶來一些問題，所以本文為大家準(zhǔn)備了一個高效方法，需要的可以參考一下2023-05-05