判断变量是否为数组

csdh11 2024-12-02 16:38 4 浏览

大家好，我是前端西瓜哥，今天带大家学习在 JS 中如何判断一个对象是否为数组。

Array.isArray

最好的写法是使用 Array.isArray(val)。

因为该方法能正确判断 iframe 传过来的变量。

instanceof

val instanceof Array

对于一个普通数组，它的原型链是这样的：

数组实例 -> Array.protype -> Object.prototype -> null

如果一个变量是数组，那它的原型链上就一定会有 Array.prototype。

instanceof 的原理其实就是左值沿着它的原型链，和右侧值的 prototype 属性比较，看是否相等。找到相等的就返回 true，否则返回 false。

但 instanceof 无法处理 iframe 的变量，因为 iframes 的 Array 并不是当前页面的 Array，它们指向各自的内存空间。

const iframe = document.createElement('iframe');
document.body.appendChild(iframe);
const ArrayInFrame = window.frames[0].Array; // iframe中的构造函数
const arr = new ArrayInFrame();
arr instanceof Array // false
Array.isArray(arr); // true

只要是能判断 对象是否在原型链上 的方法都是可以用来判断是否为数组的，所以你还可以用：

// isPrototypeOf 方法
// Array.prototype 是否在 val 的原型链上
Array.prototype.isPrototypeOf(val);
// getPrototypeOf 方法
// val 的上一个原型是否为 Array.prototype
Object.getPrototypeOf(val) === Array.prototype

Object.prototype.toString.call

Object.prototype.toString.call(val) === '[object Array]';

对象都可以通过 toString 方法生成一个字符串，对于对象，通常会返回 [object Xxx] 的形式的字符串，对于数组，则会返回 [object Array]。

结尾

考虑到要兼容 iframe 的变量，所以建议使用 Array.isArray 方案。

此外判断数组还可以使用查找原型链对象的方法，以及通过 toString 得到的字符串的方法。

我是前端西瓜哥，欢迎关注我，掌握更多前端面试题。

document.appendchild

上一篇：让你的代码认主，只有我自己能调试的代码
下一篇：闭包(一):闭包的9个应用场景

判断变量是否为数组

Array.isArray

instanceof

Object.prototype.toString.call

结尾

相关推荐

Boston Dynamics Founder to Attend the 2024 T-EDGE Conference

IDC机房服务器托管可提供的服务

详解PostgreSQL 如何获取当前日期时间

新版腾讯QQ更新Windows 9.9.7、Mac 6.9.25、Linux 3.2.5版本

一文看懂mysql时间函数now()、current_timestamp() 和sysdate()

流星蝴蝶剑:76邵氏精华版，强化了流星，消失了蝴蝶

PhotoShop通道

查看 CAD文件，电脑上又没装AutoCAD?这款CAD快速看图工具能帮你

WildBit Viewer 6.13 快速的图像查看器，具有幻灯片播放和编辑功能

光与灯具的专业术语你知多少?

判断变量是否为数组

Array.isArray

instanceof

Object.prototype.toString.call

结尾

相关推荐

Boston Dynamics Founder to Attend the 2024 T-EDGE Conference

IDC机房服务器托管可提供的服务

详解PostgreSQL 如何获取当前日期时间

新版腾讯QQ更新Windows 9.9.7、Mac 6.9.25、Linux 3.2.5版本

一文看懂mysql时间函数now()、current_timestamp() 和sysdate()

流星蝴蝶剑:76邵氏精华版，强化了流星，消失了蝴蝶

PhotoShop通道

查看 CAD文件，电脑上又没装AutoCAD?这款CAD快速看图工具能帮你

WildBit Viewer 6.13 快速的图像查看器，具有幻灯片播放和编辑功能

光与灯具的专业术语 你知多少?

光与灯具的专业术语你知多少?