zoukankan      html  css  js  c++  java
  • javascript中对数据文本格式化的思考

    在实际应用场景中,我们常常需将一些数据输出成更加符合人类习惯阅读的格式。

    保留小数点后面两位

    在一些要求精度没有那么准确的场景下,我们可以直接通过Number.prototype.toFixed()来实现保留小数点两位这样的需求。

    var num = 123.45678
    console.log(num.toFixed(2)) //123.46
    
    var num2 = 12
    console.log(num2.toFixed(2)) //12.00
    

    不过如果恰好,数字是一个整数,那么就会输出12.00这样的格式,我们常常对于后面为00的整数要求直接输出整数即可。因此不妨这样写。

    var num = 123.45678
    console.log(num.toFixed(2).replace('.00', '')) //123.46
    
    var num2 = 12
    console.log(num2.toFixed(2).replace('.00', '')) //12
    

    toFixed()后面直接接着replace()将整数才会出现的.00字符串替换掉即可。

    ps: Number.prototype.toFixed返回的是一个字符串

    数字为[0-9]的情况下,前置补0

    在输出某些数字的时候下,如果是小于10的情况下需要在前面补0,尤其是在输出日期时间的时候。

    以前在用Date对象去获取到相关的时间数据的时候去判断是否小于10,如果是就补0

    var date = new Date()
    var min = date.getMinutes()
    min = min < 10 ? '0' + min : min
    console.log(min) //08
    

    后来觉得实在不够优雅,而且代码繁多,就想到用字符串替换的方式。

    var date = new Date()
    var min = String(date.getMinutes()).replace(/^(d{1})$/, '0$1')
    console.log(min) //08
    

    这样利用正则去匹配到单数字的情况下直接在前面加上0即可,一行代码,更加优雅。

    再继续衍生下去,我基本上都是在日期格式化的时候需要做数字替换,何不直接整个字符串替换即可?比如将2017-1-8 12:8替换成2017-01-08 12:08

    var date = '2017-1-8 12:8'.replace(/d{1}/g, '0$&')
    console.log(date)
    

    通过正则去做整个字符串替换,不再针对性的针对某些部分做处理了。 最后给出完整的格式化日期函数示例。

    function formatDate (source,  format = 'yyyy-MM-dd') {
        let date = new Date();
        if (typeof source === 'string') format = source;
        if (typeof source === 'number') date = new Date(source);
        if (typeof source === 'object') date = source;
    
        const year = date.getFullYear();
        const month = date.getMonth() + 1;
        const day = date.getDate();
        const hour = date.getHours();
        const miniute = date.getMinutes();
        const second = date.getSeconds();
        return format.replace('yyyy', year)
                      .replace('MM', month)
                      .replace('dd', day)
                      .replace('hh', hour)
                      .replace('mm', miniute)
                      .replace('ss', second)
                      .replace(/d{1}/g, '0$&');
    }
    
    上面列举的所有代码,都没有考察对比过执行效率,因为在这些应用场景下,效率是其次问题。
  • 相关阅读:
    amfphp1.9 class mapping初探
    C#程序打包.exe应用程序
    数据库备份方案
    ListView 控件使用
    在C#中运用SQLDMO备份和恢复Microsoft SQL Server数据库
    .NET
    转载:MATLAB 符号函数作图
    整理雷达相关
    Python 程序 运行过程
    struts2 文件上传显示进度条
  • 原文地址:https://www.cnblogs.com/coffeedeveloper/p/6341519.html
Copyright © 2011-2022 走看看