Js判断参数(String,Array,Object)是否为undefined或者值为空


Posted in Javascript onNovember 04, 2013

有时候我们会遇到这样的情况:在一些前端控件要提交数据到服务器端的数据验证过程中,需要判断提交的数据是否为空。如果是普通表单的字符串数据,只需要在 trim 后判断 length 即可,而这里需要的数据可以是各种不同的类型(数字、字符串、数组、对象等等),通过 JSON.stringify(data) 进行序列化后再传递。

在这里定义如下的数据值为“空值”:

•undefined
•null
•空字符串及纯空白字符串:''、'    ' 等。
•空数组:[]
•空对象:{}

对于除此以外的数据值,均认为不为空。

其中 null 和 undefined 很容易识别,但对于其他类型,我们须要得到其数据类型才能用相应的方法去检测数据是否为空。最容易想到的方法就是利用typeof 操作符:

<SPAN style="BACKGROUND-COLOR: rgb(255,255,255)">if(typeof data === 'number') {
  //deal with numbers
}</SPAN>

但 typeof 返回的类型字符串只有 'object'、'function'、'number'、'boolean'、'string'、'undefined' 这六种,很多原生对象如 Date、RegExp 对象无法与用 {} 创建的对象进行区分。另外,typeof 对于一些基本数据类型如 (String、Number、Boolean) 与其对应的基本包装类型数据会分别返回不同值,如:
<SPAN style="BACKGROUND-COLOR: rgb(255,255,255)">console.log(typeof false); //'boolean'
console.log(typeof new Boolean(false)); //'object'
console.log(typeof 1); //'number'
console.log(typeof new Number(1)); //'object'
console.log(typeof ''); //'string'
console.log(typeof new String('')); //'object'</SPAN>

这对我们的判断也有一定的影响。

用 instanceof?这只能判断对象,而且存在多 frame 时多个同类对象不共享 prototype 的问题,从其他 frame 中取得的对象无法正确判断。

还好,还有一个最简单也最可靠的方法:Object.prototype.toString。对于不同类型的数据,这个方法可以返回 '[object Object]'、'[object Array]'、'[object String]' 这样的字符串,非常方便判断。需要注意的是,在 IE8 及其以下浏览器中,这个方法对于null、undefined、window 等都会返回 '[object Object]',不过还好,这并不影响我们使用它判断空对象。

下面直接上代码,说明就看注释吧。

var isEmptyValue = function(value) {
            var type;
            if(value == null) { // 等同于 value === undefined || value === null
                return true;
            }
            type = Object.prototype.toString.call(value).slice(8, -1);
            switch(type) {
            case 'String':
                return !$.trim(value);
            case 'Array':
                return !value.length;
            case 'Object':
                return $.isEmptyObject(value); // 普通对象使用 for...in 判断,有 key 即为 false
            default:
                return false; // 其他对象均视作非空
            }
        };
Javascript 相关文章推荐
javascript 操作文件 实现方法小结
Jul 02 Javascript
JavaScript面向对象设计二 构造函数模式
Dec 20 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
Dec 27 Javascript
编程语言JavaScript简介
Oct 16 Javascript
Jquery动态添加输入框的方法
May 29 Javascript
JS实现从顶部下拉显示的带动画QQ客服特效代码
Oct 24 Javascript
JS实现图片平面旋转的方法
Mar 01 Javascript
vue绑定事件后获取绑定事件中的this方法
Sep 15 Javascript
微信小程序使用npm包的方法步骤
Aug 13 Javascript
vue-cli3单页构建大型项目方案
Apr 07 Javascript
vue基于better-scroll仿京东分类列表
Jun 30 Javascript
canvas绘制折线路径动画实现
May 12 Javascript
浅析return false的正确使用
Nov 04 #Javascript
javascript与jquery中跳出循环的区别总结
Nov 04 #Javascript
js中apply方法的使用详细解析
Nov 04 #Javascript
js数组操作学习总结
Nov 04 #Javascript
Javascript执行效率全面总结
Nov 04 #Javascript
jquery的map与get方法详解
Nov 04 #Javascript
ajax请求get与post的区别总结
Nov 04 #Javascript
You might like
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
PDO::query讲解
2019/01/29 PHP
jQuery Autocomplete自动完成插件
2010/07/17 Javascript
JQury slideToggle闪烁问题及解决办法
2011/07/05 Javascript
js弹出的对话窗口永远保持居中显示
2012/12/15 Javascript
JSuggest自动匹配下拉框使用方法(示例代码)
2013/12/27 Javascript
jquery 通过name快速取值示例
2014/01/24 Javascript
Javascript排序算法之合并排序(归并排序)的2个例子
2014/04/04 Javascript
jQuery中document与window以及load与ready 区别详解
2014/12/29 Javascript
AngularJS表单编辑提交功能实例
2015/02/13 Javascript
jquery简单实现幻灯片的方法
2015/08/03 Javascript
jQuery 监控键盘一段时间没输入
2016/04/22 Javascript
ES6 Promise对象概念与用法分析
2017/04/01 Javascript
JS仿QQ好友列表展开、收缩功能(第二篇)
2017/07/07 Javascript
微信小程序wx.previewImage预览图片实例详解
2017/12/07 Javascript
使用weixin-java-miniapp配置进行单个小程序的配置详解
2019/03/29 Javascript
使用Angular material主题定义自己的组件库的配色体系
2019/09/04 Javascript
layer.js open 隐藏滚动条的例子
2019/09/05 Javascript
微信小程序实现拖拽功能
2019/09/26 Javascript
Python 条件判断的缩写方法
2008/09/06 Python
python将ip地址转换成整数的方法
2015/03/17 Python
Python中优化NumPy包使用性能的教程
2015/04/23 Python
Python BS4库的安装与使用详解
2018/08/08 Python
Python3.5内置模块之time与datetime模块用法实例分析
2019/04/27 Python
django之使用celery-把耗时程序放到celery里面执行的方法
2019/07/12 Python
关于HTML5 Placeholder新标签低版本浏览器下不兼容的问题分析及解决办法
2016/01/27 HTML / CSS
本科生详细的自我评价
2013/09/19 职场文书
公司员工的自我评价范例
2013/11/01 职场文书
优秀英语专业毕业生求职信
2013/11/23 职场文书
教育课题研究自我鉴定范文
2013/12/28 职场文书
开办大学饮食联盟创业计划书
2014/01/29 职场文书
世界水日宣传活动总结
2015/02/09 职场文书
招商银行工作证明
2015/06/17 职场文书
幼儿园小朋友毕业感言
2015/07/30 职场文书
医学会议开幕词
2016/03/03 职场文书
Golang 1.18 多模块Multi-Module工作区模式的新特性
2022/04/11 Golang