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


Posted in Javascript onMarch 05, 2011

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元素

Javascript 相关文章推荐
用YUI做了个标签浏览效果
Feb 20 Javascript
jquery $.ajax入门应用二
Nov 19 Javascript
基于jQuery的一个扩展form序列化到json对象
Dec 09 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 Javascript
深入理解JavaScript系列(41):设计模式之模板方法详解
Mar 04 Javascript
详解Javascript事件驱动编程
Jan 03 Javascript
详解js静态资源文件请求的处理
Aug 01 Javascript
Bootstrap treeview实现动态加载数据并添加快捷搜索功能
Jan 07 Javascript
node.js调用C++函数的方法示例
Sep 21 Javascript
JavaScript继承的特性与实践应用深入详解
Dec 30 Javascript
js tab栏切换代码实例解析
Sep 03 Javascript
javascript实现视频弹幕效果(两个版本)
Nov 28 Javascript
判断用户是否在线的代码
Mar 05 #Javascript
判断用户的在线状态 onbeforeunload事件
Mar 05 #Javascript
在多个页面使用同一个HTML片段《续》
Mar 04 #Javascript
在多个页面使用同一个HTML片段的代码
Mar 04 #Javascript
如何确保JavaScript的执行顺序 之实战篇
Mar 03 #Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
Mar 03 #Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
Mar 03 #Javascript
You might like
PHILIPS D1835/D1875的电路分析与打理
2021/03/02 无线电
php环境配置之CGI、FastCGI、PHP-CGI、PHP-FPM、Spawn-FCGI比较?
2011/10/17 PHP
解析PHP生成静态html文件的三种方法
2013/06/18 PHP
Laravel 5框架学习之向视图传送数据
2015/04/08 PHP
php输出图像的方法实例分析
2017/02/16 PHP
用JavaScript和注册表脚本实现右键收藏Web页选中文本
2007/01/28 Javascript
jQuery效果 slideToggle() 方法(在隐藏和显示之间切换)
2011/06/28 Javascript
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)
2013/07/09 Javascript
js中apply方法的使用详细解析
2013/11/04 Javascript
jquery.ajax的url中传递中文乱码问题的解决方法
2014/02/07 Javascript
jQuery实现统计输入文字个数的方法
2015/03/11 Javascript
js仿微博实现统计字符和本地存储功能
2015/12/22 Javascript
jQuery Easy UI中根据第一个下拉框选中的值设置第二个下拉框是否可以编辑
2016/11/29 Javascript
Vue 仿百度搜索功能实现代码
2017/02/16 Javascript
微信小程序分页加载的实例代码
2017/07/11 Javascript
垃圾回收器的相关知识点总结
2018/05/13 Javascript
基于Vue实现微信小程序的图文编辑器
2018/07/25 Javascript
vue动画打包后失效问题的解决方法
2018/09/18 Javascript
微信小程序修改数组长度的问题的解决
2019/12/17 Javascript
基于javascript原生判断DOM是否加载完毕
2020/10/14 Javascript
Vue 防止短时间内连续点击后多次触发请求的操作
2020/11/11 Javascript
python利用hook技术破解https的实例代码
2013/03/25 Python
Python3实现简单可学习的手写体识别(实例讲解)
2017/10/21 Python
python 读写中文json的实例详解
2017/10/29 Python
Python3.7中安装openCV库的方法
2018/07/11 Python
tensorflow saver 保存和恢复指定 tensor的实例讲解
2018/07/26 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
Python产生一个数值范围内的不重复的随机数的实现方法
2019/08/21 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
scrapy数据存储在mysql数据库的两种方式(同步和异步)
2020/02/18 Python
python如何从键盘获取输入实例
2020/06/18 Python
What is the purpose of Void class? Void类的作用是什么?
2016/10/31 面试题
授权收款委托书
2014/09/23 职场文书
工商局领导班子存在的问题整改措施思想汇报
2014/10/05 职场文书
丧事酒宴答谢词
2015/09/30 职场文书
Python中使用ipython的详细教程
2021/06/22 Python