Home > Web Front-end > JS Tutorial > body text

The shortest IE judgment var ie=!-[1,] analysis_javascript skills

WBOY
Release: 2016-05-16 16:46:40
Original
1113 people have browsed it

The previous shortest IE judgment was based on the fact that IE does not support vertical tabs.

Copy code The code is as follows:

var ie = ! "v1";

Only 7bytes required! See this article, "32 bytes, ehr ... 9, ehr ... 7!!! to know if your browser is IE", which tells how foreigners reduced the determination of IE from 32 bytes to 7 step by step The story of bytes! But this record was broken by a Russian on January 8 this year, and now it is only 6 bytes! It was made by taking advantage of the difference in the toString method of IE and standard browsers in processing arrays. For standard browsers, if the last character in the array is a comma, the JS engine will automatically remove it.

Copy code The code is as follows:

var ie = !-[1,];

This code was called the shortest IE judgment code in the world before IE9. Although the code is short, it does contain a lot of basic JavaScript knowledge. In this example, when the code is executed, the toString() method of the array will be called first. When [1,].toString() is executed, "1," will be obtained in IE6, 7, and 8. Then the expression becomes !-"1,". Then try to convert "1," into a numerical type to get NaN, and then negative NaN to get the value still NaN. Finally execute !NaN and return true. Let’s review the JavaScript knowledge involved in the code by decomposing this statement:

1. Differences in browser array literal parsing

[1,] indicates that an array is defined using JavaScript’s array literal. In IE6, 7, and 8, the array has two elements, and the values ​​in the array are 1 and undefined respectively. In standard browsers, undefined after the first element is ignored, and the array contains only one element, 1.

2. Array toString() method

When calling the toString() method of the array object, the toString() method will be called for each element in the array. If the value of the element is NULL or undefined, an empty string will be returned, and then the value of each item will be obtained. Create a string separated by commas ",".

3. Unary minus operator

When using the unary minus operator, if the operand is a numeric type, the operand will be negatived directly. Otherwise, it will first try to convert the operand to a numeric type. The conversion process is equivalent to executing the Number function, and then converting the result Take the negative.

4. Logical NOT operation

Returns true if the operand is NaN, NULL or undefined when performing a logical NOT operation.

JavaScript can be written like this:

Copy code The code is as follows:

var ie = !-[1,];
alert(ie);

If you judge from a non-IE perspective, you can save a bit, because when we do compatibility, in most cases, IE and non-IE work. var notIE = -[1,];

Copy code The code is as follows:

if(-[1,]){
alert("This is not IE!");
}else{
alert("This is IE browser!");
}

Through the above knowledge, we can conclude that the code var ie = !-[1,]; is actually equivalent to var ie = !(-Number([1,].toString())); in IE678 the value is true .

Because IE6/7/8 will not ignore the [1,].ToString() bug, that is, what you get is "1,"; and -Number([1,].toString()) is -Number The result obtained by ("1,") is NaN; then!(-Number([1,].toString())) is!(NaN) and true is obtained. The premise of everything is that IE6/7/8 has the bug [1,].ToString()=>"1,", while other browsers (probably most~~) have [1,].ToString ()=>"1".

Recently I found a friend using this method to prompt users to upgrade their browsers

<script>
!-[1,] && alert('您使用的是 IE6-8 版本的浏览器,
\n建议用 Chrome, Firefox, IE9+ 浏览!');
</script>
Copy after login
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template