在 JavaScript 如何判断变量是否为空
By 蚊子
我们在通过一些参数检索数据时，有些参数其实本身就没必要传给接口，例如：
- 输入框
<Input />对应的参数，若一次也没输入过，通过 Form 表单获取到的是 undefined；但若输入过然后又全部删除了，则得到的是空字符串； - 下拉框或级联选择在处于多选状态时，将之前的选项全部清除，其实得到的是空数组；
诸如空字符窜和空数组之类的，其实我们就没必要将其传给后端接口了。
之前我也参考过 lodash 中的 isEmpty，但这个方法不太满足我们的业务场景。在 lodash 的 isEmpty 中：
- 该方法只检查 value 是否为一个空对象，集合，映射或者 set；
- 若 value 是 number, string, boolean 等基本类型，该方法会认为是空，即返回 true；
但在实际业务中，比如 true、false、0 等还是有实际意义的。这里我也是根据我们的业务场景，封装了一个判断变量是否为空的方法。
const isParamEmpty = (value) => {
if (value == null) {
// 是 null 或 undefined 时，为 true
return true;
}
if (typeof value === "number") {
/**
* 若是NaN，则认为是空；
* 0是合法的
*/
return value !== value;
}
if (typeof value === "string") {
return value.trim() === "";
}
if (Array.isArray(value)) {
return !value.length;
}
const tag = Object.prototype.toString.call(value);
if (tag == "[object Map]" || tag == "[object Set]") {
return !value.size;
}
if (typeof value === "object") {
return !Object.keys(value).length;
}
return false;
};
使用：
isParamEmpty(null); // true
isParamEmpty(undefined); // true
isParamEmpty(123); // false
isParamEmpty(0); // false
isParamEmpty(false); // false
isParamEmpty(Number.NaN); // true
isParamEmpty(" "); // true
isParamEmpty(" abc "); // false
isParamEmpty([]); // true
isParamEmpty([1, 2]); // false
isParamEmpty({}); // true
isParamEmpty({ a: 21 }); // false
isParamEmpty(new Map()); // true
isParamEmpty(new Set()); // true
const map = new Map();
map.set("a", 1);
isParamEmpty(map); // false
const set = new Set();
set.add("abc");
isParamEmpty(set); // false
该方法判断了日常业务中的大部分类型。我还把它封装到了kidash的 npm 包中，大家可以直接使用。
import { isParamEmpty } from "kidash";
console.log(isParamEmpty([])); // true
想参与讨论，或者查看更多优质的文章：