Understanding the "+" Operator in Javascript

Some "strange" statements, such as {code...}, are often seen in online or interview questions ...} in Javascript, The + operator is an overload operator. It can be used to splice strings and add two "Numbers. In which case it depends on the types of parameters on both sides of the operator. In our daily development, we also see some "strange" statements on the Internet or interview questions, such

{}+{}// "[object Object][object Object]"{}+[]// 0[]+{}// "[object Object]"[]+[]// ""

In Javascript+An operator is an overload operator that concatenates strings and adds two "Numbers. In which case it depends on the types of parameters on both sides of the operator.
We will not encounter such troubles in daily development, but it is always good to clarify. In terms of the specifications, balabara mentioned a bunch of things:

1. For the native type, if one of the parameters is a string, it is connected by a string. Otherwise, it is added by number. If it is not a number, it is converted into a number and then added.

Native types include undefined, null, boolean, number, and string.

The following are some examples:

0 + '1' // '01' null + 1 // 1 true + 1 // 2 false + 1 // 0 undefined + 2 // NaN, because undefined is converted to NaN

2. For the reference type, you must first convert it to the native type and then add it according to the above rules. There are detailed descriptions of how to convert the specifications, but the specifications seem a bit difficult. Simply put: by default, all are converted to strings. If you want to create a special character string, rewrite it.valueOf()Method.

Here is an example:

function Complex(a, b) {  this.a = a;  this.b = b;}Complex.prototype.valueOf() {  return this.a;}new Complex(2, 3) + new Complex(4, 5);// 6

However, JavaScript does not support real operator overloading, that is, it cannot be used together to obtain custom type objects. Therefore, the above examples are rarely used in practical code.

However, the current knowledge is sufficient to answer the original question. But it's slow,{}+[]Why and[]+{}Different? This is actually a syntax problem. The former is equivalent:

{}+[]

Actually two sentences,[]Convert to 0. Easy to verify({}+[]) === '[object Object]'

+[]  // 0

Someone may asknew Date()OfvalueOf()Isn't it converted to a number? Why is the result of adding a string?

new Date().valueOf();// 14919047570871 + new Date();// "1Tue Apr 11 2017 18:02:16 GMT+0800 (CST)"

This is a special processing of the Date class, @ toPrimitive. By defaultDateIs connected by a string, but the comparison is converted to a number.

New Date () <new Date ('1970-01-01 ') // true, now 2018

Converting a reference type to a native type is useful in many operators, such<,>So it is necessary to study it. The following js Code roughly describes its behavior.

/*** @ Param input refers to the object to be converted * @ preferredType refers to the expected type to be converted, which can be string or number */function ToPrimitive (input, preferredType) {if (typeof input! = 'Object') {return input; // originally native type} var hint = preferredType | 'default '; if (typeof input ['@ toPrimitive'] = 'function') {// @ toPrimitive is an internal method, here is just an example to illustrate how it works: return input ['@ toPrimitive'] (input, hint ); // This is why Date can be specially processed} if (hint = 'string') {return input. toString ();} return input. valueOf ();}

For more information, see specifications.

Some "strange" statements are often seen on the Internet or interview questions, such

{}+{}// "[object Object][object Object]"{}+[]// 0[]+{}// "[object Object]"[]+[]// ""

In Javascript+An operator is an overload operator that concatenates strings and adds two "Numbers. In which case it depends on the types of parameters on both sides of the operator.
We will not encounter such troubles in daily development, but it is always good to clarify. In terms of the specifications, balabara mentioned a bunch of things:

1. For the native type, if one of the parameters is a string, it is connected by a string. Otherwise, it is added by number. If it is not a number, it is converted into a number and then added.

Native types include undefined, null, boolean, number, and string.

The following are some examples:

0 + '1' // '01' null + 1 // 1 true + 1 // 2 false + 1 // 0 undefined + 2 // NaN, because undefined is converted to NaN

2. For the reference type, you must first convert it to the native type and then add it according to the above rules. There are detailed descriptions of how to convert the specifications, but the specifications seem a bit difficult. Simply put: by default, all are converted to strings. If you want to create a special character string, rewrite it.valueOf()Method.

Here is an example:

function Complex(a, b) {  this.a = a;  this.b = b;}Complex.prototype.valueOf() {  return this.a;}new Complex(2, 3) + new Complex(4, 5);// 6

However, JavaScript does not support real operator overloading, that is, it cannot be used together to obtain custom type objects. Therefore, the above examples are rarely used in practical code.

However, the current knowledge is sufficient to answer the original question. But it's slow,{}+[]Why and[]+{}Different? This is actually a syntax problem. The former is equivalent:

{}+[]

Actually two sentences,[]Convert to 0. Easy to verify({}+[]) === '[object Object]'

+[]  // 0

Someone may asknew Date()OfvalueOf()Isn't it converted to a number? Why is the result of adding a string?

new Date().valueOf();// 14919047570871 + new Date();// "1Tue Apr 11 2017 18:02:16 GMT+0800 (CST)"

This is a special processing of the Date class, @ toPrimitive. By defaultDateIs connected by a string, but the comparison is converted to a number.

New Date () <new Date ('1970-01-01 ') // true, now 2018

Converting a reference type to a native type is useful in many operators, such<,>So it is necessary to study it. The following js Code roughly describes its behavior.

/*** @ Param input refers to the object to be converted * @ preferredType refers to the expected type to be converted, which can be string or number */function ToPrimitive (input, preferredType) {if (typeof input! = 'Object') {return input; // originally native type} var hint = preferredType | 'default '; if (typeof input ['@ toPrimitive'] = 'function') {// @ toPrimitive is an internal method, here is just an example to illustrate how it works: return input ['@ toPrimitive'] (input, hint ); // This is why Date can be specially processed} if (hint = 'string') {return input. toString ();} return input. valueOf ();}

The above is a detailed description of the "+" Operator in Javascript. For more information, see other related articles in the first PHP community!