ES9 新增 String.prototype.trimStart() 和 String.prototype.trimEnd() 方法

在 ES9（ECMAScript 2018）中，JavaScript 新增了两个字符串方法：String.prototype.trimStart() 和 String.prototype.trimEnd()。这两个方法用于去除字符串开头和结尾的空白字符。

为什么需要这两个方法

在前端开发中，我们经常需要处理用户输入的字符串。用户输入的字符串可能会包含空白字符，例如空格、制表符、换行符等。这些空白字符在某些情况下可能会导致问题，例如：

• 用户输入的密码中包含空格，导致无法登录
• 用户复制粘贴的链接中包含空格，导致打不开链接
• 用户输入的搜索关键字中包含空格，导致搜索结果不准确

为了解决这些问题，我们需要去除字符串开头和结尾的空白字符。在 ES9 之前，我们可以使用 String.prototype.trim() 方法去除字符串开头和结尾的空白字符。但是，这个方法只能去除开头和结尾的空白字符，不能去除字符串中间的空白字符。而且，这个方法是不可变的，即它不会修改原始字符串，而是返回一个新的字符串。这就意味着，每次调用这个方法都会创建一个新的字符串对象，会影响性能。

为了解决这些问题，ES9 新增了 String.prototype.trimStart() 和 String.prototype.trimEnd() 方法，可以去除字符串开头和结尾的空白字符，并且它们是可变的，即它们会修改原始字符串。

用法示例

String.prototype.trimStart()

String.prototype.trimStart() 方法用于去除字符串开头的空白字符。它的用法如下：

const str = '   hello world';
const trimmedStr = str.trimStart();
console.log(trimmedStr); // 'hello world'

在上面的代码中，str 字符串开头有三个空格字符，调用 trimStart() 方法后，返回一个新的字符串对象 'hello world'，去除了开头的空白字符。

String.prototype.trimEnd()

String.prototype.trimEnd() 方法用于去除字符串结尾的空白字符。它的用法如下：

const str = 'hello world   ';
const trimmedStr = str.trimEnd();
console.log(trimmedStr); // 'hello world'

在上面的代码中，str 字符串结尾有三个空格字符，调用 trimEnd() 方法后，返回一个新的字符串对象 'hello world'，去除了结尾的空白字符。

String.prototype.trimStart() 和 String.prototype.trimEnd() 的组合使用

String.prototype.trimStart() 和 String.prototype.trimEnd() 方法可以组合使用，用于去除字符串开头和结尾的空白字符。它的用法如下：

const str = '   hello world   ';
const trimmedStr = str.trimStart().trimEnd();
console.log(trimmedStr); // 'hello world'

在上面的代码中，str 字符串开头和结尾都有三个空格字符，先调用 trimStart() 方法去除开头的空白字符，再调用 trimEnd() 方法去除结尾的空白字符，返回一个新的字符串对象 'hello world'。

总结

ES9 新增的 String.prototype.trimStart() 和 String.prototype.trimEnd() 方法，可以用于去除字符串开头和结尾的空白字符，解决了在前端开发中处理用户输入字符串的问题。这两个方法是可变的，即它们会修改原始字符串，不会创建新的字符串对象，因此性能更好。在实际开发中，可以根据需要选择使用这两个方法。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/657d6a4cd2f5e1655d83bcbd