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作用域和闭包使用详解
Apr 25 Javascript
JavaScript中使用typeof运算符需要注意的几个坑
Nov 08 Javascript
javascript面向对象快速入门实例
Jan 13 Javascript
js将当前时间格式化为 年-月-日 时:分:秒的实现代码
Jan 20 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
回顾Javascript React基础
Jun 15 Javascript
JavaScript在web自动化测试中的作用示例详解
Aug 25 Javascript
Node.JS用纯JavaScript生成图片或滑块式验证码功能
Sep 12 Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 Javascript
Vue使用自定义指令实现拖拽行为实例分析
Jun 06 Javascript
react-native 实现购物车滑动删除效果的示例代码
Jan 15 Javascript
详解如何在Canvas中添加事件的方法
Apr 17 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版
2016/07/22 PHP
PHP获取文本框、密码域、按钮的值实例代码
2017/04/19 PHP
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.3
2008/03/22 Javascript
Jquey拖拽控件Draggable使用方法(asp.net环境)
2010/09/28 Javascript
JS实现简单的键盘打字的效果
2015/04/24 Javascript
AngularJS中的$watch(),$digest()和$apply()区分
2016/04/04 Javascript
聊一聊JS中的prototype
2016/09/29 Javascript
jQuery ajax MD5实现用户注册即时验证功能
2016/10/11 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
2016/11/11 Javascript
jQuery EasyUI的TreeGrid查询功能实现方法
2017/08/08 jQuery
JS实现按钮添加背景音乐示例代码
2017/10/17 Javascript
浅谈Vue响应式(数组变异方法)
2018/05/07 Javascript
vuejs 制作背景淡入淡出切换动画的实例
2018/09/01 Javascript
微信小程序实现侧边栏分类
2019/10/21 Javascript
Vue Cli3 打包配置并自动忽略console.log语句的方法
2020/04/23 Javascript
vue导入.md文件的步骤(markdown转HTML)
2020/12/31 Vue.js
[46:47]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS NE
2014/05/22 DOTA
python操作日期和时间的方法
2014/03/11 Python
简单讲解Python中的字符串与字符串的输入输出
2016/03/13 Python
python strip() 函数和 split() 函数的详解及实例
2017/02/03 Python
Django自定义认证方式用法示例
2017/06/23 Python
python3学习之Splash的安装与实例教程
2018/07/09 Python
Python实现中值滤波去噪方式
2019/12/18 Python
python模拟哔哩哔哩滑块登入验证的实现
2020/04/24 Python
Python+PyQt5+MySQL实现天气管理系统
2020/06/16 Python
解决redis与Python交互取出来的是bytes类型的问题
2020/07/16 Python
css3实现的多级渐变下拉菜单导航效果代码
2015/08/31 HTML / CSS
门卫岗位职责
2013/11/15 职场文书
学生自我评价范文
2014/02/02 职场文书
个人查摆剖析材料
2014/02/04 职场文书
2015年挂职锻炼工作总结
2014/12/12 职场文书
工作失职检讨书
2015/01/26 职场文书
2015年党日活动总结范文
2015/03/25 职场文书
电影焦裕禄观后感
2015/06/09 职场文书
七年级之家长会发言稿范文
2019/09/04 职场文书
基于Python实现对比Exce的工具
2022/04/07 Python