• 实用篇:说说我在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;
    }
    
    
  • 相关阅读:
    OutputCache 缓存key的创建 CreateOutputCachedItemKey
    Asp.net Web Api源码调试
    asp.net mvc源码分析DefaultModelBinder 自定义的普通数据类型的绑定和验证
    Asp.net web Api源码分析HttpParameterBinding
    Asp.net web Api源码分析HttpRequestMessage的创建
    asp.net mvc源码分析ActionResult篇 RazorView.RenderView
    Asp.Net MVC 项目预编译 View
    Asp.net Web.config文件读取路径你真的清楚吗?
    asp.net 动态创建TextBox控件 如何加载状态信息
    asp.net mvc源码分析BeginForm方法 和ClientValidationEnabled 属性
  • 原文地址:https://www.cnblogs.com/jackyWHJ/p/3767615.html
Copyright © 2020-2023  润新知