JavaScript 如何判断变量是否为空方法封装

admin管理员组

文章数量:1442832

JavaScript 如何判断变量是否为空方法封装

日常业务中我们经常需要判断变量是否为空，我在这里封装了一个方法进行判断！

我们在通过一些参数检索数据时，有些参数其实本身就没必要传给接口，例如：

• 输入框<Input />对应的参数，若一次也没输入过，通过 Form 表单获取到的是 undefined；但若输入过然后又全部删除了，则得到的是空字符串；
• 下拉框或级联选择在处于多选状态时，将之前的选项全部清除，其实得到的是空数组；

诸如空字符窜和空数组之类的，其实我们就没必要将其传给后端接口了。

之前我也参考过 lodash 中的 isEmpty，但这个方法不太满足我们的业务场景。在 lodash 的 isEmpty 中：

• 该方法只检查 value 是否为一个空对象，集合，映射或者 set；
• 若 value 是 number, string, boolean 等基本类型，该方法会认为是空，即返回 true；

但在实际业务中，比如 true、false、0 等还是有实际意义的。这里我也是根据我们的业务场景，封装了一个判断变量是否为空的方法。

代码语言：javascript代码运行次数：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;
};

使用：

代码语言：javascript代码运行次数：0运行复制

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问题

如果你遇到如下问题

• Node Sass does not yet support your current environment
• error /Users/xxx/code/xxx/node_modules/node-sass: Command failed.

先说结论大概率是因为

• node-sass和node版本冲突
• M1架构和node-sass不兼容，完全不支持node-sass

排查

今天我一个老项目就遇到了这个错误，如下图

先尝试使用报错信息给出的帮助命令安装

代码语言：javascript代码运行次数：0运行复制

npm rebuild node-sass

意料之中的不行，因为我这个是很古老的项目使用的是node-sass@4.14.1 版本，所以随后检查node版本是否支持

刚开始没关注系统架构不支持的问题，发现当前 node 版本过高，可是降级安装后还是报错。

后来查看issues发现这两

卒~ 苹果M1招谁惹谁了

解决

随后查看网上是否有解决方案，五花八门，但对我一个没用的，不过大家可以参考尝试是否可以解决

• 卸载node-sass、清除缓存、重新安装node-sass
• 直接升级 sass 版本 npm rebuild node-sass
• 降低node版本
• 将node-sass更换为sass
• Mac 终端使用rosetta打开然后安装依赖
• 使用 yarn/npm install –target_arch=x64 安装x64架构的依赖,如果你直接安装失败了的话，就加上这个
• …

很可惜对我都不适用，目前我的环境为：

电脑：Mac M1 Pro arm64架构

项目：node@v12.14.0 npm@6.13.4

经过一阵谷歌大法后，一条命令解决！感谢社区！

For npm > 6.9 you can switch your dependency to dart-sass/sass with just one line and from there just use sass as you would before.

代码语言：javascript代码运行次数：0运行复制

npm install node-sass@npm:sass

本文标签： JavaScript 如何判断变量是否为空方法封装