JavaScript 里怎么判断数组是否为空？3 种方法一次讲清

判断 JavaScript 数组是否为空，最稳妥的做法是看 length 属性：当数组的 length 严格等于 0 时，它就是空数组，写法是 arr.length === 0。你刚拿到接口返回的数据，想先确认数组里有没有内容再决定渲染——结果一不小心用了错的方法，页面直接报错。本文基于现代浏览器与 Node.js 环境验证，整理 length 直接判断、Array.isArray 加 length 双保险、以及几种容易踩坑的写法三种方式，并说清空数组、undefined、空字符串之间的区别。看完你不仅能写对，还能讲清原因。今天这篇文章，编程狮就把这块讲透。

一、先说结论：arr.length === 0 就是空

数组（array）是 JavaScript 里用来装一组数据的"容器"，你可以把它理解成一个按编号排好的抽屉柜，每个格子放一个值。判断它"空不空"，本质就是问：这个柜子里有没有抽屉、或者抽屉里有没有东西。

在 JavaScript 里，数组有一个自带的 length 属性，表示"当前有几个元素"。所以最直接的判断就是：

一句话结论：只要 arr.length === 0，数组就是空的；否则就不是。

如果你的场景只是"有没有内容要渲染"，这一句就够用了。想先把 JavaScript 的基础数据类型系统过一遍，可以先看 JavaScript 教程的前几章。

顺带提一句：length 不只是"只读"的计数器，它是可读写的。你把 arr.length = 0 就能直接清空数组；把 arr.length 设成一个比当前小的数，数组会被从末尾截断。理解这一点，能帮你少踩"明明赋值了却没变"的坑——有时候你以为改了长度，其实是触发了截断。

1.1 为什么用 === 而不是 ==

判断时建议用严格相等 ===。== 会做隐式类型转换，虽然在 0 这个场景下一般没问题，但养成 === 的习惯能避免很多莫名其妙的 bug。后面几种坑，大多就是栽在类型转换上。

二、方法一：length 直接判断（最推荐）

这是日常用得最多、也最清晰的写法。

const list = [];


if (list.length === 0) {
  console.log("数组是空的");
} else {
  console.log("数组有", list.length, "个元素");
}

上面这段先定义了一个空数组 list，再用 length === 0 判断。如果接口返回的是 []，这里就会走进"数组是空的"分支。执行后你在控制台应该看到打印出"数组是空的"。

2.1 渲染列表前先判断

实际写页面时，常见做法是拿到数据先判断，再决定渲染还是显示占位：

function render(list) {
  if (list.length === 0) {
    return "暂无数据";
  }
  return list.map(item => `<li>${item}</li>`).join("");
}

这段做了"空就给占位文案、非空才拼列表"的逻辑，能挡掉大部分"空列表报错"。常用的方法和属性记不住时，JavaScript 速查手册可以贴在旁边随时翻。

反过来，要判断"有内容"就用 arr.length > 0。如果变量可能是 undefined，可以用可选链 arr?.length：arr?.length === 0 在 arr 不存在时不会报错，而是得到 undefined，再配合双保险更稳。可选链（?.）是现代 JavaScript 里很常用的语法糖，能在"可能为空"的访问链上安全取值，写工具函数时经常派上用场。

三、方法二：Array.isArray 加 length 双保险（防 undefined）

length 判断有个前提：你拿到的确实是个数组。如果变量其实是 undefined 或 null，访问 .length 会直接抛错。

function isEmpty(arr) {
  return Array.isArray(arr) && arr.length === 0;
}


isEmpty(undefined); // false，不会报错
isEmpty([]);        // true

Array.isArray 先确认"这确实是个数组"，再去看 length。这样即使传进来的是 undefined，也只会返回 false，不会让整个程序崩掉。处理接口返回这种"不一定有值"的数据时，这个写法更稳。

这种写法在工具函数里特别常见：你写一个 formatList 时，统一用 isEmpty 兜底，调用方就不用到处判空了。它把"是不是数组"和"空不空"两件事合成一步，可读也好维护。

3.1 什么时候必须用双保险

下面这些情况建议加 Array.isArray：

数据来自接口，字段可能缺失；
函数参数类型不确定；
你在对一个"可能是数组也可能不是"的变量做判断。

如果变量来源百分百是数组（比如你刚 const list = [] 创建出来的），直接用 length 就够了，不必每层都加。更多前端基础概念，可以在编程词典里按关键词查。

四、方法三与常见坑：转字符串、Boolean、空数组 vs undefined

除了上面两种正经写法，你可能在网上看到过一些"偏方"。它们有的能用，但坑也不少。

4.1 用 JSON.stringify 判断

JSON.stringify(arr) === "[]"; // 空数组时为 true

这能判断空数组，但代价是每次都要把整个数组序列化（转成字符串），数组很大时很浪费；而且它只能判断"空数组"，顺带还做了不必要的转换。不推荐作为常规判断。

4.2 用 Boolean(arr) 判断

if (arr) { ... } // 错！空数组也是 true

这是最容易踩的坑：在 JavaScript 里，空数组 [] 是"真值"（truthy）。Boolean([]) 的结果是 true。所以 if (arr) 判断的是"变量存不存在"，不是"数组空不空"。空数组照样会走进 if，导致你以为有数据。

⚠️ 注意：永远不要用 if (arr) 来判断数组是否为空，空数组 [] 会被当成"有内容"。

4.3 空数组、undefined、空字符串别搞混

值	类型	算"空"吗	判断方式
`[]`	数组	是（没元素）	`arr.length === 0`
`undefined`	未定义	是（没赋值）	`arr === undefined`
`""`	字符串	是（没字符）	`str === ""`

三者都"看起来空"，但类型完全不同。写判断时先想清楚你手里到底是哪一种，再选对应的判断，不要混用。

💡 小提示：如果你既要判断"是不是数组"又要判断"空不空"，用第三节的 Array.isArray(arr) && arr.length === 0 一句话搞定，最省事。

4.4 用 arr == [] 为什么永远不对

if (arr == []) { ... } // 几乎永远为 false

哪怕 arr 真的是一个空数组，arr == [] 也基本是 false。原因是 == 比较两个对象时比的是"是不是同一个东西"——两个 [] 在内存里是两个不同的对象，所以不会相等。判断空要用 length === 0，别用相等比较去碰运气。

总结

判断 JavaScript 数组是否为空，记住一个核心：arr.length === 0 就是空。来源可靠、确定是数组时直接用 length；数据可能缺失时，加上 Array.isArray 做双保险。至于 JSON.stringify、Boolean(arr) 这类写法，要么浪费、要么本身就是错的，别在判断"空不空"时用。

要点带走：

数组空不空，看 length === 0 最直接；
数据不一定存在时，用 Array.isArray(arr) && arr.length === 0；
空数组 [] 是"真值"，if (arr) 判断不了空；
[]、undefined、"" 类型不同，别混着判断。

下一步，把数组的增删改查一起学扎实，处理列表数据会更顺手。

延伸学习

想把 JavaScript 基础系统补齐，可以按这个顺序来：

先过一遍前端开发零基础课程，把数组、对象这些基础类型铺平；
想搞清楚自己该往哪个方向深入，前端开发方向给了从入门到实战的学习路径。

常见问题

Q：空数组 [] 用 if 判断为什么是 true？ A：因为空数组在 JavaScript 里属于"真值"（truthy），if (arr) 只在变量是 null、undefined、0、""、false 时才为 false。判断空不空要用 arr.length === 0。

Q：接口返回可能是 null，直接写 arr.length 会报错吗？ A：会。当 arr 是 null 或 undefined 时访问 .length 会抛 TypeError。用 Array.isArray(arr) && arr.length === 0 先确认是数组再判断，就不会报错。

Q：判断数组除了 length 还有别的内置方法吗？ A：没有专门判断"空"的内置方法，length === 0 就是标准做法。想判断"是否包含某元素"才用 includes、indexOf 等，它们解决的是不同问题。