ECMAScript 2020: 格式化字符串的多种方法与场景
在前端开发中，字符串是不可避免的一部分。而如何格式化字符串则成为了一个重要的问题。ECMAScript 2020为我们提供了多种方法来格式化字符串，本文将详细介绍这些方法以及它们的应用场景。
一、模板字面量
模板字面量是ECMAScript 6中引入的一种新的字符串语法，它使用反引号（`）包裹字符串，并可以在其中使用${}来引用变量或表达式。模板字面量可以将变量或表达式的值嵌入到字符串中，从而实现字符串的格式化。
示例代码：
const name = 'Tom';
const age = 18;
console.log(`My name is ${name}, I am ${age} years old.`);输出结果：
My name is Tom, I am 18 years old.
模板字面量可以直接嵌套，也可以使用标签函数进行进一步处理，因此非常灵活。
二、String.prototype.padStart()和String.prototype.padEnd()
String.prototype.padStart()和String.prototype.padEnd()是ECMAScript 2017中引入的两个新的字符串方法，它们可以在字符串的开头或结尾填充指定的字符，从而实现字符串的格式化。
String.prototype.padStart()用于在字符串的开头填充指定的字符，可以指定填充后字符串的总长度和填充的字符。
示例代码：
const str = 'hello'; console.log(str.padStart(10, '0'));
输出结果：
00000hello
String.prototype.padEnd()用于在字符串的结尾填充指定的字符，同样可以指定填充后字符串的总长度和填充的字符。
示例代码：
const str = 'hello'; console.log(str.padEnd(10, '0'));
输出结果：
hello00000
String.prototype.padStart()和String.prototype.padEnd()可以用于数字的格式化，例如在数字前面填充0，或者在货币金额后面填充空格等。
三、Intl.NumberFormat
Intl.NumberFormat是ECMAScript 2015中引入的一个新的国际化API，它可以将数字格式化为不同的货币金额、百分比等形式。
Intl.NumberFormat的构造函数接受两个参数，第一个参数是语言标记，第二个参数是一个选项对象，用于指定格式化的样式。
示例代码：
const num = 123456.789;
console.log(new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(num));
console.log(new Intl.NumberFormat('zh-CN', { style: 'currency', currency: 'CNY' }).format(num));
console.log(new Intl.NumberFormat('en-US', { style: 'percent' }).format(num));输出结果：
$123,456.79 ￥123,456.79 12,345,679%
Intl.NumberFormat支持的样式有currency（货币金额）、percent（百分比）、decimal（小数）、unit（单位）、compact（紧凑形式）等，可以根据不同的需求进行选择。
四、总结
本文介绍了ECMAScript 2020中多种字符串格式化的方法，包括模板字面量、String.prototype.padStart()和String.prototype.padEnd()以及Intl.NumberFormat。这些方法可以根据不同的场景进行选择，从而实现字符串的格式化和美化。在实际开发中，我们应该根据需求选择最合适的方法来进行字符串格式化，以提高代码的可读性和可维护性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65cc458fadd4f0e0ff5b7e79