H5有坑，名字不可以乱叫

问题来自一位叫小白的同事的疑问，问题如下：

var str = '[img_/storage/uploads/2016/1465955105.2148.jpg]';
str = str.replace(/\[img_(\S*)\]/g,"<img src='$1' class='chatImg'>");

或者

var str = '[img_/storage/uploads/2016/1465955105.2148.jpg]';
var name = new RegExp("\[img_(\S*)\]",'g');
str = str.replace(name,"<img src='$1' class='chatImg'>");

正则大神现身，这两种写法有什么区别？为什么结果不同？

无论怎么试都有问题，首先上面的正则有点问题，我们调整一下：

var str = '[img_/storage/uploads/2016/1465955105.2148.jpg]';
var aa = /\[img_(\S*)\]/g;
var bb = new RegExp("\\[img_(\\S\*)\\]",'g');
var cc = "<img src='$1' class='chatImg'>";

//方法1
str.replace(aa, cc);

//方法2
str.replace(bb, cc);

结果一样了，这就是一个正则的问题
本来到这里就完了，可是小白还是很执着的，为什么他写的不行，他再次用正确的正则来测试，代码贴出来如下：

显然他之前也测试过，只是用 replace 来做验证的，我测试也不通，就测试 new RegExp得出的结果是否一样了，不知不觉，改了变量名来测试了，重复的东西别我提取，专门测试不一样的地方，反而避免了这个 name 变量名的问题

var str = '[img_/storage/uploads/2016/1465955105.2148.jpg]';
var name = new RegExp("\\[img_(\\S\*)\\]",'g');
str = str.replace(name,"<img src='$1' class='chatImg'>");

怎么会还是不行，这次正则绝对没错了，都测试通过了

结果这次在控制台测试，确实不通过，咦为什么？

小白得出个暂时的结论：var 正则，不能用 name 来命名

这就奇怪了，哪有这样的道理，你以为你是谁啊，你又不是关键字、保留字，还不让作为变量用了，凭什么不让命名？还限制正则不让用？

没有这样的道理，这时我才注意到 name 这个名字的特别处，我有个印象，name 是作为 window 的一个属性在使用，作为当前窗口（tab 页）的名称，即使网站都跳转走了，只要当前窗口没变，那么 name 值一直存在，不跟 url 相关，这可以用来为跨域来用

这里难道有问题，于是专一测试 name 这个特殊变量：

var name = new RegExp("\\[img_(\\S\*)\\]",'g');
//输出 name
//"/\[img_(\S*)\]/g"

而

var bb = new RegExp("\\[img_(\\S\*)\\]",'g');
//输出 bb
//\[img_(\S*)\]/g

在控制台下调试，不细看就错过去了，差了分号，上面的结果实际变成字符串了

奇怪啊，正则不行，变量类型都变了，我试试其他数据类型，

也是不行，但在闭包里可以了，这是 name 这个值作为特定属性，被限制为“强数据类型”了，js 中一直没有此概念，普通变量，我想什么类型就什么类型，赋值就可以了，这里一个大坑，真是不可料想，变量类型不可变（自动转为 String 类型）

还有其他变量是这样的么，呵呵，这根本没法预料，这个浏览器用这个名字，鬼知道那么多浏览器，谁会不会偶尔又用了一个变量名字呢，他又有什么限制呢！！！

旧事重提，一直说尽量避免使用全局变量，今天又上了一课，如果不遵守，终会摔跟头，而且死都不知道怎么死的，另外变量名称真的不是随便用的，良好的命名规范，能避免出现这种情况，和非意义的变量名aa, bb相比，name明显有具体指代，指某名称，作为一个正则表达式的值来用，确有不合理之处，名字不可以随便叫啊。不过也正因为如此，发现这个变量名原来还有这种限制。

我们当前的开发，几乎不存在使用全局变量的情况了，全都使用闭包封装了，能避免变量被污染（或者出现上面变量类型被限制的情况），但个别情况，简单页面，还是存在不适用闭包把自己的变量全部包装的情况，这是很可能出问题

所以只要能用闭包包装，尽量把自己的逻辑包装起来，免得再出现类似的诡异问题