关于javascript:JavaScript-判断是否为数组

4次阅读

共计 1830 个字符，预计需要花费 5 分钟才能阅读完成。

JavaScript 判断数组的几种办法及其利弊。

对于 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 来判断。

instanceof 运算符用于检测构造函数的 prototype 属性是否呈现在某个实例对象的原型链上。

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

个别状况下，除了 undefined 和 null，其它都能应用 constructor 判断类型。

var arr = [1, 2, 3]
console.log(arr.__proto__.constructor === Array) // true
console.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) // false
console.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].Array
var xarr = new xArray()
var arr = new Array()

// 不同页面，后果并非咱们所预期的 true，而是 false 哦！console.log(xarr instanceof Array) // false
console.log(xarr.constructor === Array) // false

// 同页面才是 true 哦！console.log(arr instanceof Array) // true
console.log(arr.constructor === Array) // true

该办法通用。

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

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)
}