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(/\b\d{1}\b/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(/\b\d{1}\b/g, ‘0$&‘);
}
时间: 2024-12-28 01:26:45

javascript中对数据文本格式化的思考的相关文章

Javascript中Date对象的格式化

很多语言中都带有日期的格式化函数,而Javascript中却没有提供类似的方法.之前从某位前人的帖子中发现了下面的代码,感觉非常简洁,存留备用. /** * 时间对象的格式化; */ Date.prototype.format = function (format) { /* 示例 var d=new Date(); d.format("YYYY-MM-dd hh:mm:ss"); 结果:"2014-01-02 12:34:56" */ var o = { &quo

JavaScript中的数据类型转换

本文中提到的“原始值”指的是undefined,null,Boolean,string和number. 本文中的对象是native对象,宿主对象(浏览器定义的对象)按照各自的算法转换. JavaScript中共有六种数据类型,Undefined.Null.Boolean.Number.String和Object. 关于类型转换,JavaScript很有趣的一点是,它会根据他期待的数据类型自动进行类型转换.也就是说,即便你不给他他想要的,他也会自己动手把你给的变成他想要的. 那么这里就有两个问题,

JavaScript 中怎样判断文本框只能输出英文字母、汉字和数字,不能输入特殊字符!

JS-只能输入中文和英文2008-11-08 10:17在js中用正则表达式对象(RegExp)判断中文 ^[\u0391-\uFFE5]+$英文 ^[A-Za-z]+$中文和英文/^[\u0391-\uFFE5A-Za-z]+$/ js正则表达式限制文本框只能输入数字,小数点,英文字母,汉字等各类代码 1.文本框只能输入数字代码(小数点也不能输入)<input onkeyup="this.value=this.value.replace(/\D/g,'')" onafterpa

删除表中所有数据,格式化表

原文发布时间为:2009-03-13 -- 来源于本人的百度文章 [由搬家工具导入] 两种方法: 第一种 大家都常用的: delete from tablename 第二种 : truncate table tablename

Regex 提取字符串中重复数据且格式化显示

方法:用   $下标    提取满足项的值 /** * 餐食信息格式转换 * @早餐,[email protected]晚餐,2 => 早餐(1份):晚餐(2份) */ convertMealInfo = (mealInfo) => { if(mealInfo){ return mealInfo.replace(/\@([\u4e00-\u9fa5]+)[,,]([0-9]+)/g,'$1($2份):') } return '' } 调用 convertMealInfo('@早餐,[email

javascript中的数据结构

Javascript中的关键字 abstract     continue      finally      instanceof      private       this boolean      default      float        int            public        throw break        do           for          interface      return        typeof byte      

关于Javascript中通过实例对象修改原型对象属性值的问题

Javascript中的数据值有两大类:基本类型的数据值和引用类型的数据值. 基本类型的数据值有5种:null.undefined.number.boolean和string. 引用类型的数据值往大的说就1种,即Object类型.往细的说有:Object类型.Array类型.Date类型.Regexp类型.Function类型等. 当原型对象的属性值为基本类型的数据值时,通过实例对象修改属性值从而引起原型对象的属性值发生变化的情况不会发生.当原型对象的属性值为引用类型的数据值时,通过实例对象修改

2:JavaScript中的基本运算

今天说的是JavaScript中的数据基本运算 在上一节中已经说了关于JavaScript中的基本数据类型 那么数据有了 剩下来就是数据之间的运算 表达式-------预算符(赋值 比较 算数 逻辑 条件 new(构造器的实例) this void等等):-- -----------------------------------------------------运算符优先级 其中应该注意的是表达式后都应该有逗号:

【译】Javascript中的数据类型

这篇文章通过四种方式获取Javascript中的数据类型:通过隐藏的内置[[Class]]属性:通过typeof运算符:通过instanceof运算符:通过函数Array.isArray().我们也会看看原型对象的构造函数,可能会有意想不到的数据类型结果. [这篇文章是我在adobe发布的文章,我发布在这里只是为了存档.] 知识储备 在开始我们的话题之前,我们不得不复习一些所需的知识点 1.1 原始值和对象 Javascript中的数据,要么是原始值,要么是对象. 原始值.下面是原始值: und