在 JavaScript 中截断字符串

javascriptweb developmentfront end technologyobject oriented programming更新于 2025/1/17 1:48:17

在给定的问题陈述中,我们被要求借助 JavaScript 功能截断字符串。我们可以借助 JavaScript 的内置函数slice() 和 substr() 来解决这个问题。

截断字符串是什么意思?

让我们了解截断字符串的含义。

截断字符串意味着通过从输入字符串的开头、结尾或中间部分删除字符来缩短字符串的长度。截断字符串的目的是通过从输入源中截断不必要的信息来腾出一定的空间或使其更具可读性。

例如,如果一篇文章中有很长的字符串,我们可能希望将其缩短到较短的长度,以便它可以轻松地放在我们的文章中,而不会换行或占用太多空间。

上述问题的逻辑

让我们了解创建上述问题陈述的逻辑:

我们必须将给定的输入字符串截断为函数中给定的一定长度,并将其显示在浏览器上。为此,我们将使用一些 Javascript 的内置函数。

在 Javascript 中,我们可以使用slice() 方法和substr() 方法截断字符串。slice() 函数返回一个包含原始字符串一部分的新字符串,并传递起始索引和指定索引处的结束。虽然 substring 的工作原理与slice() 方法类似,但此方法指定结束索引,我们指定要提取的子字符串的长度。

算法 - 使用slice() 方法

步骤 1 - 定义一个名为 str 的字符串变量,其中包含长字符串。

步骤 2 - 使用上述字符串并将此字符串传递给slice 方法。起始索引 0 到结束索引 20。此步骤将从第 0 个索引到第 20 个索引截断给定的字符串。

步骤 3 - 在上述步骤中截断字符串后,控制台输出。

示例

// 定义要截断的字符串
const str = "I am writing a string to truncate in Javascript";
const truncatedStr = str.slice(0, 20) + "...";
//截断给定字符串后
console.log(truncatedStr);

输出

I am writing a strin...

算法 - 使用 substr() 方法

步骤 1 - 定义一个字符串数据类型的变量并将其命名为 str,其中包含长字符串。

步骤 2 - 使用上述字符串并将此字符串传递给 substr() 函数,该函数是 Javascript 的内置函数。起始索引 0 到结束索引 25。此步骤将从第 0 个索引截断给定的字符串到第 20 个索引。

步骤 3 - 在上述步骤中截断字符串后,控制台输出。

示例

// 定义要截断的长字符串
const str = "我在 Javascript 中使用 substr() 方法截断";
const truncatedStr = str.substr(0, 25) + "...";
//截断给定字符串后
console.log(truncatedStr);

输出

I am using substr() metho...

算法

步骤 1 − 定义一个名为 str 的字符串变量,其中包含长字符串。

步骤 2 − 使用上述字符串并将此字符串传递给 replace() 函数,该函数是 Javascript 的内置函数。它使用正则表达式截断到索引 20。

步骤 3 − 在上述步骤中截断字符串后,控制台输出。

示例

//定义要截断的字符串
const str = "This is a long string that needs to be truncated";
const truncatedStr = str.replace(/^(.{20}[^\s]*).*/, "$1...");
//截断给定字符串后
console.log(truncatedStr);

输出

This is a long string...

复杂度

上面定义的方法slice()、substr()和replace的时间复杂度为O(n)。这里n是输入原始字符串的大小。这种复杂性的原因是这些方法迭代字符串中的字符并通过复制所选字符来创建新的子字符串。

虽然正则表达式方法的时间复杂度为O(k),但其中k是与正则表达式模式匹配的字符数。在第三个代码中,正则表达式匹配字符串的前20个字符。

结论

在此代码中,我们使用javascript中的内置函数实现了不同类型的算法。我们可以在这里注意到,出于实际目的,对于大多数合理长度的字符串,这些方法之间的性能差异可能可以忽略不计。所采用方法的选择取决于代码的可读性和可维护性等因素。


相关文章


有用资源