前端进阶之旅前端进阶之旅
  • 基础篇HTML/CSS/JS 打底
  • 进阶篇原理与工程化
  • 高频篇面试最常问的那批
  • 精选篇按模块收敛的总结
  • 手写篇常考代码手写实现
  • 面经篇真实面试问题复盘
  • AI 篇NEWAI 时代的前端考点
  • 历年面经NEW按年份追踪真实考点
  • 每日一题每天一道,攒手感
  • 专项自测100 题快速查漏
  • 小程序题库小程序专项刷题
  • 算法题库NEW在线编码即时判题
  • 知识卡片NEW碎片时间过考点
  • 面试题大全常见问题解析
  • AI 答疑NEW随时提问,即时解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • AI 定制路线NEW按你的简历现排
  • AI 知识地图NEW串起全站知识点
  • 原理篇React / Vue 源码拆解
  • HTTP从报文一路讲到 HTTPS
  • 浏览器渲染、事件循环、进程
  • 计算机基础Linux、网络、操作系统
  • 设计模式23 种模式怎么用
  • Node学习指南从环境搭建到服务端
  • NPM工作流script、依赖与发布
  • Docker容器化部署上手
  • Canvas图形与动画实战
  • 前端系统进阶学习大型项目工程化
  • 前端综合文章长期沉淀的实践文
  • 思维导图知识点全景图
  • 学习路线按图索骥不跑偏
  • AI 热点NEWAI 每日动态
  • 公众号动态公众号历史文章
  • 博客动态站长的技术博客
  • 开发者导航常用工具与文档站
  • 基础篇HTML/CSS/JS 打底
  • 进阶篇原理与工程化
  • 高频篇面试最常问的那批
  • 精选篇按模块收敛的总结
  • 手写篇常考代码手写实现
  • 面经篇真实面试问题复盘
  • AI 篇NEWAI 时代的前端考点
  • 历年面经NEW按年份追踪真实考点
  • 每日一题每天一道,攒手感
  • 专项自测100 题快速查漏
  • 小程序题库小程序专项刷题
  • 算法题库NEW在线编码即时判题
  • 知识卡片NEW碎片时间过考点
  • 面试题大全常见问题解析
  • AI 答疑NEW随时提问,即时解析
  • AI 模拟面试NEW模拟真实面试 + 报告
  • AI 定制路线NEW按你的简历现排
  • AI 知识地图NEW串起全站知识点
  • 原理篇React / Vue 源码拆解
  • HTTP从报文一路讲到 HTTPS
  • 浏览器渲染、事件循环、进程
  • 计算机基础Linux、网络、操作系统
  • 设计模式23 种模式怎么用
  • Node学习指南从环境搭建到服务端
  • NPM工作流script、依赖与发布
  • Docker容器化部署上手
  • Canvas图形与动画实战
  • 前端系统进阶学习大型项目工程化
  • 前端综合文章长期沉淀的实践文
  • 思维导图知识点全景图
  • 学习路线按图索骥不跑偏
  • AI 热点NEWAI 每日动态
  • 公众号动态公众号历史文章
  • 博客动态站长的技术博客
  • 开发者导航常用工具与文档站
首页程序员面试题库Array.isArray 与 instanceof 跨 realm 区别
JSJavaScript数组与集合

Array.isArray 与 instanceof Array 有什么区别,跨 iframe 为什么会失效?

判断“是不是数组”和判断“原型链里有没有这个 Array.prototype”,回答的是两个不同问题。

前端进阶之旅 · 一题精讲更新于 2026.09.06
JavaScript#数组与集合
先看核心答案读代码示例
理解线索

区分三种看起来像数组的情况

  1. 真实数组拥有数组内部语义与索引长度关系
  2. 伪造原型继承数组方法但没有数组内部身份
  3. 类数组或视图有长度与索引但采用其他数据模型

instanceof 还可受 Symbol.hasInstance 等定制行为影响,不能把它当作通用且不可改变的运行时类型标签。

核心回答

先记住这个答案

Array.isArray 检查值是否具备数组的内部身份,而 instanceof Array 通常沿原型链查当前这个构造器的 prototype。不同 iframe 或 realm 拥有各自的 Array 构造器,外部数组的原型不一定经过当前 Array.prototype,因此 instanceof 可能为 false,Array.isArray 仍能识别。反过来,普通对象若把原型设成 Array.prototype,可以通过普通 instanceof 检查,却不是真数组。Array.isArray 也不把 TypedArray 当普通数组;确认容器身份后,还需要单独验证元素类型、长度和业务结构。

  • Array.isArray 判断数组身份而非外观
  • 跨 realm 使用不同 Array.prototype
  • 数组身份不等于数组内容已通过校验

用伪造原型对象说明检查目标不同

下面创建一个以 Array.prototype 为原型的普通对象。它能让普通 instanceof 的原型链检查成立,但 Array.isArray 仍返回 false,说明继承方法和拥有数组内部身份并不是同一回事。

TypedArray 可以按索引访问并支持许多序列操作,却有固定元素表示等不同规则,所以不会被识别为普通数组。接口若同时接受这些类型,应分别定义支持条件,而不是放宽到任何带 length 的对象。

数组品牌与原型链对照JavaScript
const real = [1, 2];
const imitation = Object.create(Array.prototype);
const typed = new Uint8Array([1, 2]);
console.log(Array.isArray(real), real instanceof Array);
console.log(Array.isArray(imitation), imitation instanceof Array);
console.log(Array.isArray(typed), typed instanceof Array);
查看输出与解释
true true
false true
false false

普通数组同时满足两种检查,伪造原型只满足原型链条件,TypedArray 则不属于普通 Array。示例没有改变全局原型,测试对象在当前隔离执行环境里独立创建。

跨 realm 需要理解构造器来自哪里

同源 iframe 的脚本创建数组后,把它交给父页面时,数组仍保留所属 realm 的原型关系。父页面拿自己的 Array 做 instanceof,可能找不到同一个原型对象,因此得到 false。

这个现象不表示数组损坏,也不需要为了检测先复制所有元素。可以用 Array.isArray 识别容器,再根据接口校验内容;访问跨源 iframe 仍受浏览器同源规则约束,类型方法不能绕过访问限制。

身份检查只是输入验证的第一步

Array.isArray 为 true 的值仍可能包含空位、错误元素类型、过大长度或恶意构造的对象成员。业务解析应继续检查数据规模、字段和允许的值,不能把一个布尔结果当作完整可信边界。

若代码只是消费可迭代对象,强制要求数组可能又过于严格。应先确定真正需要数组随机索引与长度语义,还是只需要顺序读取,然后选择品牌检查、协议检查或显式转换。

回答前,多想一步

容易答错的地方

用 instanceof Array 作为跨窗口通用判断
不同 realm 的构造器和原型不同,真实数组可能被误判。通用数组身份判断应使用 Array.isArray,并在需要跨环境的接口测试外部数组,而不只验证当前页面字面量。
确认是数组后直接相信所有成员
容器身份不保证元素类型、无空位或长度安全。应继续执行与业务输入契约相符的检查,必要时返回明确错误,避免深层代码在更远位置才因错误字段失败。
试着用自己的话回答

面试官还会怎么问?

Object.prototype.toString 更可靠吗?

它可用于观察常见内建标签,但 Symbol.toStringTag 等机制能影响结果,不能作为数组身份检查的替代保证。针对数组应使用专门方法,其他类型则需要结合具体 API 契约判断。

Proxy 包装数组还是数组吗?

正常代理包装真实数组时,Array.isArray 通常仍识别为数组,但已撤销代理等情况可能抛错。外部未知值的错误处理应依据实际接口要求,不能把所有对象检查都假设成绝不会失败。

Array.prototype 自己算数组吗?

它本身也是数组,这说明 Array.isArray 判断的是内部身份,并不要求值由当前代码调用 new Array 创建。面试可以用这个边界检验理解,但业务校验仍应关注实际输入内容和允许范围。

从一道题,走向一组知识

把知识连起来

数组与集合

数字数组直接 sort 为什么会把 10 排在 9 前面?

确认容器后继续定义数字或业务字段的排序规则。

数组与集合

Array.from 为什么能转换类数组,而数组展开有时会报错?

只需要序列消费时比较协议转换与品牌限制。

数组与集合

怎样手写 Symbol.iterator,让普通对象支持 for...of 和数组展开?

了解普通对象怎样提供可迭代能力而不成为数组。

参考资料

  • MDN:Array.isArray

示例用于理解所注明的运行环境与边界;延伸学习可结合原文中的更多案例。

本题目录
  1. 先记住这个答案
  2. 用伪造原型对象说明检查目标不同
  3. 跨 realm 需要理解构造器来自哪里
  4. 身份检查只是输入验证的第一步
  5. 容易答错的地方
  6. 面试官还会怎么问
  7. 把知识连起来
读懂,再试着讲出来

先看核心答案,再读代码。最后展开追问,检查自己有没有遗漏边界。

试着回答追问
浏览全部面试题理解原理,也关注真实的使用场景。回到顶部 ↑