如何让这个 youtube videoId 解析 RegExp 在 JS 中工作？

Question

我正在尝试使用此处介绍的这个出色的 RegEx 从任何 youtube 类型的 url 中获取视频 ID：

parse youtube video id using preg_match

// getting our youtube url from an input field.
var yt_url = $('#yt_url').val();

var regexp = new RegExp('%(?:youtube(?:-nocookie)?\\.com/(?:[^/]+/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\\.be/)([^"&?/ ]{11})%','i');
var videoId = yt_url.match( regexp ) ;

console.log('vid: '+videoId);

我的控制台总是给我一个 null videoId。我是否错误地转义了我的正则表达式 var 中的某些内容？我已经添加了第二个反斜杠来转义单个反斜杠。

挠头？

Answer 1

% 是您从中获取链接的 PHP 的分隔符，使用 new RegExp() 时 Javascript 不需要分隔符。另外，看起来\\. 可能应该替换为\. 试试：

var regexp = new RegExp('(?:youtube(?:-nocookie)?\.com/(?:[^/]+/.+/|(?:v|e(?:mbed)?)/|.*[?&]v=)|youtu\.be/)([^"&?/ ]{11})','i');

此外，您可以使用 Javascript 的 /.../ 分隔符逐字创建正则表达式，但是您需要转义所有 /s：

var regexp = /(?:youtube(?:-nocookie)?\.com\/(?:[^/]+\/.+\/|(?:v|e(?:mbed)?)\/|.*[?&]v=)|youtu\\.be\/)([^"&?\/ ]{11})/i;

Documentation

---

更新：

快速更新以解决有关文字表达式 (/ab+c/) 与构造函数 (new RegExp("ab+c")) 效率的评论。文档说：

正则表达式文字在脚本加载时提供正则表达式的编译。当正则表达式保持不变时，使用它以获得更好的性能。

还有：

使用构造函数提供正则表达式的运行时编译。当您知道正则表达式模式将发生变化时，或者您不知道该模式并从其他来源（例如用户输入）获取它时，请使用构造函数。

由于您的表达式将始终是静态的，我会说从字面上创建它（第二个示例）会稍微快一些，因为它是在加载时编译的（但是，不要将此混淆为认为它不会创建 @ 987654333@ 对象）。 quick benchmark test 确认了这个小差异。