JavaScript空字符串判断

本文完整示例代码GIT仓:

比较常见写法

    if (str == 'undefined' || !str || !/[^\s]/.test(str)) {
//为空
} else {
//不为空
}

这种写法缺点

  • 代码比较长,难于记住
  • 需要复制的时候要找代码,费时间

解决方案

  • 对于这种常用的代码段,我们项目上经常会把他封装成一个通用函数,放到项目工具库中,然后需要使用的时候直接调用
  • 使用第三方工具库,比如jPublic.js,GIT仓:https://github.com/smltq/jPublic

收到的反馈总结

有人可能觉得,判断一个字符串为空,直接写成这样:

a.

    if (str) {
//为空
} else {
//不为空
}

在实际生产环境中并没有什么问题,何必要如上写一段这么长的代码来判断。(PS:一些特殊数据下,真的就显示正常吗?针对这种情况,我下面会写出测试用例来判断运行结果)

其它判断空代码

网络上还有很多各种情况的空字符串判断,如下:

b.

  if (variable1 !== null || variable1 !== undefined || variable1 !== '') {
var variable2 = variable1;
}

c.

   function isEmpty(property) {
return (property === null || property === "" || typeof property === "undefined");
}

d.

function isEmpty(strIn) {
if (strIn === undefined) {
return true;
} else if (strIn == null) {
return true;
} else if (strIn == "") {
return true;
} else {
return false;
}
}

e.

String.isEmpty = function (value) {
return (!value || value == undefined || value == "" || value.length == 0);
}

等各种空字符串判断方法,这些代码多少都有些脓肿和判断不全的,了解js if(xx)自动转换的朋友都知道,任何一个值,只要它不是 undefined、null、 0、NaN或空字符串(""),那么无论是任何对象,即使是值为假的Boolean对象,在条件语句中都为真。

所以以上代码,像比如:nullstr、""str等,其实都可以直接使用if(xx)简化。

以下是我写的测试用例代码

    QUnit.test('字符串空判断:empty', function (assert) {
function empty(str) {
if (str == 'undefined' || !str || !/[^\s]/.test(str)) {
return true;
} else {
return false;
}
} var student = {className: "测试班", name: "我是张三", age: 18};
assert.ok(empty(" "), "empty空字符串判断正确");
assert.ok(empty(' '), "empty空字符串判断正确");
assert.ok(empty(student.skill), "empty空字符串判断正确");
assert.ok(empty(undefined), "empty空字符串判断正确");
assert.ok(empty(null), "empty空字符串判断正确");
assert.ok(empty(""), "empty空字符串判断正确");
assert.ok(empty(''), "empty空字符串判断正确");
}); QUnit.test('字符串空判断:empty1', function (assert) {
function empty1(str) {
if (str) {
return true;
}
return false;
} var student = {className: "测试班", name: "我是张三", age: 18};
assert.ok(empty1(" "), "empty1空字符串判断正确");
assert.ok(empty1(' '), "empty1空字符串判断正确");
assert.ok(empty1(student.skill), "empty1空字符串判断正确");
assert.ok(empty1(undefined), "empty1空字符串判断正确");
assert.ok(empty1(null), "empty1空字符串判断正确");
assert.ok(empty1(""), "empty1空字符串判断正确");
assert.ok(empty1(''), "empty1空字符串判断正确");
}); QUnit.test('字符串空判断:isNullOrEmpty', function (assert) {
var student = {className: "测试班", name: "我是张三", age: 18};
assert.ok(_.isNullOrEmpty(" "), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(' '), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(student.skill), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(undefined), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(null), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(""), "isNullOrEmpty 空字符串判断正确");
assert.ok(_.isNullOrEmpty(''), "isNullOrEmpty 空字符串判断正确");
});

单元测试运行结果

String: 字符串空判断:empty (7)Rerun2 ms ============>>>表示7个用例都通过测试

String: 字符串空判断:empty1 (5, 2, 7)Rerun2 ms ============>>>表示7个用例有5个测试未通过

String: 字符串空判断:isNullOrEmpty (7)Rerun ============>>>表示7个用例都通过测试

运行效果图

JavaScript空字符串判断的更多相关文章

  1. 由一篇吐槽对String空字符串判断的文章所引发的碎碎念

    一.起因 最近有篇关于String空字符串判断的文章火了,老是看到这篇文章,既然如此我也只好认真看了下:程序员晒出一段代码引来无数网友狂喷!网友:你就活该当码农! 我也觉得这段代码写的不怎么的,首先程 ...

  2. Javascript常用字符串判断函数

    [代码] 字符串,函数,Javascript,脚本100 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 ...

  3. javascript的字符串判断方法

    Javascript中判断符号主要有:==.!=.===.!== ==.!=这两个符号在判断之前会先对变量类型进行转换,如果类型相同会再比较值; ===.!==这是直接判断两个变量的类型,如果类型不一 ...

  4. 【转】Javascript 中的false,零值,null,undefined和空字符串对象

    js 开发中经常会碰到判断是否为空的情况,关于 null 和 undefined 的区别了解的不是很好,刚好看见这篇文章,转过来学习一下,以下是转载正文: 在Javascript中,我们经常会接触到题 ...

  5. JavaScript空假值及其判断

    一.javaScript五种空值和假值 分别为undefined,null,false,"",0,这五个值的共同点是在执行if语句时都会执行false分支,执行对应的非语句的时候都 ...

  6. Javascript 中的false、0、null、undefined和空字符串对象

    在Javascript中,我们经常会接触到题目中提到的这5个比较特别的对象——false.0.空字符串.null和undefined.这几个对象很容易用错,因此在使用时必须得小心. 类型检测 我们下来 ...

  7. Java空字符串与null的区别和判断字符串是否为空的方法

    Java空字符串与null的区别: 1.类型null表示的是一个对象的值,而并不是一个字符串.例如声明一个对象的引用,String a = null ;""表示的是一个空字符串,也 ...

  8. Javascript 中的false,零值,null,undefined和空字符串对象

    在Javascript中,我们经常会接触到题目中提到的这5个比较特别的对象--false.0.空字符串.null和undefined.这几个对象很容易用错,因此在使用时必须得小心. 类型检测 我们下来 ...

  9. Java知识点-判断null、空字符串和空格

    Java知识点-判断null.空字符串和空格 // 判断headerKey是否为null,空字符串或者空格 if (headerKey != null && headerKey.len ...

随机推荐

  1. 02-EF Core笔记之保存数据

    EF Core通过ChangeTracker跟踪需要写入数据库的更改,当需要保存数据时,调用DbContext的SaveChanges方法完成保存. 基本的添加.更新.删除操作示例如下: using ...

  2. .netcore实现一个读写分离的数据库访问中间件

    在实际业务系统中,当单个数据库不能承载负载压力的时候,一般我们采用数据库读写分离的方式来分担数据库负载.主库承担写以及事务操作,从库承担读操作. 为了支持多种数据库我们先定义一个数据类型字典.key为 ...

  3. Redis 底层数据结构介绍

    Redis 底层数据结构 版本:2.9 支持的数据类型: 字符串 散列 列表 集合 有序集合 字符串 Redis 利用原生的 c 字符串进行了一次封装.封装的字符串叫做简单动态字符串:SDS(simp ...

  4. Nginx配置实例-反向代理实现浏览器请求Nginx跳转到服务器某页面

    场景 Ubuntu Server 16.04 LTS上怎样安装下载安装Nginx并启动: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/detai ...

  5. CSS类的操作

    CSS类的操作 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <t ...

  6. 因特尔CPU上TM和R标识的区别

    TM是英文trademark的缩写,TM标志并非对商标起到保护作用,它与R不同,TM表示的是该商标已经向国家商标局提出申请,并且国家商标局也已经下发了<受理通知书>,进入了异议期,这样就可 ...

  7. RecyclerView 添加自定义分割线

    默认的浅灰色的分割线在某些时候并不能满足我们的要求,这时就需要自定义分割线了. 我们可以通过两种方式来实现:调用 DividerItemDecoration.setDrawable 方法或者继承实现 ...

  8. webpack 插件 ProvidePlugin 的使用方法和 eslint 配置

    ProvidePlugin:自动加载模块,而不必到处 import 或 require .(点击查看官方文档) 使用方法: 配置 webpack.config.js文件里 plugins 属性 new ...

  9. 在Mac上安装JDK1.8及环境变量配置

    今天我们来讲一讲,在Mac上的JDK安装. 第一步,打开终端输入 java -version 看看是否本地已经安装了JDK,如果未安装,OK,继续- 第二步,到官网下载JDK.勾选“Accept Li ...

  10. node.js安装本地模块遇到的目录锁定问题【新手问题】

    昨天发过文字版的,后来以为问题没解决就删除,今天偷个懒,直接上图. 被书中的介绍给误导了,虽然和书中不一样,但实际上自己练习写的模块已经是可用了.也犯了个常识性的错误:Warn一般不会有太大的影响.