最短的IE判断var ie=!-[1,]分析


Posted in Javascript onMay 28, 2014

 以前最短的IE判定借助于IE不支持垂直制表符的特性搞出来的。

 

 var ie = !+"\v1";

 

仅仅需要7bytes!参见这篇文章,《32 bytes, ehr ... 9, ehr ... 7!!! to know if your browser is IE》,讲述外国人是如何把IE的判定从32 bytes一步步缩简成7 bytes!的故事但这纪录今年1月8日被一个俄国人打破了,现在只要6 bytes!它利用了IE与标准浏览器在处理数组的toString方法的差异做成的。对于标准游览器,如果数组里面最后一个字符为逗号,JS引擎会自动剔除它。

var ie = !-[1,];

这句代码在IE9之前曾被称为世界上最短的IE判定代码。代码虽短但确包含了不少javascript基础知识在里面。在这个例子中代码执行时会先调用数组的toString()方法 ,执行[1,].toString()在IE6,7,8中将会得到"1,"。然后表达式就变为!-"1,"。再尝试把"1,"转换成数值类型得到NaN ,再对NaN取负得到值仍为NaN。最后执行!NaN返回true。下面通过分解这个语句来回顾下代码中所涉及到的javascript知识:

1. 浏览器的数组字面量解析差异

[1,]表示使用javascript的数组字面量定义了一个数组。 在IE6,7,8中数组有两个元素,数组中的值分别为1,undefined。在标准的浏览器中会忽略第一个元素后的undefined,数组只包含一个元素1。

2. 数组的toString()方法

调用数组对象的toString()方法时会对数组中的每个元素调用toString()方法,如果元素的值为NULL或者undefined时会返回空的字符串,然后将得到的每项的值拼成一个使用 逗号","分隔的字符串。

3. 一元减号运算符

使用一元减号运算符时如果运算数是数值类型则直接对运算数取负,否则会先尝试把运算数转换为数值类型,转换过程相当于执行Number函数,然后再对得到的结果取负。

4. 逻辑非运算

执行逻辑非运算时如果操作数为NaN、NULL或undefined 时返回 true。

JavaScript可以这么写:

var ie = !-[1,];   

   alert(ie); 

如果从非IE的角度判定,可以省一个比特,因为我们做兼容时,绝大多数情况都是IE与非IE地开工。 var notIE = -[1,];

if(-[1,]){  

     alert("这不是IE浏览器!");  

}else{  

     alert("这是IE浏览器!");  

}

通过上面的知识可以得出代码 var ie = !-[1,]; 其实等价于 var ie = !(-Number([1,].toString())); 在IE6\7\8中值为true。

因为IE6/7/8都不会忽略[1,].ToString()这个bug,即得到的是"1,";而-Number([1,].toString())即为-Number("1,")得到的结果是NaN;然后!(-Number([1,].toString()))即为!(NaN)即得到true。一切的前提是IE6/7/8都有[1,].ToString()=>"1,"这个bug,而其它浏览器(应该是大部分吧~~)则是[1,].ToString()=>"1"。

最近发现有朋友这样使用用来提示用户升级浏览器

<script>
!-[1,] && alert('您使用的是 IE6-8 版本的浏览器,\n\n建议用 Chrome, Firefox, IE9+ 浏览!');
</script>
Javascript 相关文章推荐
jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML
Oct 16 Javascript
Jquery上传插件 uploadify v3.1使用说明
Jun 18 Javascript
原生javaScript做得动态表格(注释写的很清楚)
Dec 29 Javascript
用js读、写、删除Cookie代码续篇
Dec 03 Javascript
JavaScript中对象介绍
Dec 31 Javascript
原生JavaScript实现异步多文件上传
Dec 02 Javascript
ES6新特征数字、数组、字符串
Oct 01 Javascript
微信小程序 switch组件详解及简单实例
Jan 10 Javascript
thinkphp标签实现bootsrtap轮播carousel实例代码
Feb 19 Javascript
vue.js的提示组件
Mar 02 Javascript
Vue使用watch监听一个对象中的属性的实现方法
May 10 Javascript
javascript 使用sleep函数的常见方法详解
Apr 26 Javascript
jQuery 1.9使用$.support替代$.browser的使用方法
May 27 #Javascript
什么是cookie?js手动创建和存储cookie
May 27 #Javascript
js打开windows上的可执行文件示例
May 27 #Javascript
JavaScript数值数组排序示例分享
May 27 #Javascript
JavaScript作用域链示例分享
May 27 #Javascript
Node调试工具JSHint的安装及配置教程
May 27 #Javascript
javaScript使用EL表达式的几种方式
May 27 #Javascript
You might like
全国FM电台频率大全 - 7 吉林省
2020/03/11 无线电
PHP中strtotime函数使用方法分享
2012/01/10 PHP
PHP逐行输出(ob_flush与flush的组合)
2012/02/04 PHP
php对图像的各种处理函数代码小结
2013/07/08 PHP
php 强制下载文件实现代码
2013/10/28 PHP
destoon首页调用求购供应信息的地区名称的方法
2014/08/21 PHP
PHP限制HTML内容中图片必须是本站的方法
2015/06/16 PHP
深入解析PHP中foreach语句控制数组循环的用法
2015/11/30 PHP
跟随鼠标旋转的文字
2006/11/30 Javascript
javascript 类定义的4种方法
2009/09/12 Javascript
jquery多浏览器捕捉回车事件代码
2010/06/22 Javascript
最短的IE判断var ie=!-[1,]分析
2014/05/28 Javascript
学习JavaScript鼠标响应事件
2015/12/25 Javascript
jQuery插件开发精品教程让你的jQuery提升一个台阶
2016/01/27 Javascript
基于jquery实现简单的分页控件
2016/03/17 Javascript
jquery 遍历数组 each 方法详解
2016/05/25 Javascript
利用js编写响应式侧边栏
2016/09/17 Javascript
获取当前月(季度/年)的最后一天(set相关操作及应用)
2016/12/27 Javascript
async/await让异步操作同步执行的方法详解
2019/11/01 Javascript
react结合bootstrap实现评论功能
2020/05/30 Javascript
vue cli3.0打包上线静态资源找不到路径的解决操作
2020/08/03 Javascript
Jquery $.map使用方法实例详解
2020/09/01 jQuery
Python中List.index()方法的使用教程
2015/05/20 Python
详解Python中for循环是如何工作的
2017/06/30 Python
python实现教务管理系统
2018/03/12 Python
python字典快速保存于读取的方法
2018/03/23 Python
Python设计模式之外观模式实例详解
2019/01/17 Python
Django models.py应用实现过程详解
2019/07/29 Python
Python调用.NET库的方法步骤
2019/12/27 Python
python 使用cycle构造无限循环迭代器
2020/12/02 Python
使用Html5 Stream开发实时监控系统
2020/06/02 HTML / CSS
音乐学院硕士生的自我评价分享
2013/11/01 职场文书
社区活动总结报告
2014/05/05 职场文书
大学生万能检讨书范例
2014/10/04 职场文书
中学生自我评价范文
2015/03/03 职场文书
Python实现为PDF去除水印的示例代码
2022/04/03 Python