JavaScript末尾逗号导致IE浏览器报错及排查方法

IE浏览器中JavaScript逗号语法报错原因

在使用ExtJS进行前端开发时，发现系统在Chrome和Firefox浏览器中能正常显示，但在IE浏览器中打开却会报错，错误提示为：Expected identifier, string or number。经过仔细检查代码后发现，该问题是由JavaScript代码中逗号使用不规范导致的IE浏览器不兼容。

由于开发环境使用的是Eclipse，下面介绍如何在Eclipse中解决这一问题。

例如，存在如下不规范代码片段：

Ext.onReady(function() {
var panel = Ext.create('Ext.container.Viewport', { 
layout : 'border',
items : [{
title : 'north panel',
html : 'north content',
region : 'north',
height : 100,
}, {
title : 'west panel',
html : 'west content',
region : 'west',
width : 150, // 这是备注1
}, {
title : 'main panel',
html : 'main content',
region : 'center',
/* 这是备注2*/
}]
});
});

使用Eclipse正则表达式检测不规范代码

可以看到，在数值100、150以及字符串center后面均存在逗号(,)，如果使用IE浏览器运行，将会导致报错。既然代码已经写成这样，如何检测出此类问题呢？

图1：File Search

如图1所示，可以利用Eclipse的File Search功能，通过正则表达式进行搜索，正则表达式为,\s*}。不过，这种方法存在局限，只能检索出上述的第一处错误，对于使用了//或/**/进行注释的情况，则无法检测出来。此外，也可以使用yuicompressor等JS代码压缩工具对代码进行压缩，压缩过程中会去除所有注释，随后再对压缩后的JS文件进行检测即可。当然，也可以自行编写算法来检测，但这对于普通开发者来说难度较大。

利用Spket插件自动检测与修复

不过，建议使用另一种方法，即利用插件。这里使用的是Spket插件，其官网为：http://www.spket.com/，可以从中下载Spket的Eclipse插件，也可以直接在Eclipse的market中下载。下载完成后安装该插件，然后将JS文件用Spket打开。

图2：利用Spket检测

如图2所示，可以发现Spket自动检测了代码中的不规范之处，并将有问题的地方标注出来。建议采用此方法，因为在编写代码时即可发现问题，有助于写出规范且美观的代码。另外提醒一下，有时兼容性问题是因使用了IE中不存在的对象所致，例如console对象在Firefox和Chrome中存在，但在IE中使用console.info会报错！因此，记得将一些不兼容的对象从代码中剔除。

以上介绍了JavaScript代码因逗号不规范导致IE不兼容的问题，希望对大家有所帮助！