[译]String.prototype.replace 中的替换模式

282 阅读1分钟

原文:String.prototype.replace supports replacement patterns,by Stefan Judis

摄影 | Free-Photos

本文是我 Today I learned 系列文章中的一篇。本系列中分享了不限于 Web 开发领域的我的学习心得,欢迎阅读。

今天我读到 一篇博文(德语写的,作者 Peter Kröner),真让我学到了!

那篇文章里描述了 String.prototype.replace 方法不那么为人所知的行为表现。开发中,我们都知道甚至很常用这个方法,它支持正则表达式,大多数情况下,我们用它来把匹配的字符串,替换成另一个。

我是这么想的……🙈

使用这个方法时,如果第二个参数用的是字符串(当然也可以是函数),而且字符串里包含像 $&$' 这样的特殊字符序列时,输出的结果可能让你有点懵。

const msg = 'This is a great message';

msg.replace('great', 'wonderful'); 
// "This is a wonderful message"
//
// -> 'great' 替换成为 'wonderful'(跟我们想的一样)

msg.replace('great', '$&-$&');
// "This is a great-great message"
// '$&' 表示匹配到的字符串
//
// -> 'great' 替换成为 'great-great'

msg.replace('great', '$`');
// "This is a This is a  message"
// '$`' 表示匹配字符串的前半部分
//
// -> 'great' 替换成为 'This is a '

msg.replace('great', `$'`)
// "This is a  message message"
// `$'` 表示匹配字符串的后半部分
//
// -> 'great' 替换成为 ' message'

真的,这种行为表现很可能引入难以发现的 bug 呢!

想更多了解 replace 方法详细信息,请 参阅 MDN 文档 ~

(完)