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 相关文章推荐
JavaScript中的Window窗口对象
Jan 16 Javascript
javascript之通用简单的table选项卡实现(二)
May 09 Javascript
一个简单的网站访问JS计数器 刷新1次加1次访问
Sep 20 Javascript
javascript处理表单示例(javascript提交表单)
Apr 28 Javascript
js实现汉字排序的方法
Jul 23 Javascript
JS原型链怎么理解
Jun 27 Javascript
jquery判断iPhone、Android设备类型
Sep 14 Javascript
用Vue.js实现监听属性的变化
Nov 17 Javascript
vue高德地图之玩转周边
Jun 16 Javascript
MUI顶部选项卡的用法(tab-top-webview-main)详解
Oct 08 Javascript
前端开发之便利店收银系统代码
Dec 27 Javascript
Vue 中如何将函数作为 props 传递给组件的实现代码
May 12 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
PHP iconv 函数转gb2312的bug解决方法
2009/10/11 PHP
php和mysql中uft-8中文编码乱码的几种解决办法
2012/04/19 PHP
PHP利用APC模块实现大文件上传进度条的方法
2015/10/29 PHP
学习php设计模式 php实现桥梁模式(bridge)
2015/12/07 PHP
PHP Echo字符串的连接格式
2016/03/07 PHP
PHP计算近1年的所有月份
2017/03/13 PHP
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
2013/08/13 Javascript
appendChild() 或 insertBefore()使用与区别介绍
2013/10/11 Javascript
jquery动态添加删除(tr/td)
2015/02/09 Javascript
jQuery获得document和window对象宽度和高度的方法
2015/03/25 Javascript
JavaScript实现鼠标滑过图片变换效果的方法
2015/04/16 Javascript
javascript实现图片跟随鼠标移动效果的方法
2015/05/13 Javascript
js获取时间函数及扩展函数的方法
2016/10/30 Javascript
bootstrap 表单验证使用方法
2017/01/11 Javascript
js代码延迟一定时间后执行一个函数的实例
2017/02/15 Javascript
jquery实现手机端单店铺购物车结算删除功能
2017/02/22 Javascript
Bootstrap Tree View简单而优雅的树结构组件实例解析
2017/06/15 Javascript
详解JavaScript按概率随机生成事件
2017/08/02 Javascript
Node.js创建HTTP文件服务器的使用示例
2018/05/11 Javascript
Vue.js 事件修饰符的使用教程
2018/11/01 Javascript
vue多次循环操作示例
2019/02/08 Javascript
keep-Alive搭配vue-router实现缓存页面效果的示例代码
2020/06/24 Javascript
[10:53]2018DOTA2国际邀请赛寻真——EG
2018/08/11 DOTA
Python实现的快速排序算法详解
2017/08/01 Python
python简单实现操作Mysql数据库
2018/01/29 Python
在windows下Python打印彩色字体的方法
2018/05/15 Python
pandas DataFrame 根据多列的值做判断,生成新的列值实例
2018/05/18 Python
python3实现163邮箱SMTP发送邮件
2018/05/22 Python
pandas 对每一列数据进行标准化的方法
2018/06/09 Python
pandas DataFrame 警告(SettingWithCopyWarning)的解决
2019/07/23 Python
Tarte Cosmetics官网:美国最受欢迎的化妆品公司之一
2017/08/24 全球购物
澳大利亚UGG工厂直销:Australian Ugg Boots
2017/10/14 全球购物
PHP如何设置和取得Cookie值
2015/06/30 面试题
小学关爱留守儿童活动方案
2014/08/25 职场文书
高中校园广播稿
2014/10/21 职场文书
python用海龟绘图写贪吃蛇游戏
2021/06/18 Python