JavaScript如何使用正则函数实现指定长度文本自动换行
自定义单行最大字符数的文本换行实现
你找到的原始换行函数是硬编码了32字符的固定宽度,仅支持传入待处理字符串,要实现自定义宽度只需要把正则里写死的长度值替换为动态参数即可,具体改造方法如下:
改造后的可复用函数
因为JavaScript的正则字面量不支持直接嵌入变量,我们需要用RegExp构造函数动态生成匹配规则,同时保留原实现优先在空格处断行、不拆分完整单词的逻辑:
const wrapFunction = (s, maxLineChars) => { // 动态生成对应宽度的换行匹配正则,注意对反斜杠做转义 const lineBreakReg = new RegExp(`(?![^\\n]{1,${maxLineChars}}$)([^\\n]{1,${maxLineChars}})\\s`, 'g'); return s.replace(lineBreakReg, '$1\n'); };
调用方式
和预期的调用逻辑完全一致,第一个参数传原始文本字符串,第二个参数传自定义的单行最大字符数即可,返回值就是加入\n作为换行符的处理后文本:
let stringName = "Here is my really long string, that I want to wrap every 20 or so characters" let maxChars = 20; // 自定义每行最多显示20个字符 let newString = wrapFunction(stringName, maxChars);
效果说明
以上示例代码运行后,得到的换行结果如下,断行位置都在空格处,不会把完整单词从中间拆分:
Here is my really long string, that I want to wrap every 20 or so characters
补充说明:如果你的文本里存在长度超过
maxLineChars的连续无空格内容(比如超长英文单词、连续符号串),这个实现不会强行截断这类内容,如果你需要强制拆分超长内容,可以在现有逻辑基础上补充一轮对剩余超长片段的截断处理即可。
内容的提问来源于stack exchange,提问作者scryptonight
相关产品推荐
相关产品推荐

