JS格式化大全

随着互联网的飞速发展，客户端的JS开发变得越来越重要，JS格式化在项目开发过程中也显得越来越重要，它可以优化项目代码逻辑、提升开发效率，在项目开发中的重要性不可忽视。

一、JS格式化国际时间

使用JS格式化时间是前端开发过程中常用的功能之一，格式化国际时间的话需要使用到JS中的Date函数。最常见的格式化方式是将时间转为字符串，下面是一个样例代码：

let date = new Date();
console.log(date.toUTCString());
// 输出结果：Thu, 03 Sep 2020 09:07:17 GMT

toUTCString()函数将时间转为国际标准时间格式，输出结果为当前的格林威治标准时间。

还有很多其他的日期时间格式，如toLocaleDateString()、toLocaleTimeString()等等。这些函数可以根据你的需求来选择使用。

二、JS格式化时间格式

在项目开发过程中可能会需要格式化不同的时间格式，比如将时间转换为“年-月-日 时:分:秒”的形式。使用JS的Date函数便可轻松实现，下面是样例代码：

 function addZero(n) {
        return n < 10 ? '0' + n : '' + n;    //小于10的数前面加'0'，否则返回原数
    }

    function formatTime(time) {
        const date = new Date(time);
        const year = date.getFullYear();
        const month = addZero(date.getMonth() + 1);
        const day = addZero(date.getDate());
        const hour = addZero(date.getHours());
        const minute = addZero(date.getMinutes());
        const second = addZero(date.getSeconds());
        return `${year}-${month}-${day} ${hour}:${minute}:${second}`;
    }

    console.log(formatTime(1599114256000));
    // 输出结果：2020-09-03 14:50:56

以上代码的思路是，将时间字符串的年月日、时分秒分别提取出来，并在进行格式化之前将小于10的数前面补’0’。

三、JS格式化XML

XML（可扩展标记语言）是用来描述数据的一种标记语言，而将XML格式化可以使其更便于阅读和解析。使用JS格式化XML可以使用XMLSerializer对象，样例代码如下：

const xmlString = `John Smith`;

const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xmlString, 'text/xml');

const serializer = new XMLSerializer();
console.log(serializer.serializeToString(xmlDoc));
// 输出结果：John Smith

以上代码的思路是：将需要格式化的XML字符串使用DOMParser对象将其解析为XML DOM，再使用XMLSerializer对象将XML DOM转成字符串形式的XML，并输出到控制台。

四、JS格式化JSON

像XML一样，格式化JSON字符串可以使其更容易阅读和解析。JS中也可以使用JSON对象来进行格式化，样例代码如下：

let jsonStr = '{"name": "小明", "age":18, "sex":"男", "hobby": ["game", "sport", "reading"]}';

let jsonObj = JSON.parse(jsonStr);
let prettyJson = JSON.stringify(jsonObj, null, 4);

console.log(prettyJson);
// 输出结果为格式化后的JSON字符串

以上代码的思路是：首先将需要格式化的json字符串转换为JSON对象，再使用JSON.stringify()函数将JSON字符串转换为格式化后的JSON字符串输出到控制台。

五、JS格式化日期

在JS中，将日期格式化为“年-月-日”、“月/日/年”等格式很常见。下面是一个格式化为“年-月-日”的演示代码：

function formatDate(date) {
        const y = date.getFullYear();
        const m = date.getMonth() + 1;
        const d = date.getDate();
        return `${y}-${m}-${d}`;
    }

console.log(formatDate(new Date()));
// 输出结果：2020-09-03

以上代码的思路是：首先将日期中的年月日提取出来，然后拼接成需要格式化的形式。

六、JS格式化时间戳

在JS中，将时间戳格式化为“年-月-日”、“月/日/年”等格式也是很常见的操作。下面是一个格式化为“年-月-日”的演示代码：

function formatTimeStamp(timeStamp) {
        const date = new Date(timeStamp);
        const y = date.getFullYear();
        const m = date.getMonth() + 1;
        const d = date.getDate();
        return `${y}-${m}-${d}`;
    }

console.log(formatTimeStamp(1599114256000));
// 输出结果：2020-09-03

以上代码的思路与格式化日期的代码类似，只需要将传入的时间戳用Date对象转换成日期即可。

七、JS格式化工具

在JS开发中，我们可能需要使用一些工具来辅助我们进行格式化，比如Lodash、Moment.js等。下面我们来演示一下如何使用Moment.js来格式化时间：

let time = '2020-09-03 15:11:36';
let momentTime = moment(time).format('YYYY-MM-D h:mm:ss');

console.log(momentTime);
// 输出结果：2020-09-3 3:11:36

以上代码的思路是：首先使用moment()函数将时间字符串转化为Moment对象，然后使用format()函数将其格式化为需要的格式，最后输出到控制台。

八、JS格式化金额

在处理金钱交易时，我们需要对金额进行格式化，比如添加千位分隔符，保留两位小数等等。下面是一个将金额格式化为千位分隔符+两位小数的演示代码：

function formatMoney(money) {
        let left = money.split('.')[0];  // 获取整数部分
        let right = money.split('.')[1];  // 获取小数部分
        left = left.split('').reverse().reduce((prev, next, index) => {    // 让整数部分每3位添加一个逗号
            return ((index % 3) ? next : (next + ',')) + prev
        });
        return left + '.' + right;
    }

console.log(formatMoney('1234567890.999'));
// 输出结果：1,234,567,890.99

以上代码的思路是：首先将金额分割为整数部分和小数部分，然后对整数部分每3位数字添加一个逗号，并将整数部分和小数部分重新拼接成需要格式化的形式。

九、JS格式化金额还原

在有些情况下，我们需要对格式化后的金额进行还原，去掉千位分隔符等等。下面是一个将格式化后的金额还原为数字形式的演示代码：

function unFormatMoney(money) {
        return parseFloat(money.replace(/\,/g, ''));
    }

console.log(unFormatMoney('1,234,567,890.99'));
// 输出结果：1234567890.99

以上代码的思路是：使用replace()函数将金额中的逗号去掉，之后再使用parseFloat()函数将其转换为数字形式。

以上便是JS格式化的各个方面的介绍，不同的开发需求可能需要使用到上述的不同功能，希望这些代码能够对你在项目开发过程中有所帮助。