在前端开发中，处理用户输入是一个常见的问题。用户输入的数据往往包含了额外的空格或者换行符等不必要的字符，这些字符不仅影响页面的展示效果，还可能导致一些不必要的错误。ES10 中新增的 String.trimStart 和 String.trimEnd 方法可以帮助我们快速地处理这些不必要的字符，让用户输入更加规范化。
String.trimStart 和 String.trimEnd 的使用方法
String.trimStart 和 String.trimEnd 方法分别用于去除字符串开头和结尾的空格或者换行符等不必要的字符。这两个方法的使用方法非常简单，只需要在字符串对象上直接调用即可。
const str = ' hello world \n'; console.log(str.trimStart()); // 'hello world \n' console.log(str.trimEnd()); // ' hello world'
这两个方法都会返回一个新的字符串，原始字符串不会被修改。需要注意的是，这两个方法只会去除字符串开头和结尾的空格或者换行符等不必要的字符，中间的空格或者换行符不会被去除。
String.trimStart 和 String.trimEnd 的深入理解
在 ES10 之前，我们可以使用 String.trim 方法去除字符串开头和结尾的空格或者换行符等不必要的字符。但是，String.trim 方法只能去除空格和换行符，对于其他的字符无能为力。例如，我们可以使用 String.trim 方法去除字符串开头和结尾的下划线，但是对于中间的下划线，String.trim 方法是无法处理的。
const str = '__hello world__'; console.log(str.trim()); // 'hello world'
对比 String.trim 方法，String.trimStart 和 String.trimEnd 方法可以去除任意字符，这使得它们在处理用户输入时更加灵活。例如，我们可以使用 String.trimStart 方法去除字符串开头的下划线，使用 String.trimEnd 方法去除字符串结尾的下划线。
const str = '__hello world__';
console.log(str.trimStart('_').trimEnd('_')); // 'hello world'除了去除任意字符，String.trimStart 和 String.trimEnd 方法还可以接受一个可选的参数，用于指定需要去除的字符。这个参数可以是一个字符串，也可以是一个正则表达式。
const str = '---hello world---';
console.log(str.trimStart('-')); // 'hello world---'
console.log(str.trimEnd('-')); // '---hello world'
console.log(str.trimStart('-').trimEnd('-')); // 'hello world'
console.log(str.trimStart(/-/g)); // 'hello world---'
console.log(str.trimEnd(/-/g)); // '---hello world'
console.log(str.trimStart(/-/g).trimEnd(/-/g)); // 'hello world'String.trimStart 和 String.trimEnd 的指导意义
String.trimStart 和 String.trimEnd 方法的引入，让我们在处理用户输入时更加灵活，可以去除任意字符，而不仅仅是空格和换行符。这使得我们可以更加方便地处理用户输入，提高用户体验。同时，这两个方法也可以用于去除字符串开头和结尾的特定字符，这在一些特定的场景下非常有用。
在使用 String.trimStart 和 String.trimEnd 方法时，需要注意的是，这两个方法只会去除字符串开头和结尾的空格或者换行符等不必要的字符，中间的空格或者换行符不会被去除。同时，这两个方法返回的是一个新的字符串，原始字符串不会被修改。
总结
ES10 中新增的 String.trimStart 和 String.trimEnd 方法可以帮助我们快速地处理用户输入，让用户输入更加规范化。这两个方法可以去除任意字符，而不仅仅是空格和换行符，同时也可以用于去除字符串开头和结尾的特定字符。在使用这两个方法时，需要注意它们只会去除字符串开头和结尾的空格或者换行符等不必要的字符，中间的空格或者换行符不会被去除。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65c9f7e4add4f0e0ff3d3310