用于匹配/替换JavaScript注释的RegEx(多行和内联)

Question

我需要使用JavaScript RegExp对象从JavaScript源中删除所有JavaScript注释.

我需要的是RegExp的模式.

到目前为止,我发现了这个:

compressed = compressed.replace(/\/\*.+?\*\/|\/\/.*(?=[\n\r])/g, '');

此模式适用于:

/* I'm a comment */

或者:

/*
 * I'm a comment aswell
*/

但似乎不适用于内联:

// I'm an inline comment

我不是RegEx的专家和它的模式,所以我需要帮助.

另外,我想要一个RegEx模式,它将删除所有那些类似HTML的注释.

<!-- HTML Comment //--> or <!-- HTML Comment -->

还有那些条件HTML注释,可以在各种JavaScript源中找到.

谢谢.

Answer 1

注意:正则表达式不是词法分析器或解析器.如果您有一些奇怪的边缘情况,您需要从字符串中解析出一些奇怪的嵌套注释,请使用解析器.对于其他98%的时间,这个正则表达式应该工作.

我使用嵌套的星号,斜杠等进行了相当复杂的块注释.以下站点的正则表达式就像一个魅力:

http://upshots.org/javascript/javascript-regexp-to-remove-comments
(见下文原创)

已经进行了一些修改,但保留了原始正则表达式的完整性.为了允许某些双斜杠(//)序列(例如URL),必须$1在替换值中使用反向引用而不是空字符串.这里是:

/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm

// JavaScript: 
// source_string.replace(/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/gm, '$1');

// PHP:
// preg_replace("/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*$/m", "$1", $source_string);

演示: http ://www.regextester.com/ ? fam = 96247

失败的使用案例:有一些边缘情况,这个正则表达式失败.这个公开要点记录了这些案例的持续列表.如果您能找到其他案例,请更新要点.

......如果你也想删除<!-- html comments -->使用此:

/\/\*[\s\S]*?\*\/|([^\\:]|^)\/\/.*|<!--[\s\S]*?-->$/

(原件 - 仅供参考)

// DO NOT USE THIS - SEE ABOVE
/(\/\*([\s\S]*?)\*\/)|(\/\/(.*)$)/gm

Answer 2

试试这个,

(\/\*[\w\'\s\r\n\*]*\*\/)|(\/\/[\w\s\']*)|(\<![\-\-\s\w\>\/]*\>)

应该管用 :)

Answer 3

我一直在做一个需要做类似事情的表达.
成品是:

/(?:((["'])(?:(?:\\\\)|\\\2|(?!\\\2)\\|(?!\2).|[\n\r])*\2)|(\/\*(?:(?!\*\/).|[\n\r])*\*\/)|(\/\/[^\n\r]*(?:[\n\r]+|$))|((?:=|:)\s*(?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/))|((?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/)[gimy]?\.(?:exec|test|match|search|replace|split)\()|(\.(?:exec|test|match|search|replace|split)\((?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/))|(<!--(?:(?!-->).)*-->))/g

可怕吧？

为了分解它,第一部分匹配单引号或双引号内的任何内容
这是避免匹配引用字符串所必需的

((["'])(?:(?:\\\\)|\\\2|(?!\\\2)\\|(?!\2).|[\n\r])*\2)

第二部分匹配由/**/分隔的多行注释

(\/\*(?:(?!\*\/).|[\n\r])*\*\/)

第三部分匹配从行中的任何位置开始的单行注释

(\/\/[^\n\r]*(?:[\n\r]+|$))

第四到第六部分匹配正则表达式文字中的任何内容
这取决于前面的等号或正则表达式之前或之后的文字

((?:=|:)\s*(?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/))
((?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/)[gimy]?\.(?:exec|test|match|search|replace|split)\()
(\.(?:exec|test|match|search|replace|split)\((?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/))

我最初忘记的第七个删除了html评论

(<!--(?:(?!-->).)*-->)

我的开发环境发生了一个问题,因为正则表达式打破了一条线,因此我使用了以下解决方案

var ADW_GLOBALS = new Object
ADW_GLOBALS = {
  quotations : /((["'])(?:(?:\\\\)|\\\2|(?!\\\2)\\|(?!\2).|[\n\r])*\2)/,
  multiline_comment : /(\/\*(?:(?!\*\/).|[\n\r])*\*\/)/,
  single_line_comment : /(\/\/[^\n\r]*[\n\r]+)/,
  regex_literal : /(?:\/(?:(?:(?!\\*\/).)|\\\\|\\\/|[^\\]\[(?:\\\\|\\\]|[^]])+\])+\/)/,
  html_comments : /(<!--(?:(?!-->).)*-->)/,
  regex_of_doom : ''
}
ADW_GLOBALS.regex_of_doom = new RegExp(
  '(?:' + ADW_GLOBALS.quotations.source + '|' + 
  ADW_GLOBALS.multiline_comment.source + '|' + 
  ADW_GLOBALS.single_line_comment.source + '|' + 
  '((?:=|:)\\s*' + ADW_GLOBALS.regex_literal.source + ')|(' + 
  ADW_GLOBALS.regex_literal.source + '[gimy]?\\.(?:exec|test|match|search|replace|split)\\(' + ')|(' + 
  '\\.(?:exec|test|match|search|replace|split)\\(' + ADW_GLOBALS.regex_literal.source + ')|' +
  ADW_GLOBALS.html_comments.source + ')' , 'g'
);

changed_text = code_to_test.replace(ADW_GLOBALS.regex_of_doom, function(match, $1, $2, $3, $4, $5, $6, $7, $8, offset, original){
  if (typeof $1 != 'undefined') return $1;
  if (typeof $5 != 'undefined') return $5;
  if (typeof $6 != 'undefined') return $6;
  if (typeof $7 != 'undefined') return $7;
  return '';
}

这将返回由引用的字符串文本捕获的任何内容以及在正则表达式文本中找到的任何内容,但返回所有注释捕获的空字符串.

我知道这是过度的,而且很难维护,但到目前为止它似乎对我有用.

Answer 4

这适用于几乎所有情况：

var RE_BLOCKS = new RegExp([
  /\/(\*)[^*]*\*+(?:[^*\/][^*]*\*+)*\//.source,           // $1: multi-line comment
  /\/(\/)[^\n]*$/.source,                                 // $2 single-line comment
  /"(?:[^"\\]*|\\[\S\s])*"|'(?:[^'\\]*|\\[\S\s])*'/.source, // - string, don't care about embedded eols
  /(?:[$\w\)\]]|\+\+|--)\s*\/(?![*\/])/.source,           // - division operator
  /\/(?=[^*\/])[^[/\\]*(?:(?:\[(?:\\.|[^\]\\]*)*\]|\\.)[^[/\\]*)*?\/[gim]*/.source
  ].join('|'),                                            // - regex
  'gm'  // note: global+multiline with replace() need test
);

// remove comments, keep other blocks
function stripComments(str) {
  return str.replace(RE_BLOCKS, function (match, mlc, slc) {
    return mlc ? ' ' :         // multiline comment (replace with space)
           slc ? '' :          // single/multiline comment
           match;              // divisor, regex, or string, return as-is
  });
}

该代码基于 jspreproc 的正则表达式，我为riot 编译器编写了这个工具。

请参阅http://github.com/aMarCruz/jspreproc

Answer 5

在简单的 JS 正则表达式中，这样：

my_string_or_obj.replace(/\/\*[\s\S]*?\*\/|([^:]|^)\/\/.*$/gm, ' ')