在 ES2021 中，新增了 String.prototype.trimStart() 和 String.prototype.trimEnd() 两个方法，用于去除字符串开头和结尾的空白字符，这对于字符串相关的前端开发来说是非常实用的。但是，在实际使用过程中，我们发现这两个方法可能存在一些问题，在本文中，我们将从多个方面详细探讨这些问题，并提出解决方式，以指导前端工程师更好地应用这些新特性。
问题一：兼容性问题
在 ES12 发布之前，String.prototype.trimStart() 和 String.prototype.trimEnd() 方法并不存在于 ECMAScript 标准中，因此旧版浏览器不支持这两个方法，这可能导致一些兼容性问题。为了解决这个问题，我们可以在代码中添加以下 polyfill，以确保在旧版浏览器中也能正常使用这两个方法：
-- -------------------- ---- -------
-- ----------------------------- -
-------------------------- - ---------- -
------ -------------------- ----
--
-
-- --------------------------- -
------------------------ - ---------- -
------ -------------------- ----
--
-问题二：只能去除空白字符
String.prototype.trimStart() 和 String.prototype.trimEnd() 方法只能去除字符串开头和结尾的空白字符，无法去除字符串内部的空白字符。这可能导致一些问题：如果我们需要去除字符串内部的空白字符，还需要手动编写正则表达式或使用其他函数来完成这项任务。例如，我们可以使用以下代码去除字符串内部的所有空白字符：
const str = 'I am a string with spaces.'; const strWithoutSpaces = str.replace(/\s+/g, ''); // Iamastringwithspaces.
问题三：对于非字符串参数会发生类型转换
String.prototype.trimStart() 和 String.prototype.trimEnd() 方法只能用于字符串类型的值，如果传入的参数不是字符串，它们会尝试将参数转换为字符串再进行操作。这可能导致一些问题，因为它可能会修改传入的参数类型，改变参数的原始值。例如：
const num = 123; const numWithSpaces = num.trimStart(); // TypeError: num.trimStart is not a function
这时，会发生一个类型错误，因为 num 不是一个字符串。如果我们强制将 num 转换为字符串再进行操作，那么这个问题就可以得到解决：
const num = 123; const numWithSpaces = String(num).trimStart(); // 123
解决方案
为了解决上述问题，我们可以使用一些工具函数。例如，我们可以创建一个新的函数，使用 replace() 方法和正则表达式来去除字符串内部的所有空白字符：
function removeSpaces(str) {
return str.replace(/\s+/g, '');
}
const str = 'I am a string with spaces.';
const strWithoutSpaces = removeSpaces(str); // Iamastringwithspaces.对于兼容性问题，我们也可以使用一些现成的 polyfill 库，例如 core-js。通过引入这些库，我们可以轻松地解决浏览器兼容性问题。
除此之外，为了避免类型转换问题，我们还可以将 String.prototype.trimStart() 和 String.prototype.trimEnd() 方法进行封装，只允许字符串类型的参数进行操作。例如：
-- -------------------- ---- -------
-------- ------------------ -
-- ------- --- --- --------- -
------ ----
-
------ ----------------
-
-------- ---------------- -
-- ------- --- --- --------- -
------ ----
-
------ --------------
-
----- --- - ----
----- ------------- - ------------------- -- ---结论
String.prototype.trimStart() 和 String.prototype.trimEnd() 方法是非常有用的方法，在前端开发中经常会使用到。但是，在实际使用过程中，我们需要注意兼容性问题、不能去除字符串内部的空白字符及对于非字符串参数会发生类型转换的问题，我们可以使用 polyfill 库、工具函数和封装来解决这些问题，以便更好地应用这些新特性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/67388cd8317fbffedf11465a