Js公共操作类 之 String 扩展方法介绍(一)
Js公共操作类 之 String 扩展方法介绍(一)
本文章介绍一些工作中常见的字符串判断、操作和类型转换，这些扩展方法本身并没有什么特别之处，都是将常见的操作封装起来，这样用起来更加便捷。
封装就是为了能实现快速开发(个人理解)，比如我在做项目中，需要计算两个input 的值相加。一般情况下可能是这样写
1 var sum = parseInt($(“#inputA”).value()) + parseInt($(“#inputB”).value());
这样写符合逻辑，但是如果前台没有加输入限制，我在inputA 输入”你好”，inputB输入”我的世界”。 那么上面的这个等式就会等同于
var sum = NaN + NaN; // parseInt() 转换失败则返回NaN。
此时的sum 就等于了NaN。
开发的时候不注意这些细节，后面测试妹妹或者客户大哥发现后还是要做代码处理，必然增加的时间来处这些本应该避免的问题。从而增加了咱们宝贵的业务时间来该BUG。
一处代码这样写，不算多。处理下就好了，如果我们的项目中许多地方都牵扯到在前端计算的时候，调整起来就麻烦了，除非你的 Ctrl + C 和 Ctrl + V 的速度已经接近光速。
那么我们为什么不写个方法对 parseInt 进行处理呢，当转换结果为NaN 时给返回0，那么上面的输入内容求和就会变成0，则不会是大多数人看不懂的NaN 了。
//一般对 parseInt 简单封装： function _ parseInt(str){ return isNaN(parseInt(this)) ? 0 : parseInt(this); } //使用的时候则是 ： var sum = _parseInt($(“#inputA”).value()) + _parseInt($(“#inputB”).value());
这样写就能避免 NaN 的出现了。
有没有更优雅的写法呢，当然有，就是 对 string 做原型扩展：
1 String. Prototype.toInt = function(){ 2 return isNaN(parseInt(this)) ? 0 : parseInt(this); 3 } 4 5 //使用则是： 6 var sum = $(“#inputA”).value().toInt() + $(“#inputB”).value().toInt();
这种代码看起来易懂， 写起来跟写作文差不多。就是这么骚气！
这样，我们可以将更多的复杂的判断和转换通过这种方式给扩展进来。
比如：“isDate”、“toDate”等。
下面来看下本js中的 String 原型转换代码。
1 /*=========================================*/ 2 /*============对string 类型原型扩展================*/ 3 /*=========================================*/ 4 $.extend(String.prototype, { 5 //支持字符串 format 方法 6 format: function() { 7 var args = arguments; 8 return this.replace(/\{(\d+)\}/g, 9 function(m, i) { 10 return args[i]; 11 }); 12 }, 13 //判断字符串是否为Null或者为空字符串。 14 //为 空 则返回 true，否则返回false 15 isNullOrEmpty: function() { 16 return this === undefined || this === null || this == ""; 17 }, 18 //判断字符串是否为Null或者为空字符串或者全是空格。 19 //为 空 或者全部是空格 则返回 true，否则返回false 20 isNullOrWhiteSpace: function() { 21 return this.isNullOrEmpty() || this.trim().isNullOrEmpty(); 22 }, 23 //判断字符串是否包含指定的内容。val :指定内容 24 //包含指定内容， 则返回 true，否则返回false 25 isContains: function(val) { 26 return this.indexOf(val) > -1; 27 }, 28 //返回字符串，返回反转后副本，并不改变原有的字符串。 29 reverse: function() { 30 var chars = []; 31 for (var i = this.length - 1; i > -1; i--) { 32 chars.push(this[i]); 33 } 34 return chars.join(""); 35 }, 36 //去除字符串左边的空格，返回处理后副本，并不改变原有的字符串。 37 ltrim: function() { 38 return this.replace(/(^\s*)/g, ""); 39 }, 40 //去除字符串右边的空格，返回处理后副本，并不改变原有的字符串。 41 rtrim: function() { 42 return this.replace(/(\s*$)/g, ""); 43 }, 44 //判断字符串是否以指定内容开头 45 //以指定内容开头， 则返回 true，否则返回false 46 startsWith: function() { 47 return this.substr(0, arguments[0].length) == arguments[0]; 48 }, 49 //判断字符串是否以指定内容结尾 50 //以指定内容结尾， 则返回 true，否则返回false 51 endWith: function() { 52 return this.substr(this.length - arguments[0].length) == arguments[0]; 53 }, 54 //判断字符串是否是长日期，例如：2015-11-19 23:00:26。 55 //是 长日期， 则返回 true，否则返回false 56 isLongDate: function() { 57 var r = this.replace(/(^\s*)|(\s*$)/g, "").match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/); 58 if (r == null) { return false; } 59 var d = new Date(r[1], r[3] - 1, r[4], r[5], r[6], r[7]); 60 return (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4] && d.getHours() == r[5] && d.getMinutes() == r[6] && d.getSeconds() == r[7]); 61 }, 62 //判断字符串是否是短日期，例如：2015-11-19。 63 //是 短日期， 则返回 true，否则返回false 64 isShortDate: function() { 65 var r = this.replace(/(^\s*)|(\s*$)/g, "").match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/); 66 if (r == null) { return false; } 67 var d = new Date(r[1], r[3] - 1, r[4]); 68 return (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4]); 69 }, 70 //判断字符串是否是日期，例如：2015-11-19。 71 //是 日期， 则返回 true，否则返回false 72 isDate: function() { 73 return this.isShortDate() || this.isLongDate(); 74 }, 75 //判断字符串是否是电话/传真号码 76 //是 电话/传真号码， 则返回 true，否则返回false 77 isTelOrFax: function() { 78 return this.isNullOrEmpty() ? false : /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(this); 79 }, 80 //判断字符串是否是手机号码 81 //是 手机号码， 则返回 true，否则返回false 82 isMobile: function() { 83 return this.isNullOrEmpty() ? false : /^(13|14|15|17|18)\d{9}$/i.test(this); 84 }, 85 //判断字符串是否是电子邮箱 86 //是 手机号码， 则返回 true，否则返回false 87 isEmail: function() { 88 return this.isNullOrEmpty() ? false : /^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(this); 89 }, 90 //判断字符串是否是邮编 91 //是 邮编， 则返回 true，否则返回false 92 isZip: function() { 93 return this.isNullOrEmpty() ? false : /^[\d]{6}$/.test(this); 94 }, 95 isQQ: function() { 96 return this.isNullOrEmpty() ? false : /^[1-9]\d{5,11}$/i.test(this); 97 }, 98 //判断字符串是否存在汉字。 99 //存在汉字， 则返回 true，否则返回false 100 isExistChinese: function() { 101 return this.isNullOrEmpty() ? false : !/^[\x00-\xff]*$/.test(this); 102 }, 103 //判断字符串是否全是汉字。 104 //全是汉字， 则返回 true，否则返回false 105 isChinese: function() { 106 return this.isNullOrEmpty() ? false : /^[\u0391-\uFFE5]+$/i.test(this); 107 }, 108 //判断字符串是否全是字母。 109 //全是字母， 则返回 true，否则返回false 110 isAbc: function() { 111 return this.isNullOrEmpty() ? false : /^[A-Za-z]+$/i.test(this); 112 }, 113 //将字符串日期转换成日期类型 114 //转换成功则返回对应的时间，失败则返回null 115 toDate: function () { 116 try { return new Date(this.replace(/-/g, "\/")); } 117 catch (e) { return null; } 118 }, 119 //将字符串转换成对应的bool值 120 //转换成功则返回对应的bool值，失败则返回false 121 toBool: function () { 122 var str = this.isNullOrEmpty() ? false : this.toLowerCase(); 123 str = str.trim(); 124 return str == "true" || str == "yes" || str == "y" || str == "t" || str == "1" || str == "是"; 125 }, 126 //将字符串转换成对应的int 127 //转换成功则返回对应的int，失败则返回0 128 toInt: function () { 129 return isNaN(parseInt(this)) ? 0 : parseInt(this); 130 }, 131 //将字符串转换成对应的Double 132 //转换成功则返回对应的Double，失败则返回0.0 133 toDouble: function () { 134 return isNaN(parseFloat(this)) ? 0.0 : parseFloat(this); 135 }, 136 //将字符串转换成对应的Double 137 //转换成功则返回对应的json，失败则返回null 138 toJson: function () { 139 try{return $.parseJSON(this);} 140 catch (e) { return null; } 141 } 142 });
编写测试代码：
1 console.log("测试字符串扩展方法"); 2 console.log("测试 ''.isNullOrEmpty() 方法 ：" + jutil.areEqual("".isNullOrEmpty(), true)); 3 console.log("测试 ' '.isNullOrEmpty() 方法 ：" + jutil.areEqual(" ".isNullOrWhiteSpace(), true)); 4 console.log("测试'zhanghs'.isContains('gh') 方法 ：" + jutil.areEqual("zhanghs".isContains("gh"), true)); 5 console.log("测试'zhanghs'.reverse() 方法 ：" + jutil.areEqual("zhanghs".reverse(), "shgnahz")); 6 console.log("测试' zhanghs'.ltrim() 方法 ：" + jutil.areEqual(" zhanghs".ltrim(),"zhanghs")); 7 console.log("测试' zhanghs '.rtrim() 方法 ：" + jutil.areEqual("zhanghs ".rtrim(), "zhanghs")); 8 console.log("测试'zhanghs '.startsWith('zha') 方法 ：" + jutil.areEqual("zhanghs ".startsWith("zha"),true)); 9 console.log("测试'zhanghs'.endWith('ghs') 方法 ：" + jutil.areEqual("zhanghs".endWith("ghs"), true)); 10 console.log("测试'2015-05-05 23:02:01'.isLongDate() 方法 ：" + jutil.areEqual('2015-05-05 23:02:01'.isLongDate(),true)); 11 console.log("测试'2015-05-05'.isShortDate() 方法 ：" + jutil.areEqual('2015-05-05'.isShortDate(), true)); 12 console.log("测试'0558-6699777'.isTelOrFax() 方法 ：" + jutil.areEqual('0558-6699777'.isTelOrFax(), true)); 13 console.log("测试'15555555666'.isMobile() 方法 ：" + jutil.areEqual('15555555666'.isMobile(), true)); 14 console.log("测试'136533295@qq.com'.isEmail() 方法 ：" + jutil.areEqual('136533295@qq.com'.isEmail(), true)); 15 console.log("测试'23660'.isZip() 方法 ：" + jutil.areEqual('23660'.isZip(), false)); 16 console.log("测试'136533295'.isQQ() 方法 ：" + jutil.areEqual('136533295'.isQQ(), true)); 17 console.log("测试'236张60'.isExistChinese() 方法 ：" + jutil.areEqual('236张60'.isExistChinese(), true)); 18 console.log("测试'测试'.isChinese() 方法 ：" + jutil.areEqual('测试'.isChinese(), true)); 19 console.log("测试'aBc'.isAbc() 方法 ：" + jutil.areEqual('aBc'.isAbc(), true)); 20 console.log("测试'2015-05-05'.toDate() 方法 ：" + '2015-05-05'.toDate()); 21 console.log("测试'是'.toBool() 方法 ：" + jutil.areEqual('是'.toBool(), true)); 22 console.log("测试'是'.toInt() 方法 ：" + jutil.areEqual('是'.toInt(), 0)); 23 console.log("测试'是'.toDouble() 方法 ：" + jutil.areEqual('是'.toDouble(), 0.0)); 24 console.log("测试'是'.toJson() 方法 ：" + jutil.areEqual('是'.toJson(), null));
从上面看出，都是些司空见惯的方法，经过我们这么一包装，确实能”华丽”不少。直接"".isXXX() 就是判断， "".toXXX()则为类型转换。
