最短的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 相关文章推荐
静态的动态续篇之来点XML
Aug 15 Javascript
javascript学习笔记(十六) 系统对话框(alert、confirm、prompt)
Jun 20 Javascript
js中replace的用法总结
Dec 27 Javascript
jquery操作cookie插件分享
Jan 14 Javascript
使用GruntJS构建Web程序之合并压缩篇
Jun 06 Javascript
Angularjs整合微信UI(weui)
Mar 15 Javascript
JQuery.validate在ie8下不支持的快速解决方法
May 18 Javascript
详解vue-resource promise兼容性问题
Jun 20 Javascript
JavaScript实现移动端页面按手机屏幕分辨率自动缩放的最强代码
Aug 18 Javascript
详解Vue+ElementUI从零开始搭建自己的网站(一、环境搭建)
Apr 30 Javascript
微信小程序 腾讯地图SDK 获取当前地址实现解析
Aug 12 Javascript
jQuery开发仿QQ版音乐播放器
Jul 10 jQuery
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
php中url传递中文字符,特殊危险字符的解决方法
2013/08/17 PHP
php Session存储到Redis的方法
2013/11/04 PHP
php的memcache类分享(memcache队列)
2014/03/26 PHP
PHP超牛逼无限极分类生成树方法
2015/05/11 PHP
浅析Yii2集成富文本编辑器redactor实例教程
2016/04/25 PHP
PHP一致性hash分布式算法封装类定义与用法示例
2018/08/04 PHP
jQuery-serialize()输出序列化form表单值的方法
2012/12/26 Javascript
cookie的复制与使用记住用户名实现代码
2013/11/04 Javascript
js使用eval解析json(js中使用json)
2014/01/17 Javascript
用jquery写的一个万年历(自写)
2014/01/20 Javascript
原生javascript实现隔行换色
2015/01/04 Javascript
jQuery实现瀑布流的取巧做法分享
2015/01/12 Javascript
jQuery解析XML文件同时动态增加js文件的方法
2015/06/01 Javascript
详解参数传递四种形式
2015/07/21 Javascript
JQuery点击行tr实现checkBox选中的简单实例
2016/05/26 Javascript
js实现页面刷新滚动条位置不变
2016/11/27 Javascript
jquery 校验中国身份证号码实例详解
2017/04/11 jQuery
Vue2.0+ElementUI实现表格翻页的实例
2017/10/23 Javascript
jQuery实现基本淡入淡出效果的方法详解
2018/09/05 jQuery
python类继承用法实例分析
2014/10/10 Python
Python中函数参数设置及使用的学习笔记
2016/05/03 Python
python3+PyQt5实现使用剪贴板做复制与粘帖示例
2017/01/24 Python
python 读取excel文件生成sql文件实例详解
2017/05/12 Python
使用Python对微信好友进行数据分析
2018/06/27 Python
windows下cx_Freeze生成Python可执行程序的详细步骤
2018/10/09 Python
Python-opencv 双线性插值实例
2020/01/17 Python
python map比for循环快在哪
2020/09/21 Python
西班牙英格列斯百货官网:El Corte Inglés
2016/09/25 全球购物
华为消费者德国官方网站:HUAWEI德国
2020/11/03 全球购物
linux面试题参考答案(7)
2014/07/24 面试题
EJB与JAVA BEAN的区别
2016/08/29 面试题
军校制空专业毕业生自我鉴定
2013/11/16 职场文书
班级活动策划书
2014/02/06 职场文书
家庭贫困证明书(3篇)
2014/09/15 职场文书
高中班长竞选稿
2015/11/20 职场文书
golang中字符串MD5生成方式总结
2021/07/04 Golang