js定义对象或数组直接量时各浏览器对多余逗号的处理(json)

 更新时间:2011年03月05日 13:46:29   作者:  
定义对象或数组直接量时不同浏览器引擎对多余逗号的处理,js报错分为两种:语法错误和运行错误。
1、js引擎在代码载入时进行语法分析,如果js写的不规范则语法分析通不过。这时候的错误称为语法错误
2、语法分析通过了,js引擎会执行代码。执行期间发生的错误称为运行错误

不同引擎处理这2种错误的提示不太一样。如下:
复制代码 代码如下:

var p = {name:"Jack",age:33,};//注意33后有个逗号
p.toString = function() {return "姓名:" +this.name + ",年龄:" + this.age};
console.log(p);
alert(p);//姓名:Jack,年龄33<br>

firefox下测试,引擎会忽略33后的逗号,可以通过语法检查,在执行期也不会报错
IE6/7下测试,语法分析期就报错了,当然也不会进入执行期了。
不过在IE8下已经修复此问题,不会报错了。其它浏览器也不会报错。

总结下:此错误很难发现,经常是不小心就加了个逗号,或者定义了一个很多属性的对象或数组后来又要删除其中的某些而不小心留下了多余的逗号。
复制代码 代码如下:

//不规范的写法
var p = {name:"Jack",age:33,};
var ary = ["one","two","three",];
//规范的写法
var p = {name:"Jack",age:33};
var ary = ["one","two","three"];

此外,定义数组直接量时也可能碰到这个问题,如数组最后多了个逗号
复制代码 代码如下:

var ary = [1,2,];
console.log(ary.length);

IE6/7/8 输出length为3,IE9及其它浏览器为2。ECMAScript 5 11.1.4 其中有段说明了应该忽略最后的逗号。但直到IE9才实现该规范。其它浏览器则没问题。

ECMAScript 5 11.1.4 写道:

Array elements may be elided at the beginning, middle or end of the element list. Whenever a comma in the element list is not preceded by an AssignmentExpression (i.e., a comma at the beginning or after another comma), the missing array element contributes to the length of the Array and increases the index of subsequent elements. Elided array elements are not defined. If an element is elided at the end of an array, that element does not contribute to the length of the Array.

有人曾经利用了数组的这个特性创造出了所谓《全世界最短的IE判断》
复制代码 代码如下:

var ie = !-[1,];
alert(ie);

但在IE9下被终止了。不要利用这个Bug去判断浏览器。

JSON

在JSON格式中,逗号是多个属性键值对间的分隔符,例如:

var json = { id: 1, name: 'heero' };

但在编程的时候,很容易会画蛇添足,在最后一对键值对后也加上了逗号

var json = { id: 1, name: 'heero', };

在这种情况下,IE6、7会报错,但IE8以及其他浏览器则没有问题。

数组

在数组中,逗号是元素间的分隔符,例如:

var arr = [1, 2, 3];

同样地,我们也有可能不小心在最后一个元素后加了逗号

var arr = [1, 2, 3,];

凭直觉来说,这应该是错误的语法。但实际上,所有浏览器都对这种情况实现了兼容,包括IE6。考虑这样一段示例代码:

var arr = [1, 2, 3,];
for (var i = 0; i < arr.length; i++) { alert(arr[i]); }

在IE以外的浏览器上,均依次输出1、2、3;但在IE浏览器上,却是依次输出1、2、3、undefined。明显地,IE在那个多余的逗号后加了一个undefined元素

再考虑另一种情况,多余的逗号不在末尾,而是在中间:

var arr = [1, 2,, 3,];
for (var i = 0; i < arr.length; i++) { alert(arr[i]); }

所有浏览器均输出1、2、undefined、3,可见处理方式是一样的,就是在多余的逗号前插入一个undefined元素

相关文章

  • js原生轮播图插件制作

    js原生轮播图插件制作

    这篇文章主要为大家详细介绍了js原生轮播图插件制作,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-10-10
  • javascript textContent与innerText的异同分析

    javascript textContent与innerText的异同分析

    因为发现网络上很少有这方面的内容,因此就把自己私有blog上的这篇文章搬出来到Boluor的公开blog,方便其它人查阅。
    2010-10-10
  • JavaScript实现下拉菜单的显示隐藏

    JavaScript实现下拉菜单的显示隐藏

    这篇文章主要为大家详细介绍了JavaScript实现下拉菜单的显示隐藏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • 部分网站允许空白referer的防盗链图片的js破解代码

    部分网站允许空白referer的防盗链图片的js破解代码

    主要是有些网站的图片调用是防盗链的但一般只是判断referer是不是自己网站,如果referer为空也会显示图片,所以有了下面的代码。
    2011-05-05
  • javascript forEach函数实现代码

    javascript forEach函数实现代码

    在Base2中找到一个叫forEach的函数,是我见过的最好的实现。挖出来分析一下。它能对各种普通对象,字符串,数组以及类数组进行遍历。如果原游览器的对象已实现此函数,它则调用原对象的函数。
    2010-01-01
  • JSuggest自动匹配下拉框使用方法(示例代码)

    JSuggest自动匹配下拉框使用方法(示例代码)

    本篇文章主要是对JSuggest自动匹配下拉框使用方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
    2013-12-12
  • 微信小程序使用picker实现时间和日期选择框功能【附源码下载】

    微信小程序使用picker实现时间和日期选择框功能【附源码下载】

    这篇文章主要介绍了微信小程序使用picker实现时间和日期选择框功能,结合实例形式分析了微信小程序picker组件进行日期与时间选择的相关操作技巧,并附带源码供读者下载参考,需要的朋友可以参考下
    2017-12-12
  • 再次谈论Javascript中的this

    再次谈论Javascript中的this

    javascript中的this应用非常广泛,对js中this总是似是而非的感觉,今天小编豁然开朗,然后再次给大家谈论js中的this关键,感兴趣的朋友跟着小编一起看看吧
    2016-06-06
  • js绘制一条直线并旋转45度

    js绘制一条直线并旋转45度

    这篇文章主要为大家详细介绍了js绘制一条直线并旋转45度,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-08-08
  • three.js开发3d地图的实现示例

    three.js开发3d地图的实现示例

    本文主要介绍了three.js开发3d地图的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2023-07-07

最新评论