如何判断JavaScript数组是否为空并正确实现JSX条件渲染

问题原因 #

你的判断逻辑存在语法逻辑错误：ar2 < 0在JS运行时会触发隐式类型转换，空数组转为数字结果是0，非空数组转为数字结果是NaN，两种情况和0做小于比较的结果都为假，所以永远会走else分支输出2。

解决方法 #

判断数组为空直接读取数组的length属性即可，空数组的length固定为0，你可以把判断逻辑改成以下代码：

{ar2.length === 0 ? <>This is empty</> : <>{ar2}</>}

如果需要兼容特殊场景下数组可能未定义的情况，可以再加一层兜底判断：

{(ar2?.length ?? 0) === 0 ? <>This is empty</> : <>{ar2}</>}

内容的提问来源于stack exchange，提问作者JS3