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中数组的sort()方法的使用介绍
Dec 18 Javascript
javascript设计模式之中介者模式Mediator
Dec 30 Javascript
js实现网页抽奖实例
Aug 05 Javascript
JavaScript 七大技巧(二)
Dec 13 Javascript
JS实现禁止鼠标右键的功能
Oct 15 Javascript
VueJs路由跳转——vue-router的使用详解
Jan 10 Javascript
JavaScript函数中的this四种绑定形式
Aug 15 Javascript
浅谈angular4 ng-content 中隐藏的内容
Aug 18 Javascript
vue2.0基于vue-cli+element-ui制作树形treeTable
Apr 30 Javascript
模块化react-router配置方法详解
Jun 03 Javascript
vue+element 实现商城主题开发的示例代码
Mar 26 Javascript
Element Badge标记的使用方法
Jul 27 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中的MYSQL常用函数(php下操作数据库必备)
2010/09/12 PHP
php中替换字符串中的空格为逗号','的方法
2014/06/09 PHP
php实现Linux服务器木马排查及加固功能
2014/12/29 PHP
JavaScript 学习小结(适合新手参考)
2009/07/30 Javascript
javascript的函数、创建对象、封装、属性和方法、继承
2011/03/10 Javascript
使用JavaScript的ActiveXObject对象检测应用程序是否安装的方法
2014/04/15 Javascript
jquery左边浮动到一定位置时显示返回顶部按钮
2014/06/05 Javascript
浅谈javascript中自定义模版
2015/01/29 Javascript
jQuery前端分页示例分享
2015/02/10 Javascript
javascript中call,apply,bind的用法对比分析
2015/02/12 Javascript
Javascript实现获取及设置光标位置的方法
2015/07/21 Javascript
jquery判断复选框选中状态以及区分attr和prop
2015/12/18 Javascript
利用jquery实现瀑布流3种案例
2016/09/18 Javascript
js实现上传文件添加和删除文件选择框
2016/10/24 Javascript
jQuery ajax的功能实现方法详解
2017/01/06 Javascript
webpack2.0搭建前端项目的教程详解
2017/04/05 Javascript
jQuery.Ajax()的data参数类型详解
2017/07/23 jQuery
Express + Session 实现登录验证功能
2017/09/08 Javascript
Vue中render方法的使用详解
2018/01/26 Javascript
微信小程序表单弹窗实例
2018/07/19 Javascript
Vue 报错TypeError: this.$set is not a function 的解决方法
2018/12/17 Javascript
微信小程序的tab选项卡的实现效果
2019/05/15 Javascript
vue-next/runtime-core 源码阅读指南详解
2019/10/25 Javascript
Python3 chardet模块查看编码格式的例子
2019/08/14 Python
python redis存入字典序列化存储教程
2020/07/16 Python
python软件测试Jmeter性能测试JDBC Request(结合数据库)的使用详解
2021/01/26 Python
荷兰电脑专场:Paradigit
2018/05/05 全球购物
巴西化妆品商店:Lojas Rede
2019/07/26 全球购物
化学教师自荐信范文
2013/12/28 职场文书
物流专业大学生职业生涯规划书范文
2014/01/15 职场文书
《棉鞋里的阳光》教学反思
2016/02/20 职场文书
教你用python控制安卓手机
2021/05/13 Python
解决Pytorch中关于model.eval的问题
2021/05/22 Python
python geopandas读取、创建shapefile文件的方法
2021/06/29 Python
详解nginx安装过程并代理下载服务器文件
2022/02/12 Servers
clear 万能清除浮动(clearfix:after)
2023/05/21 HTML / CSS