JS基础-03：解决-正则替换单引号失效问题

概要内容

• 踩坑导火线
• 使用正则替换前后单引号
• 总结

踩坑由来：webpack配置环境变量，定义格式：project_name: '"产品1"'，然后有个需求就是给不同的合作伙伴打出不同产品名字的包。我全局搜索代码发现有很多地方都写死了“产品0”，脑子立马让我浮现一个方案：把project_name存到store里面，然后把用到的地方都采用$store.getters.product_name替换掉，再仔细一下这种方法改动量太大所以放弃了。由于我前段时间搞了个webpack条件编译的loader插件，瞬间让我想到了写一个webpack 的loader不就轻松搞懂了。嗯... 巴拉巴拉，开开心心瞬间搞完，把项目运行起来后怎么用到的地方多了一个单引号，正在匹配单引号失效的问题就出现了...

踩坑导火线

使用正则把前后单引号去掉

• 替换无效代码

  String.prototype.trim = function (char) {
  	let reg = `/(^${char})|(${char}$)/g`;
    let result = this.replace(reg, "");
    console.log("reg:" + reg);
    console.log("result:" + result);  
    return result;
  };
  
  let content = "'abc'";
  content.trim("'");
  
  //输出结果：
  //reg:/(^')|('$)/g
  //result:'abc'
  

• 替换成功代码

  String.prototype.trim = function (char) {
    let reg = new RegExp(`(^${char})|(${char}$)`,'g');
    let result = this.replace(reg, "");
    console.log("reg:" + reg);
    console.log("result:" + result);  
    return result;
  };
  
  let content = "'abc'";
  content.trim("'");
  
  //输出结果：
  //reg:/(^')|('$)/g
  //result:abc
  

• 最后对比：

  

  由于无法断点调进string的replace方法，也就不知道replace里面到底对这两种正则处理有何不同，如果你知道为什么或者怎么调进String的replace，请留言告诉我。谢谢~

总结

• 尽量采用RegExp类创建对象使用正则，避免直接//来使用正则

以上：如发现有问题，欢迎留言指出，我及时更正