Do you know why ++ [[] [+ [] + [+ [] = 10?

Preface

There are always some people in this world who like the truth and research. No, on stackoverflow, someone seriously raises this question. Fortunately,ProgramMembers will always be one of the most helpful people in the world, so some people are enthusiastic about blabla's explanation.

To see the source address can go here: http://stackoverflow.com/questions/7202157/can-you-explain-why-10

Problem

 
++ [[] [+ [] + [+ [] 
 

In JS, If we assign a value to a variable like this, it is not difficult to find that it can indeed return a value, and it is still 10, in addition, you can see more such test results here.

So why does it return a value? Why is it 10 again?

Cause

Many enthusiastic people give their own explanations. I will not list them here. I only translate the best answers (he explained them in the most detail ).

 
1. One of the best ways to solve the problem is to break it down and then conquer it separately. The same is true here. The above expression can be decomposed:

++ [[] [+ []
+
[+ []

2. In JS, the expression+ [] = 0 is true, which is actually related to the JS compiler design. Because Javascript is a weak type language, when we want to perform an operation on an object, the JS engine will always try to convert this object to an object type that meets the specified operation and then execute the operation. Here + will convert [] to 0 and then execute other results, the above expression can be further simplified as follows:++ [[] [0]
+
[0] Because [[] [0] indicates obtaining the first element of the array [[], we can get:
 

• [[] [0] returns the internal array of the array ([]). However, if we say [[] [0] =, to avoid incorrect expressions, we do not place the internal array as.

• ++ [[] [0] = a + 1, because in JS, ++ indicates auto-increment 1.

• ++ [[] [0] ===+ (a + 1), or in other words, the preceding result is always a number (in JS, the result of "+ 1" is not necessarily a number, but the result obtained by "+" is always a number)

3. Let's continue with the above steps to further simplify the expression. Here we replace a with [] and get the simplified result:

+ ([] + 1)
+
[0]

In JS, the result of the following expression is still true: [] + 1 = "1", because converting an empty array to a string is equivalent to "", according to this feature, we can draw the following conclusion:

• + ([] + 1) ===+ ("" + 1 );
• + ([] + 1) ==+ ("1 ");
• + ([] + 1) = 1.

4. Therefore, the expression can be further simplified to the following result:

1

+
[0]

 

[0] = "0" is also true. Why? In fact, the reason is the same as above. When performing the + operation, the JS engine finds that [0] is an array containing an element 0. Therefore, it will first convert the array into a string to execute the + operation (the array can match the tostring method, but it is not converted to a number by default ), therefore, [0] concatenates all the elements in it into a string "0 ".

5. Now we have reached the time to reveal the answer. Through the above layers, we finally found that a lot of things are actually dropping like this (number + String = string ):

1
+
"0"
=== "10"

Bazinga !!!

About + []

Is the problem over here? No, because many of you may still have some questions about the above explanation, let's add "+ []"

First, let's take a look at the description of the unary operator "+:

11.4.6 unary + operator

The unary + operator converts its operand to number type.

The production unaryexpression: + unaryexpression is evaluated as follows:

1. Let expr be the result of evaluating unaryexpression.

2. Return tonumber (getvalue (expr )).

Tonumber () Description:

Object

Apply the following steps:

1. Let primvalue be toprimitive (input argument, hint string ).

2. Return tostring (primvalue ).

Toprimitive () Description:

Object

Return a default value for the object. the default value of an object is retrieved by calling the [[defaultvalue] internal method of the object, passing the optional hint preferredtype. the behaviour of the [[defaultvalue] internal method is defined by this specification for all native ecmascript objects in 8.12.8.

[[Defaultvalue] Description:

8.12.8 [[defaultvalue] (hint)

When the [[defaultvalue] internal method of O is called with hint string, the following steps are taken:

1. Let tostring be the result of calling the [[get] internal method of object O with argument "tostring ".

2. If iscallable (tostring) is true then,

A. Let STR be the result of calling the [[Call] internal method of tostring, with O as the this value and an empty argument list.

B. If STR is a primitive value, return Str.

ForDescription of the. tostring method:

15.4.4.2 array. Prototype. tostring ()

When the tostring method is called, the following steps are taken:

1. Let array be the result of calling toobject on the this value.

2. Let func be the result of calling the [[get] internal method of array with argument "join ".

3. If iscallable (func) is false, then let func be the standard built-in method object. Prototype. tostring (15.2.4.2 ).

4. Return the result of calling the [[Call] internal method of func providing array as the this value and an empty arguments list.

Based on the above pile of blabla, we can draw a conclusion: + [] is equal to + "", because []. Join () = "".

 

Here, we go back to the definition of + again:

11.4.6 unary + operator

The unary + operator converts its operand to number type.

The production unaryexpression: + unaryexpression is evaluated as follows:

1. Let expr be the result of evaluating unaryexpression.

2. Return tonumber (getvalue (expr )).

The tonumber method of "" can be explained as follows:

The MV of stringnumericliteral: [empty] is 0.

Therefore, + "" = 0, and thus + [] = 0.

Postscript

In this world of sharing and digitalization, we may see and learn many things every day. Then, learning is one thing. It is another thing that we can truly apply what we have learned and integrate it into our work. the ultimate goal of our learning is to solve problems and create new things. However, we need to constantly summarize and think about how to use existing knowledge to solve problems.

So I will translate this article hereArticleIt is not just a pleasure for everyone. We hope that you and I can better learn how to use known and existing resources to solve the temporary problems in the new year.

I haven't written anything for a long time because of my work. At the end of the year, I finally wrote another article. Although it's just a translation, it is helpful to myself. I hope it will help you.

The level is limited. If you have a translation or incorrect explanation, please forgive me. If you have a brick, please pat it ~~

Finally, I wish you a happy New Year's Day and many year-end prizes!