首頁>技術>

JavaScript 判斷陣列的幾種方法及其利弊。

1. typeof

對於 Function、String、Number、Undefined 等幾種型別的物件來說,他完全可以勝任。但是為 Array 時:

var arr = [1, 2, 3]console.log(typeof arr) // "object"// 同樣的console.log(typeof null) // "object"console.log(typeof {}) // "object"

所以不能使用 typeof 來判斷。

2. instanceof

instanceof 運算子用於檢測建構函式的 prototype 屬性是否出現在某個例項物件的原型鏈上。

var arr = [1, 2 ,3]console.log(arr instanceof Array) // true
3. 原型鏈(constructor)

一般情況下,除了 undefined 和 null,其它都能使用 constructor 判斷型別。

var arr = [1, 2, 3]console.log(arr.__proto__.constructor === Array) // trueconsole.log(arr.constructor === Array) // true// 注意:arr.__proto__ === Array.prototype 為 true。

但是某些情況下,判斷是不準確的,比如:

// 建構函式function Fn() {}// 修改原型物件Fn.prototype = new Array()// 例項化物件var fn = new Fn()console.log(fn.constructor === Fn) // falseconsole.log(fn.constructor === Array) // true// 此時的 fn 應該是一個普通物件,而非陣列,所以此時使用 constructor 判斷是不合適的。
使用 instanceof 和 constructor 的侷限性:

使用和宣告都必須是在當前頁面,比如父頁面引用了子頁面,在子頁面中聲明瞭一個 Array,將其賦值給父頁面的一個變數,那麼此時做原型鏈的判斷:Array === object.constructor 得到的是 false,原因如下:

Array 屬於引用型資料,在傳遞過程中,僅僅是引用地址的傳遞。 每個頁面的 Array 原生物件所引用的地址是不一樣的,在子頁面宣告的Array 所對應的建構函式是子頁面的 Array 物件;父頁面來進行判斷,使用的 Array 並不等於子頁面的 Array。

看程式碼:

var iframe = document.createElement('iframe')document.body.appendChild(iframe)var xArray = window.frames[window.frames.length - 1].Arrayvar xarr = new xArray()var arr = new Array()// 不同頁面,結果並非我們所預期的 true,而是 false 哦!console.log(xarr instanceof Array) // falseconsole.log(xarr.constructor === Array) // false// 同頁面才是 true 哦!console.log(arr instanceof Array) // trueconsole.log(arr.constructor === Array) // true
4. Object.prototype.toString

該方法通用。

function isArray(arr) {  return Object.prototype.toString.call(arr) === '[object Array]'}
5. Array.isArray

isArray() 方法是 ES5 標準提供的一個判斷陣列方法。

function isArray(arr) {  return Array.isArray(arr)}

綜上所述,提供一個完整可靠的方法,如下:

function isArray(arr) {  const toString = Object.prototype.toString  const isArray = Array.isArray || function (arg) { return toString.call(arg) === '[object Array]' }  return isArray(arr)}

17
  • BSA-TRITC(10mg/ml) TRITC-BSA 牛血清白蛋白改性標記羅丹明
  • C++ 核心指導方針(1)