JavaScript检测URL是否包含http/https/www时正则匹配失败问题排查

问题原因 #

你写的正则表达式中(http(s)?):\/\/部分是强制必选匹配项，要求字符串必须包含http://或者https://前缀才能命中规则。第二个测试用例www.codepen.io没有带http/https协议头，因此匹配失败返回false。

另外补充一个你代码里的隐藏问题：正则加了全局匹配标识g时，RegExp.test()方法会残留上次匹配的lastIndex状态，多次调用同个正则实例可能出现不符合预期的结果，你的场景不需要用到全局匹配，可以去掉g标识。

修复方案 #

将协议头部分修改为可选匹配即可满足你的测试需求，修改后的代码如下：

const test = (str) => {
  // 给协议头部分加?标记为可选，去掉不必要的全局匹配标识
  const res = /((https?:\/\/)?www\.)/i;
  return res.test(str);
};

console.log(test('https://www.codepen.io')); // true
console.log(test('www.codepen.io')); // true
console.log(test('http://www.codepen.io')); // true

内容的提问来源于stack exchange，提问作者Asking