正则/(?<=page=)(.*?)(?=&)/在Safari中不兼容问题求解

你使用的正则/(?<=page=)(.*?)(?=&)/用到了**零宽正向后行断言（后瞻断言）**语法(?<=page=)，该语法是ES2018才纳入ECMAScript标准的特性，低版本Safari（包括部分iOS端内嵌WebView）未实现对该语法的支持，解析正则时会直接抛出语法错误，导致匹配逻辑完全失效。
除此之外原正则本身存在场景漏判问题：如果page是URL的最后一个查询参数（例如?sort=time&page=3，参数末尾没有&符号），正则末尾的正向先行断言(?=&)会匹配失败，无法拿到正确参数值。

优先选择无断言的捕获组写法，可实现全浏览器版本兼容，同时覆盖更多参数场景：

• 基础兼容版本
  正则写法：/page=([^&]*)/
  逻辑说明：直接匹配page=字符串，后续连续的非&字符即为参数值，存入第一个捕获组，不需要依赖任何高版本正则断言特性。
  调用示例：

  const testUrl = 'https://demo.com/list?page=2&tag=js'
  const matchRes = testUrl.match(/page=([^&]*)/)
  const pageVal = matchRes ? matchRes[1] : null
  // 运行结果 pageVal === "2"
  

• 严谨边界版本
  如果需要避免匹配到articlepage=2、next_page=3这类带page前缀的自定义参数，可以给参数前加边界判断，正则写法：/[?&]page=([^&]*)/
  逻辑说明：限定page参数必须出现在?（查询串开头）或者&（参数分隔符）之后，彻底避免前缀误匹配，同样全浏览器兼容。
  调用示例：

  const testUrl2 = 'https://demo.com/list?articlepage=4&page=5'
  const matchRes2 = testUrl2.match(/[?&]page=([^&]*)/)
  const pageVal2 = matchRes2 ? matchRes2[1] : null
  // 运行结果 pageVal2 === "5"，不会误取articlepage的参数值4
  

如果业务不需要兼容IE等极老旧浏览器，也可以直接使用原生URLSearchParams API解析查询参数，不需要手写正则：

const urlIns = new URL('https://demo.com/list?page=2&tag=js')
const pageVal = urlIns.searchParams.get('page')
// 直接返回"2"，自动处理参数边界、编码解码等问题

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