JavaScript is a very fault-tolerant programming language, and many expressions that are not legal in other programming languages will work fine in JavaScript.
This results in a lot of weird code. Do you want to challenge it?
In this challenge, you will be presented with 20 wacky expressions and asked to guess their output.
1.
true + false
2.
**1.**
3.
[1, 2, 3] + [4, 5, 6]
4.
0.2 + 0.1 === 0.3
5.
10,2
6.
!!""
7.
+!![]
8.
true == "true"
9.
010 - 03
10.
"" - - ""
11.
null + 0
12.
0/0
13.
1/0 === 10 ** 1000
14.
true++
15.
"" - 1
16.
(null - 1) - "1"
17.
38 * 4343 * 2342+ ("true" — 0)
18.
5 + !5 + !!5
19.
[] + [1] + 2
20.
1 + 2 + "3"
true + false
When trying to use the addition operator (+) between two boolean values, they are converted to numbers.
And we all know true
should be converted to 1
and false
should be converted to 0
. So true+false
returns 1
.
[,,,].length
[,,,]
outputs an array with three empty slots. The last comma is the trailing comma.
You can think of it this way.
[,] ==> [empty,] [,,] ==> [empty, empty,] [,,,] ==> [empty, empty, empty,]
so [,,,].length
returns 3.
[1, 2, 3] + [4, 5, 6]
When you try to use the addition operator (+) between arrays, they are converted to strings.
When converting an array to a string, the array's toString()
method is called. The toString()
method is used internally by JavaScript. When an array needs to be displayed as text, it will connect its elements with commas.
[1, 2, 3].toString() ==> '1, 2, 3' [4, 5, 6].toString() ==> '4, 5, 6'
so
[1, 2, 3] + [4, 5, 6] ==> '1, 2, 3' + '4 , 5, 6' ==> "1,2,34,5,6"
0.2 + 0.1 === 0.3
Since floating point numbers are difficult to accurately represent in computers, mathematical 0.1
and 0.2
can only be approximated in computers. digital representation.
The result of 0.1+0.2
is not exactly 0.3
. Not just JavaScript, other programming languages have the same problem.
10, 2
The comma ( ,
) is also a legal operator in JavaScript, it evaluates each operand (from left to right) and returns the value of the last operand.
Therefore, 10,2 returns 2
!!""
""
is an empty string, which is a dummy value.
Note: 0, empty string "", null and undefined are all virtual values.
!
is the logical "not" operator, turning true into false and vice versa.
If we use !
twice, that is !!
, it will convert a normal value into a boolean value. So !""
returns false
.
+!![]
arrays are all true values, even empty arrays. So !![]
will return true
.
!![]; // -> true
and the +
sign converts the true value to its numeric representation: 1
, so +!![]
returns 1
.
true == "true"
The equality operator (==) checks whether its two operands are equal and returns a Boolean result.
According to the abstract equality comparison rules, both values are converted to numbers when compared.
true == "true" ==> Number(true) == Number("true") ==> 1 == NaN
So, ture =="true"
returns false.
010 - 03
Here's a little trick: if a number starts with 0
, it's treated as an octal number in JavaScript. So:
010 - 03 ==> 8 - 3 ==> 5
Also:
""--""
This seems like a bad syntax, but it does work fine.
The empty string can be converted to the Boolean value false or the numeric value 0. So -""
is 0
null + 0
As we said before, null
is a virtual value. It will be converted to the boolean value false
or the numeric value 0
. So the result returns 0
.
0/0
This is an illegal mathematical expression. The equation 0/0 doesn't have any meaningful numerical answer, the output is just NaN
.
1/0 === 10 1000**
Although 1/0
is an illegal mathematical expression as before. But when the divisor is not 0
, JavaScript thinks the result of this expression is Infinity
.
And 10**1000
is a large number, and JS cannot represent this number correctly. (The highest integer value in JavaScript is 2^53-1
). So 10 * 1000
is also regarded as infinity.
Infinity is always equal to another infinity, so 1/0 === 10 ** 1000
returns true.
true++
There's nothing special about this, it's just a syntax error.
""- 1While
the addition operator (+) works on both numbers and strings, the subtraction operator (-) is not useful on strings, so JavaScript interprets it as an operation between numbers. An empty string will be type-coerced to 0.
"" - 1 ==> Number("") - 1 ==> 0 - 1 ==> -1
so "" — 1
returns -1
(null - 1) - "1"
as above.
null ==> 0 (null - 1) ==> -1 "1" ==> 1
so (null — 1) — “1”
returns -2
38 4343 2342+ ("true" - 0)
You might suspect that JS is so crazy that it converts the string "true" Is the numeric representation of the Boolean value true. However, it's not that crazy. What's actually happening is that it's trying to convert the string to a number, but it's failing.
Number("true"); // -> NaN
In JavaScript numerical operations, as long as one value is NaN, the final result of the operation must be NaN. 38 * 4343 * 2342
is just a smokescreen.
5 + !5 + !!5
as stated above.
So:
!5 ==> 0 !!5 ==> 1
[] + [1] + 2
When trying to use the addition operator (+) between arrays, they are converted to strings.
[] ==> '' [1] ==> '1' [] + [1] ==> '1' '1' + 2 ==> '12'
so the result is '12'.
1 + 2 + "3"
JavaScript performs these operations from left to right. When the number 3 is added to the string 3, string concatenation will take precedence.
1 + 2; // -> 3 3 + "3"; // -> "33"
Frankly speaking, these challenges do not provide any value to our coding skills, so this kind of code should not be written in real projects
. However, consider these skills as friends Isn’t it a very interesting thing to pretend to be 13 with colleagues?
Author: Marina Mosti
Source: medium
Original text: https://medium.com/frontend-canteen/20-useless-but-funny-challange-for-javascript-develor-9eea39bb8efb
[Related video tutorial recommendations: web front-end]
The above are 20 weird JS expressions , guess the output result! For more details, please pay attention to other related articles on the php Chinese website!