当前位置:首页 > JavaScript

js replaceall实现

2026-02-01 16:31:41JavaScript

在 JavaScript 中实现 replaceAll

JavaScript 的 String.prototype.replaceAll() 方法用于替换字符串中所有匹配的子串。以下是几种实现方式:

使用原生 replaceAll 方法(ES2021+)

现代浏览器和 Node.js(12+)支持原生 replaceAll

js replaceall实现

const str = "Hello World, World!";
const newStr = str.replaceAll("World", "JavaScript");
console.log(newStr); // "Hello JavaScript, JavaScript!"

使用正则表达式全局替换

通过正则表达式配合 g 标志实现全局替换:

const str = "Hello World, World!";
const newStr = str.replace(/World/g, "JavaScript");
console.log(newStr); // "Hello JavaScript, JavaScript!"

手动实现 replaceAll(兼容旧环境)

若需兼容不支持 replaceAll 的环境,可手动实现:

js replaceall实现

function replaceAll(str, search, replacement) {
    return str.split(search).join(replacement);
}

const str = "Hello World, World!";
const newStr = replaceAll(str, "World", "JavaScript");
console.log(newStr); // "Hello JavaScript, JavaScript!"

注意事项

  • search 参数是字符串,需处理特殊字符(如正则元字符)时,需手动转义:

    function escapeRegExp(string) {
        return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
    }
    
    const str = "Hello. World. World!";
    const newStr = str.replace(new RegExp(escapeRegExp("."), 'g'), "!");
    console.log(newStr); // "Hello! World! World!"
  • 空字符串替换时,replaceAll 会在每个字符间插入替换内容:

    console.log("abc".replaceAll("", "x")); // "xaxbxcx"

以上方法覆盖了不同场景下的字符串全局替换需求。

标签: jsreplaceall
分享给朋友:

相关文章

js实现动画

js实现动画

使用 CSS 动画与 JavaScript 控制 通过 JavaScript 动态添加或移除 CSS 类来触发动画。CSS 定义关键帧(@keyframes),JavaScript 通过 classL…

js实现继承

js实现继承

原型链继承 通过将子类的原型指向父类的实例实现继承。子类实例可以访问父类原型上的属性和方法。 function Parent() { this.name = 'parent'; } Paren…

js实现图片上传

js实现图片上传

图片上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现图片上传功能。HTML部分需要创建一个文件选择输入框和一个用于…

js实现日历

js实现日历

实现日历的基本思路 使用JavaScript实现日历的核心是动态生成日期表格,并处理月份切换逻辑。需要计算当前月的天数、起始星期几,并动态渲染到页面上。 获取当前日期信息 通过Date对象获取当前年…

js实现图片预览

js实现图片预览

使用FileReader API实现图片预览 通过FileReader对象读取用户选择的图片文件并显示预览: const input = document.getElementById('image…

js实现图片放大缩小

js实现图片放大缩小

实现图片放大缩小的基础方法 使用CSS的transform: scale()属性可以快速实现图片的放大缩小效果。通过JavaScript动态修改该属性值: const img = document…