Seasons123 / blog-FE

web前端相关issue is my blog :lollipop:
2 stars 0 forks source link

原生js如何进行公共函数类的封装和使用 #93

Closed Seasons123 closed 5 years ago

Seasons123 commented 5 years ago

示例:把实现金额的千分符显示的方法toThousands和获取对象长度的方法getObjLength,封装到公共函数类commonFn中 1.封装方法

    /* 公共函数类  class commonFn */
    var commonFn = {
        /* 实现金额的千分符显示 */
        toThousands : function (num) {
            if(num == '-') {
                num = '0' ;
            }
            if(typeof num != 'String') {
                num = '' + num;
            }
            var flag = false;//一个标记判断是否存在小数输入
            var lastNum = '00' ;//保存小数后面的数值
            if(num.split('.')[1]){//若存在输入小数点,则处理小数点左边的数字
                lastNum = num.split('.')[1].length >= 2 ?
            num.split('.')[1].substring(0,2) : num.split('.')[1] + '0';
                num = num.split('.')[0];
                flag = true;
            }
            var result = [ ], counter = 0;
            num = (num || 0).toString().split('');
            for (var i = num.length - 1; i >= 0; i--) {
                counter++;
                result.unshift(num[i]);
                if (!(counter % 3) && i != 0) { result.unshift(','); }
            }
            result = result.join('');

            result = result + '.' +lastNum;

            if(result.indexOf("-,") != -1){
                result = result.replace(/-,/g,"-");
            }
            return result;
        },

        /* 获取对象的长度 */
        getObjLength: function (obj) {
            var count = 0;
            if(typeof obj == 'object'){
                $.each(obj, function (key, val) {
                    count++;
                });
            };
            return count;
        },
}

封装思路是:把公共函数类定义为一个全局的对象commonFn ,这个对象和普通的对应一样,可以有属性即属性值(类似于json中的键值)。如果要把一个常用方法封装在此,commonFn 的一个属性就是一个常用方法的名字,该属性名对应的值就在此处写该常用方法的实现。

2.调用方法: 如调用上面封装的toThousands 方法,语法如下 commonFn.toThousands();