• 实用篇:说说我在JavaScript项目中使用的工具类


    在JavaScript的开发中,我们都会写一些工具类来帮我们简化一些业务操作的逻辑,一下就貼几个我在项目开发过程中常用的工具类。表达能力有限,各位看官还是看源码吧。

    一、日期处理工具类。
    /**
     *  日期处理工具类
     *  @Authors: jackyWHJ
     *  @date 2013-10-18
     *
     */
    var DateUtils = {
        /**   
         * 得到日期在一年当中的周数
         */
        getISOYearWeek: function(date) {
            var commericalyear = this.getCommerialYear(date);
            var date2 = this.getYearFirstWeekDate(commericalyear);
            var day1 = date.getDay();
            if (day1 == 0) day1 = 7;
            var day2 = date2.getDay();
            if (day2 == 0) day2 = 7;
            var d = Math.round((date.getTime() - date2.getTime() + (day2 - day1) * (24 * 60 * 60 * 1000)) / 86400000);
            return Math.floor(d / 7) + 1;
        },
        /**   
         * 得到一年之中的第一周的日期
         */
        getYearFirstWeekDate: function(commericalyear) {
            var yearfirstdaydate = new Date(commericalyear, 0, 1);
            var daynum = yearfirstdaydate.getDay();
            var monthday = yearfirstdaydate.getDate();
            if (daynum == 0) daynum = 7;
            if (daynum <= 4) {
                return new Date(yearfirstdaydate.getFullYear(), yearfirstdaydate.getMonth(), monthday + 1 - daynum);
            } else {
                return new Date(yearfirstdaydate.getFullYear(), yearfirstdaydate.getMonth(), monthday + 8 - daynum);
            }
        },
        /**   
         * 获取当前日期的年份
         */
        getCommerialYear: function(date) {
            var daynum = date.getDay();
            var monthday = date.getDate();
            if (daynum == 0) daynum = 7;
            var thisthurdaydate = new Date(date.getFullYear(), date.getMonth(), monthday + 4 - daynum);
            return thisthurdaydate.getFullYear();
        },
        /**   
         * 获取周一
         */
        getWeekStartDate: function(date) {
            var nowDayOfWeek = (date.getDay() == 0) ? 6 : date.getDay() - 1;
            var t = new Date(date); //复制并操作新对象,避免改动原对象     
            //t.setDate(t.getDate() - nowDayOfWeek);
            t.setTime(t.getTime() - nowDayOfWeek * 86400000);
            return t;
        },
        /**   
         * 获取周日。本周一+6天 
         */
        getWeekEndDate: function(date) {
            var t = new Date(date); //复制并操作新对象,避免改动原对象     
            //t.setDate(this.getWeekStartDate(date).getDate() + 6); //date来计算会有出错的情况出现比如10.1这一周
            t.setTime(this.getWeekStartDate(date).getTime() + 6 * 86400000);
            return t;
        },
        /**   
         * 日期格式化,第一个参数为日期,第二个参数为日期格式化的格式,返回一个格式化后的字符串
         */
        dateFormat: function(date, format) {
            var o = {
                "M+": date.getMonth() + 1, //month
                "d+": date.getDate(), //day
                "h+": date.getHours(), //hour
                "m+": date.getMinutes(), //minute
                "s+": date.getSeconds(), //second
                "q+": Math.floor((date.getMonth() + 3) / 3), //quarter
                "S": date.getMilliseconds() //millisecond
            };
            if (/(y+)/.test(format)) {
                format = format.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
            }
     
            for (var k in o) {
                if (new RegExp("(" + k + ")").test(format)) {
                    format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
                }
            }
            return format;
        },
        /**   
         * 判断输入的日期格式是否为 yyyy-mm-dd 或 yyyy-m-d
         */
        isDate: function (dateString) {
            //判断日期是否为空
            if (dateString.trim() == "") {
                alert("日期为空!请输入格式正确的日期
    
    日期格式:yyyy-mm-dd
    
    例    如:2013-08-08
    
    ");
                return false;
            } else {
                dateString = dateString.trim();
            }
            
            //年月日正则表达式
            var r = dateString.match(/^(d{1,4})(-|/)(d{1,2})2(d{1,2})$/);
            if (r == null) {
                alert("请输入格式正确的日期
    
    日期格式:yyyy-mm-dd
    
    例    如:2013-08-08
    
    ");
                return false;
            }
            var d = new Date(r[1], r[3] - 1, r[4]);
            var num = (d.getFullYear() == r[1] && (d.getMonth() + 1) == r[3] && d.getDate() == r[4]);
            if (num == 0) {
                alert("请输入格式正确的日期
    
    日期格式:yyyy-mm-dd
    
    例    如:2013-08-08
    
    ");
            }
            return (num != 0);
     
        }
    };
    二、表格合并工具类。
    /**
     *  表格通用工具,目前只有合并表格功能,以后慢慢完善
     *  @Authors: jackyWHJ
     *  @date 2013-10-18
     *
     */
    var TableUtils = {
        
        /**
         * 函数说明:合并指定表格(表格id为wTableId)指定列(列数为wTableColumn)的相同文本的相邻单元格  
         * 参数说明:wTableId 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data   
         * 参数说明:wTableColumn 为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。  
         */
        tableColMerger: function(wTableId, wTableColumn) {
     
            var wTableFirstTd = "";
     
            var wTableCurrentTd = "";
     
            var wTableSpanNum = 0;
            var wTableObj = $(wTableId + " tr td:nth-child(" + wTableColumn + ")");
            wTableObj.each(function(i) {
                if (i == 0) {
                    wTableFirstTd = $(this);
                    wTableSpanNum = 1;
                    
                } else {
                    wTableCurrentTd = $(this);
                    if (wTableFirstTd.text() == wTableCurrentTd.text()) {
                        wTableSpanNum++;
                        wTableCurrentTd.hide(); //remove();  
                    } else {
                        wTableFirstTd = $(this);
                        wTableSpanNum = 1;
                    }
                }
                wTableFirstTd.attr("rowSpan", wTableSpanNum);
            });
        },
     
        /**
         * 函数说明:合并指定表格(表格id为wTableId)指定行(行数为wTableRownum)的相同文本的相邻单元格  
         * 参数说明:wTableId 为需要进行合并单元格的表格id。如在HTMl中指定表格 id="data" ,此参数应为 #data   
         * 参数说明:wTableRownum 为需要合并单元格的所在行。其参数形式请参考jQuery中nth-child的参数。  
         *          如果为数字,则从最左边第一行为1开始算起。  
         *          "even" 表示偶数行  
         *          "odd" 表示奇数行  
         *          "3n+1" 表示的行数为1、4、7、10.  
         * 参数说明:wTableMaxcolnum 为指定行中单元格对应的最大列数,列数大于这个数值的单元格将不进行比较合并。  
         *           此参数可以为空,为空则指定行的所有单元格要进行比较合并。  
         */
        tableRowMerger: function(wTableId, wTableRownum, wTableMaxcolnum) {
            if (wTableMaxcolnum == void 0) {
                wTableMaxcolnum = 0;
            }
            var wTableFirstTd = "";
            var wTableCurrentTd = "";
            var wTableSpanNum = 0;
            $(wTableId + " tr:nth-child(" + wTableRownum + ")").each(function(i) {
                var wTableObj = $(this).children();
                wTableObj.each(function(i) {
                    if (i == 0) {
                        wTableFirstTd = $(this);
                        wTableSpanNum = 1;
                    } else if ((wTableMaxcolnum > 0) && (i > wTableMaxcolnum)) {
                        return "";
                    } else {
                        wTableCurrentTd = $(this);
                        if (wTableFirstTd.text() == wTableCurrentTd.text()) {
                            wTableSpanNum++;
                            wTableCurrentTd.hide(); //remove();  
                        } else {
                            wTableFirstTd = $(this);
                            wTableSpanNum = 1;
                        }
                    }
                    wTableFirstTd.attr("colSpan", wTableSpanNum);
                });
            });
        },
        
        /**
         * 函数说明:合并指定表格(表格id为wTableId)指定按照列(列数为fromTableColumn)的合并方式合并目标列(列数为toTableColumn)的单元格  
         * 参数说明:wTableId 为需要进行合并单元格的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data   
         * 参数说明:fromTableColumn 已经合并的单元格所在列。为数字,从最左边第一列为1开始算起。  
         * 参数说明:toTableColumn 目标列,为需要合并单元格的所在列。为数字,从最左边第一列为1开始算起。  
         */
        tableColMergerSpecial: function (wTableId, fromTableColumn,toTableColumn) {
     
            var wTableCurrentTd = "";
            var blockRowArr = {};     //用来存放不需要隐藏的行索引
            var fromTableObj = $(wTableId + " tr td:nth-child(" + fromTableColumn + ")");
            fromTableObj.each(function (i) {
                wTableCurrentTd = $(this);
                if (wTableCurrentTd.attr("rowSpan")) {
                    blockRowArr[i] = wTableCurrentTd.attr("rowSpan");
                }
            });
            if (1 > blockRowArr.length) {
                //样本列不存在合并;
                return;
            }
            var toTableObj = $(wTableId + " tr td:nth-child(" + toTableColumn + ")");
            var isBlock = false;      //是否显示
            toTableObj.each(function (i) {
                wTableCurrentTd = $(this);
                isBlock = false;
                for (var j in blockRowArr) {
                    if (i == j) {
                        isBlock = true;
                        break;
                    }
                }
                if (isBlock) {
                    wTableCurrentTd.attr("rowSpan", blockRowArr[i]);
                } else {
                    wTableCurrentTd.hide(); //remove();  
                }
            });
        },
        
        /**
         * 函数说明:隐藏指定表格(表格id为wTableId)指定列(列数为wTableColumn)  
         * 参数说明:wTableId 为需要进行隐藏列的表格的id。如在HTMl中指定表格 id="data" ,此参数应为 #data   
         * 参数说明:wTableColumn 为需要隐藏的所在列。为数字,从最左边第一列为1开始算起。  
         */
        tableColHide: function (wTableId, wTableColumn) {
     
            var wTableCurrentTd = "";
            //隐藏列头
            $(wTableId + " tr th:nth-child(" + wTableColumn + ")").hide();
            //遍历表格隐藏单元格
            var wTableObj = $(wTableId + " tr td:nth-child(" + wTableColumn + ")");
            wTableObj.each(function (i) {
                wTableCurrentTd = $(this);
                wTableCurrentTd.hide(); //remove();  
            });
        },
    };
    三、数字处理工具类。
    /**  数字格式通用工具,目前只写了数字加千分位功能,以后慢慢完善
     *  @Authors: jackyWHJ
     *  @date 2013-10-18
     *
     */
    var NumberFormatter = {
        //函数说明:给数字加千分位显示  
        //参数说明:num   需要加千分位的数字
     
        numToThousandsSeparator: function (num) {
            //如果传进来的值不是数字,则原值返回
            if (!Number(num) || num < 1000) {
                return num;
            }
            num = num + "";
            var re = /(-?d+)(d{3})/;
            //正则判断
            while (re.test(num)) {
                //符合条件则进行替换
                num = num.replace(re, "$1,$2");
            }
            return num;
        }
    };
    这个加千分位的司徒正美有一篇博客很有意思。“如何将阿拉伯数字每三位一逗号分隔,如:15000000转化为15,000,000
     
    四:将url的查询参数解析成字典对象
    无非就是拆字符或者用正则匹配来解决,因为url允许用户随意输入,如果用拆字符的方式,有任何一处没有考虑到容错,就会导致整个js都报错。而正则就没有这个问题,他只匹配出正确的配对,非法的全部过滤掉,简单,方便。
    function getQueryObject(url) {
        url = url == null ? window.location.href : url;
        var search = url.substring(url.lastIndexOf("?") + 1);
        var obj = {};
        var reg = /([^?&=]+)=([^?&=]*)/g;
        search.replace(reg, function (rs, $1, $2) {
            var name = decodeURIComponent($1);
            var val = decodeURIComponent($2);                
            val = String(val);
            obj[name] = val;
            return rs;
        });
        return obj;
    }
    
    
  • 相关阅读:
    【算法笔记】多线程斐波那契数列
    RAID技术详解
    Mysql 语句汇总(性能篇)
    JS 网页打印解决方案
    MyEclipse修改
    几个需要学习的点和技术
    MyEclipse配色字体等配置的解决方案
    使用hibernate 分表做增删改查
    Web平台开发流程以及规范
    easyui使用总结
  • 原文地址:https://www.cnblogs.com/jackyWHJ/p/3767615.html
Copyright © 2020-2023  润新知